Fossil SCM

Remove 'display: inline-block' from insertion and deletion marks to get more natural word-wrapping. Try whether the previous, precisely calculated line height and padding values also work to extend the background color to the entire line height.

florian 2024-08-23 06:01 diff-word-wrap
Commit b912690fc4479057651ac2436368a8b757dc385c149ccc9524e498d19e8b114d
2 files changed +6 -5 +12 -10
+6 -5
--- src/default.css
+++ src/default.css
@@ -565,15 +565,20 @@
565565
text-align: left;
566566
margin: 0;
567567
padding: 0;
568568
border: 0;
569569
font-family: monospace;
570
- line-height: 1.2;
570
+ line-height: 1.275;
571571
text-size-adjust: none;
572572
white-space: pre-wrap;
573573
word-wrap: break-word;
574574
}
575
+table.diff td del,
576
+table.diff td ins {
577
+ padding: 0.062em 0 0.062em 0;
578
+ text-decoration: none;
579
+}
575580
table.diff td.diffln {
576581
width: 0%;
577582
text-align: right;
578583
padding: 0 0.16em 0 0.32em;
579584
}
@@ -677,20 +682,16 @@
677682
td.difftxt.ins {
678683
background-color: #dafbe1;
679684
}
680685
td.difftxt.del del {
681686
background-color: #ffc0c0;
682
- text-decoration: none;
683
- display: inline-block;
684687
}
685688
td.difftxt.del del.edit {
686689
background-color: #c0c0ff;
687690
}
688691
td.difftxt.ins ins {
689692
background-color: #a0e4b2;
690
- text-decoration: none;
691
- display: inline-block;
692693
}
693694
td.difftxt.ins ins.edit {
694695
background-color: #c0c0ff;
695696
}
696697
body.tkt div.content li > table.udiff {
697698
--- src/default.css
+++ src/default.css
@@ -565,15 +565,20 @@
565 text-align: left;
566 margin: 0;
567 padding: 0;
568 border: 0;
569 font-family: monospace;
570 line-height: 1.2;
571 text-size-adjust: none;
572 white-space: pre-wrap;
573 word-wrap: break-word;
574 }
 
 
 
 
 
575 table.diff td.diffln {
576 width: 0%;
577 text-align: right;
578 padding: 0 0.16em 0 0.32em;
579 }
@@ -677,20 +682,16 @@
677 td.difftxt.ins {
678 background-color: #dafbe1;
679 }
680 td.difftxt.del del {
681 background-color: #ffc0c0;
682 text-decoration: none;
683 display: inline-block;
684 }
685 td.difftxt.del del.edit {
686 background-color: #c0c0ff;
687 }
688 td.difftxt.ins ins {
689 background-color: #a0e4b2;
690 text-decoration: none;
691 display: inline-block;
692 }
693 td.difftxt.ins ins.edit {
694 background-color: #c0c0ff;
695 }
696 body.tkt div.content li > table.udiff {
697
--- src/default.css
+++ src/default.css
@@ -565,15 +565,20 @@
565 text-align: left;
566 margin: 0;
567 padding: 0;
568 border: 0;
569 font-family: monospace;
570 line-height: 1.275;
571 text-size-adjust: none;
572 white-space: pre-wrap;
573 word-wrap: break-word;
574 }
575 table.diff td del,
576 table.diff td ins {
577 padding: 0.062em 0 0.062em 0;
578 text-decoration: none;
579 }
580 table.diff td.diffln {
581 width: 0%;
582 text-align: right;
583 padding: 0 0.16em 0 0.32em;
584 }
@@ -677,20 +682,16 @@
682 td.difftxt.ins {
683 background-color: #dafbe1;
684 }
685 td.difftxt.del del {
686 background-color: #ffc0c0;
 
 
687 }
688 td.difftxt.del del.edit {
689 background-color: #c0c0ff;
690 }
691 td.difftxt.ins ins {
692 background-color: #a0e4b2;
 
 
693 }
694 td.difftxt.ins ins.edit {
695 background-color: #c0c0ff;
696 }
697 body.tkt div.content li > table.udiff {
698
+12 -10
--- src/diffcmd.c
+++ src/diffcmd.c
@@ -243,15 +243,20 @@
243243
@ text-align: left;
244244
@ margin: 0;
245245
@ padding: 0;
246246
@ border: 0;
247247
@ font-family: monospace;
248
-@ line-height: 1.2;
248
+@ line-height: 1.275;
249249
@ text-size-adjust: none;
250250
@ white-space: pre-wrap;
251251
@ word-wrap: break-word;
252252
@ }
253
+@ table.diff td del,
254
+@ table.diff td ins {
255
+@ padding: 0.062em 0 0.062em 0;
256
+@ text-decoration: none;
257
+@ }
253258
@ table.diff td.diffln {
254259
@ width: 0%;
255260
@ text-align: right;
256261
@ padding: 0 0.16em 0 0.32em;
257262
@ }
@@ -288,20 +293,16 @@
288293
@ td.difftxt.ins {
289294
@ background-color: #dafbe1;
290295
@ }
291296
@ td.difftxt.del del {
292297
@ background-color: #ffc0c0;
293
-@ text-decoration: none;
294
-@ display: inline-block;
295298
@ }
296299
@ td.difftxt.del del.edit {
297300
@ background-color: #c0c0ff;
298301
@ }
299302
@ td.difftxt.ins ins {
300303
@ background-color: #a0e4b2;
301
-@ text-decoration: none;
302
-@ display: inline-block;
303304
@ }
304305
@ td.difftxt.ins ins.edit {
305306
@ background-color: #c0c0ff;
306307
@ }
307308
@ @media (prefers-color-scheme: dark) {
@@ -361,15 +362,20 @@
361362
@ text-align: left;
362363
@ margin: 0;
363364
@ padding: 0;
364365
@ border: 0;
365366
@ font-family: monospace;
366
-@ line-height: 1.2;
367
+@ line-height: 1.275;
367368
@ text-size-adjust: none;
368369
@ white-space: pre-wrap;
369370
@ word-wrap: break-word;
370371
@ }
372
+@ table.diff td del,
373
+@ table.diff td ins {
374
+@ padding: 0.062em 0 0.062em 0;
375
+@ text-decoration: none;
376
+@ }
371377
@ table.diff td.diffln {
372378
@ width: 0%;
373379
@ text-align: right;
374380
@ padding: 0 0.16em 0 0.32em;
375381
@ }
@@ -409,20 +415,16 @@
409415
@ background-color: #a2dbb2;
410416
@ }
411417
@ td.difftxt.del del {
412418
@ color: #000;
413419
@ background-color: #cc5555;
414
-@ text-decoration: none;
415
-@ display: inline-block;
416420
@ }
417421
@ td.difftxt.del del.edit {
418422
@ background-color: #c0c0ff;
419423
@ }
420424
@ td.difftxt.ins ins {
421425
@ background-color: #559855;
422
-@ text-decoration: none;
423
-@ display: inline-block;
424426
@ }
425427
@ td.difftxt.ins ins.edit {
426428
@ background-color: #c0c0ff;
427429
@ }
428430
@ </style>
429431
--- src/diffcmd.c
+++ src/diffcmd.c
@@ -243,15 +243,20 @@
243 @ text-align: left;
244 @ margin: 0;
245 @ padding: 0;
246 @ border: 0;
247 @ font-family: monospace;
248 @ line-height: 1.2;
249 @ text-size-adjust: none;
250 @ white-space: pre-wrap;
251 @ word-wrap: break-word;
252 @ }
 
 
 
 
 
253 @ table.diff td.diffln {
254 @ width: 0%;
255 @ text-align: right;
256 @ padding: 0 0.16em 0 0.32em;
257 @ }
@@ -288,20 +293,16 @@
288 @ td.difftxt.ins {
289 @ background-color: #dafbe1;
290 @ }
291 @ td.difftxt.del del {
292 @ background-color: #ffc0c0;
293 @ text-decoration: none;
294 @ display: inline-block;
295 @ }
296 @ td.difftxt.del del.edit {
297 @ background-color: #c0c0ff;
298 @ }
299 @ td.difftxt.ins ins {
300 @ background-color: #a0e4b2;
301 @ text-decoration: none;
302 @ display: inline-block;
303 @ }
304 @ td.difftxt.ins ins.edit {
305 @ background-color: #c0c0ff;
306 @ }
307 @ @media (prefers-color-scheme: dark) {
@@ -361,15 +362,20 @@
361 @ text-align: left;
362 @ margin: 0;
363 @ padding: 0;
364 @ border: 0;
365 @ font-family: monospace;
366 @ line-height: 1.2;
367 @ text-size-adjust: none;
368 @ white-space: pre-wrap;
369 @ word-wrap: break-word;
370 @ }
 
 
 
 
 
371 @ table.diff td.diffln {
372 @ width: 0%;
373 @ text-align: right;
374 @ padding: 0 0.16em 0 0.32em;
375 @ }
@@ -409,20 +415,16 @@
409 @ background-color: #a2dbb2;
410 @ }
411 @ td.difftxt.del del {
412 @ color: #000;
413 @ background-color: #cc5555;
414 @ text-decoration: none;
415 @ display: inline-block;
416 @ }
417 @ td.difftxt.del del.edit {
418 @ background-color: #c0c0ff;
419 @ }
420 @ td.difftxt.ins ins {
421 @ background-color: #559855;
422 @ text-decoration: none;
423 @ display: inline-block;
424 @ }
425 @ td.difftxt.ins ins.edit {
426 @ background-color: #c0c0ff;
427 @ }
428 @ </style>
429
--- src/diffcmd.c
+++ src/diffcmd.c
@@ -243,15 +243,20 @@
243 @ text-align: left;
244 @ margin: 0;
245 @ padding: 0;
246 @ border: 0;
247 @ font-family: monospace;
248 @ line-height: 1.275;
249 @ text-size-adjust: none;
250 @ white-space: pre-wrap;
251 @ word-wrap: break-word;
252 @ }
253 @ table.diff td del,
254 @ table.diff td ins {
255 @ padding: 0.062em 0 0.062em 0;
256 @ text-decoration: none;
257 @ }
258 @ table.diff td.diffln {
259 @ width: 0%;
260 @ text-align: right;
261 @ padding: 0 0.16em 0 0.32em;
262 @ }
@@ -288,20 +293,16 @@
293 @ td.difftxt.ins {
294 @ background-color: #dafbe1;
295 @ }
296 @ td.difftxt.del del {
297 @ background-color: #ffc0c0;
 
 
298 @ }
299 @ td.difftxt.del del.edit {
300 @ background-color: #c0c0ff;
301 @ }
302 @ td.difftxt.ins ins {
303 @ background-color: #a0e4b2;
 
 
304 @ }
305 @ td.difftxt.ins ins.edit {
306 @ background-color: #c0c0ff;
307 @ }
308 @ @media (prefers-color-scheme: dark) {
@@ -361,15 +362,20 @@
362 @ text-align: left;
363 @ margin: 0;
364 @ padding: 0;
365 @ border: 0;
366 @ font-family: monospace;
367 @ line-height: 1.275;
368 @ text-size-adjust: none;
369 @ white-space: pre-wrap;
370 @ word-wrap: break-word;
371 @ }
372 @ table.diff td del,
373 @ table.diff td ins {
374 @ padding: 0.062em 0 0.062em 0;
375 @ text-decoration: none;
376 @ }
377 @ table.diff td.diffln {
378 @ width: 0%;
379 @ text-align: right;
380 @ padding: 0 0.16em 0 0.32em;
381 @ }
@@ -409,20 +415,16 @@
415 @ background-color: #a2dbb2;
416 @ }
417 @ td.difftxt.del del {
418 @ color: #000;
419 @ background-color: #cc5555;
 
 
420 @ }
421 @ td.difftxt.del del.edit {
422 @ background-color: #c0c0ff;
423 @ }
424 @ td.difftxt.ins ins {
425 @ background-color: #559855;
 
 
426 @ }
427 @ td.difftxt.ins ins.edit {
428 @ background-color: #c0c0ff;
429 @ }
430 @ </style>
431

Keyboard Shortcuts

Open search /
Next entry (timeline) j
Previous entry (timeline) k
Open focused entry Enter
Show this help ?
Toggle theme Top nav button