Fossil SCM
Try dynamic calculation of the top and bottom paddings of inserted and deleted text so that the background color extends exactly to the line height (using the `calc()' CSS function). In Chromium, `overflow-y: hidden' is required so that the table cell containing the diff line doesn't display vertical scrollbars (without otherwise changing the visual result).
Commit
db04882760ace54c7f263a0e9b23c187020a9c720de4fd5fa3496fca89004fbe
Parent
ef298b282a22b59…
2 files changed
+2
-1
+4
-2
+2
-1
| --- src/default.css | ||
| +++ src/default.css | ||
| @@ -572,11 +572,11 @@ | ||
| 572 | 572 | white-space: pre-wrap; |
| 573 | 573 | word-wrap: break-word; |
| 574 | 574 | } |
| 575 | 575 | table.diff td del, |
| 576 | 576 | table.diff td ins { |
| 577 | - padding: 0.062em 0 0.062em 0; | |
| 577 | + padding: calc((1em*1.275 - 1em)/2) 0; | |
| 578 | 578 | text-decoration: none; |
| 579 | 579 | } |
| 580 | 580 | table.diff td.diffln { |
| 581 | 581 | width: 0%; |
| 582 | 582 | text-align: right; |
| @@ -658,10 +658,11 @@ | ||
| 658 | 658 | filter: contrast(1); |
| 659 | 659 | } |
| 660 | 660 | td.difftxt { |
| 661 | 661 | max-width: 0; |
| 662 | 662 | overflow-x: hidden; |
| 663 | + overflow-y: hidden; | |
| 663 | 664 | } |
| 664 | 665 | td.difftxtu { |
| 665 | 666 | width: 100%; |
| 666 | 667 | } |
| 667 | 668 | td.difftxtl, |
| 668 | 669 |
| --- src/default.css | |
| +++ src/default.css | |
| @@ -572,11 +572,11 @@ | |
| 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; |
| @@ -658,10 +658,11 @@ | |
| 658 | filter: contrast(1); |
| 659 | } |
| 660 | td.difftxt { |
| 661 | max-width: 0; |
| 662 | overflow-x: hidden; |
| 663 | } |
| 664 | td.difftxtu { |
| 665 | width: 100%; |
| 666 | } |
| 667 | td.difftxtl, |
| 668 |
| --- src/default.css | |
| +++ src/default.css | |
| @@ -572,11 +572,11 @@ | |
| 572 | white-space: pre-wrap; |
| 573 | word-wrap: break-word; |
| 574 | } |
| 575 | table.diff td del, |
| 576 | table.diff td ins { |
| 577 | padding: calc((1em*1.275 - 1em)/2) 0; |
| 578 | text-decoration: none; |
| 579 | } |
| 580 | table.diff td.diffln { |
| 581 | width: 0%; |
| 582 | text-align: right; |
| @@ -658,10 +658,11 @@ | |
| 658 | filter: contrast(1); |
| 659 | } |
| 660 | td.difftxt { |
| 661 | max-width: 0; |
| 662 | overflow-x: hidden; |
| 663 | overflow-y: hidden; |
| 664 | } |
| 665 | td.difftxtu { |
| 666 | width: 100%; |
| 667 | } |
| 668 | td.difftxtl, |
| 669 |
+4
-2
| --- src/diffcmd.c | ||
| +++ src/diffcmd.c | ||
| @@ -250,11 +250,11 @@ | ||
| 250 | 250 | @ white-space: pre-wrap; |
| 251 | 251 | @ word-wrap: break-word; |
| 252 | 252 | @ } |
| 253 | 253 | @ table.diff td del, |
| 254 | 254 | @ table.diff td ins { |
| 255 | -@ padding: 0.062em 0 0.062em 0; | |
| 255 | +@ padding: calc((1em*1.275 - 1em)/2) 0; | |
| 256 | 256 | @ text-decoration: none; |
| 257 | 257 | @ } |
| 258 | 258 | @ table.diff td.diffln { |
| 259 | 259 | @ width: 0%; |
| 260 | 260 | @ text-align: right; |
| @@ -269,10 +269,11 @@ | ||
| 269 | 269 | @ padding: 0 0.32em 0 0.16em; |
| 270 | 270 | @ } |
| 271 | 271 | @ td.difftxt { |
| 272 | 272 | @ max-width: 0; |
| 273 | 273 | @ overflow-x: hidden; |
| 274 | +@ overflow-y: hidden; | |
| 274 | 275 | @ } |
| 275 | 276 | @ td.difftxtu { |
| 276 | 277 | @ width: 100%; |
| 277 | 278 | @ } |
| 278 | 279 | @ td.difftxtl, |
| @@ -370,11 +371,11 @@ | ||
| 370 | 371 | @ white-space: pre-wrap; |
| 371 | 372 | @ word-wrap: break-word; |
| 372 | 373 | @ } |
| 373 | 374 | @ table.diff td del, |
| 374 | 375 | @ table.diff td ins { |
| 375 | -@ padding: 0.062em 0 0.062em 0; | |
| 376 | +@ padding: calc((1em*1.275 - 1em)/2) 0; | |
| 376 | 377 | @ text-decoration: none; |
| 377 | 378 | @ } |
| 378 | 379 | @ table.diff td.diffln { |
| 379 | 380 | @ width: 0%; |
| 380 | 381 | @ text-align: right; |
| @@ -389,10 +390,11 @@ | ||
| 389 | 390 | @ padding: 0 0.32em 0 0.16em; |
| 390 | 391 | @ } |
| 391 | 392 | @ td.difftxt { |
| 392 | 393 | @ max-width: 0; |
| 393 | 394 | @ overflow-x: hidden; |
| 395 | +@ overflow-y: hidden; | |
| 394 | 396 | @ } |
| 395 | 397 | @ td.difftxtu { |
| 396 | 398 | @ width: 100%; |
| 397 | 399 | @ } |
| 398 | 400 | @ td.difftxtl, |
| 399 | 401 |
| --- src/diffcmd.c | |
| +++ src/diffcmd.c | |
| @@ -250,11 +250,11 @@ | |
| 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; |
| @@ -269,10 +269,11 @@ | |
| 269 | @ padding: 0 0.32em 0 0.16em; |
| 270 | @ } |
| 271 | @ td.difftxt { |
| 272 | @ max-width: 0; |
| 273 | @ overflow-x: hidden; |
| 274 | @ } |
| 275 | @ td.difftxtu { |
| 276 | @ width: 100%; |
| 277 | @ } |
| 278 | @ td.difftxtl, |
| @@ -370,11 +371,11 @@ | |
| 370 | @ white-space: pre-wrap; |
| 371 | @ word-wrap: break-word; |
| 372 | @ } |
| 373 | @ table.diff td del, |
| 374 | @ table.diff td ins { |
| 375 | @ padding: 0.062em 0 0.062em 0; |
| 376 | @ text-decoration: none; |
| 377 | @ } |
| 378 | @ table.diff td.diffln { |
| 379 | @ width: 0%; |
| 380 | @ text-align: right; |
| @@ -389,10 +390,11 @@ | |
| 389 | @ padding: 0 0.32em 0 0.16em; |
| 390 | @ } |
| 391 | @ td.difftxt { |
| 392 | @ max-width: 0; |
| 393 | @ overflow-x: hidden; |
| 394 | @ } |
| 395 | @ td.difftxtu { |
| 396 | @ width: 100%; |
| 397 | @ } |
| 398 | @ td.difftxtl, |
| 399 |
| --- src/diffcmd.c | |
| +++ src/diffcmd.c | |
| @@ -250,11 +250,11 @@ | |
| 250 | @ white-space: pre-wrap; |
| 251 | @ word-wrap: break-word; |
| 252 | @ } |
| 253 | @ table.diff td del, |
| 254 | @ table.diff td ins { |
| 255 | @ padding: calc((1em*1.275 - 1em)/2) 0; |
| 256 | @ text-decoration: none; |
| 257 | @ } |
| 258 | @ table.diff td.diffln { |
| 259 | @ width: 0%; |
| 260 | @ text-align: right; |
| @@ -269,10 +269,11 @@ | |
| 269 | @ padding: 0 0.32em 0 0.16em; |
| 270 | @ } |
| 271 | @ td.difftxt { |
| 272 | @ max-width: 0; |
| 273 | @ overflow-x: hidden; |
| 274 | @ overflow-y: hidden; |
| 275 | @ } |
| 276 | @ td.difftxtu { |
| 277 | @ width: 100%; |
| 278 | @ } |
| 279 | @ td.difftxtl, |
| @@ -370,11 +371,11 @@ | |
| 371 | @ white-space: pre-wrap; |
| 372 | @ word-wrap: break-word; |
| 373 | @ } |
| 374 | @ table.diff td del, |
| 375 | @ table.diff td ins { |
| 376 | @ padding: calc((1em*1.275 - 1em)/2) 0; |
| 377 | @ text-decoration: none; |
| 378 | @ } |
| 379 | @ table.diff td.diffln { |
| 380 | @ width: 0%; |
| 381 | @ text-align: right; |
| @@ -389,10 +390,11 @@ | |
| 390 | @ padding: 0 0.32em 0 0.16em; |
| 391 | @ } |
| 392 | @ td.difftxt { |
| 393 | @ max-width: 0; |
| 394 | @ overflow-x: hidden; |
| 395 | @ overflow-y: hidden; |
| 396 | @ } |
| 397 | @ td.difftxtu { |
| 398 | @ width: 100%; |
| 399 | @ } |
| 400 | @ td.difftxtl, |
| 401 |