Skip to content

Commit d1bb8e9

Browse files
committed
Fix dark mode for context listing. #1009
1 parent 5c4d4cd commit d1bb8e9

File tree

4 files changed

+40
-12
lines changed

4 files changed

+40
-12
lines changed

CHANGES.rst

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,10 @@ want to know what's different in 5.0 since 4.5.x, see :ref:`whatsnew5x`.
2525
Unreleased
2626
----------
2727

28-
Nothing yet.
28+
- The dark mode HTML report still used light colors for the context listing,
29+
making them unreadable (`issue 1009`_). This is now fixed.
30+
31+
.. _issue 1009: https://github.com/nedbat/coveragepy/issues/1009
2932

3033

3134
.. _changes_52:

coverage/htmlfiles/style.css

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -220,7 +220,15 @@ h2.stats { margin-top: .5em; font-size: 1em; }
220220

221221
#source p input ~ .r label.ctx:hover { background: #d5f7ff; color: #666; }
222222

223-
#source p input:checked ~ .r label.ctx { background: #aaeeff; color: #666; border-radius: .75em .75em 0 0; padding: 0 .5em; margin: -.25em 0; }
223+
@media (prefers-color-scheme: dark) { #source p input ~ .r label.ctx:hover { background: #0f3a42; } }
224+
225+
@media (prefers-color-scheme: dark) { #source p input ~ .r label.ctx:hover { color: #aaa; } }
226+
227+
#source p input:checked ~ .r label.ctx { background: #aef; color: #666; border-radius: .75em .75em 0 0; padding: 0 .5em; margin: -.25em 0; }
228+
229+
@media (prefers-color-scheme: dark) { #source p input:checked ~ .r label.ctx { background: #056; } }
230+
231+
@media (prefers-color-scheme: dark) { #source p input:checked ~ .r label.ctx { color: #aaa; } }
224232

225233
#source p input:checked ~ .r label.ctx::before { content: "▼ "; }
226234

@@ -230,7 +238,9 @@ h2.stats { margin-top: .5em; font-size: 1em; }
230238

231239
@media (prefers-color-scheme: dark) { #source p label.ctx { color: #777; } }
232240

233-
#source p .ctxs { display: block; max-height: 0; overflow-y: hidden; transition: all .2s; padding: 0 .5em; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; white-space: nowrap; background: #aaeeff; border-radius: .25em; margin-right: 1.75em; }
241+
#source p .ctxs { display: block; max-height: 0; overflow-y: hidden; transition: all .2s; padding: 0 .5em; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; white-space: nowrap; background: #aef; border-radius: .25em; margin-right: 1.75em; }
242+
243+
@media (prefers-color-scheme: dark) { #source p .ctxs { background: #056; } }
234244

235245
#source p .ctxs span { display: block; text-align: right; }
236246

coverage/htmlfiles/style.scss

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,7 @@ $light-exc-bg: $light-gray2;
5151
$light-par-bg: #ffa;
5252
$light-token-com: #008000;
5353
$light-token-str: #0451A5;
54+
$light-context-bg-color: #aef;
5455

5556
$dark-bg: #1e1e1e;
5657
$dark-fg: #eee;
@@ -67,6 +68,7 @@ $dark-exc-bg: $dark-gray2;
6768
$dark-par-bg: #650;
6869
$dark-token-com: #6A9955;
6970
$dark-token-str: #9CDCFE;
71+
$dark-context-bg-color: #056;
7072

7173
//
7274
// Mixins and utilities
@@ -345,8 +347,6 @@ h2.stats {
345347
// The slim bar at the left edge of the source lines, colored by coverage.
346348
$border-indicator-width: .2em;
347349

348-
$context-panel-color: #aaeeff;
349-
350350
#source {
351351
padding: 1em 0 1em $left-gutter;
352352
font-family: $font-code;
@@ -520,14 +520,18 @@ $context-panel-color: #aaeeff;
520520
content: "";
521521
}
522522
&:hover {
523-
background: mix($context-panel-color, #fff, 50%);
524-
color: #666;
523+
background: mix($light-context-bg-color, $light-bg, $off-button-lighten);
524+
@include background-dark(mix($dark-context-bg-color, $dark-bg, $off-button-lighten));
525+
color: $light-gray5;
526+
@include color-dark($dark-gray5);
525527
}
526528
}
527529

528530
&:checked ~ .r label.ctx {
529-
background: $context-panel-color;
530-
color: #666;
531+
background: $light-context-bg-color;
532+
@include background-dark($dark-context-bg-color);
533+
color: $light-gray5;
534+
@include color-dark($dark-gray5);
531535
border-radius: .75em .75em 0 0;
532536
padding: 0 .5em;
533537
margin: -.25em 0;
@@ -559,7 +563,8 @@ $context-panel-color: #aaeeff;
559563
padding: 0 .5em;
560564
font-family: $font-normal;
561565
white-space: nowrap;
562-
background: $context-panel-color;
566+
background: $light-context-bg-color;
567+
@include background-dark($dark-context-bg-color);
563568
border-radius: .25em;
564569
margin-right: 1.75em;
565570
span {

tests/gold/html/styled/style.css

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -220,7 +220,15 @@ h2.stats { margin-top: .5em; font-size: 1em; }
220220

221221
#source p input ~ .r label.ctx:hover { background: #d5f7ff; color: #666; }
222222

223-
#source p input:checked ~ .r label.ctx { background: #aaeeff; color: #666; border-radius: .75em .75em 0 0; padding: 0 .5em; margin: -.25em 0; }
223+
@media (prefers-color-scheme: dark) { #source p input ~ .r label.ctx:hover { background: #0f3a42; } }
224+
225+
@media (prefers-color-scheme: dark) { #source p input ~ .r label.ctx:hover { color: #aaa; } }
226+
227+
#source p input:checked ~ .r label.ctx { background: #aef; color: #666; border-radius: .75em .75em 0 0; padding: 0 .5em; margin: -.25em 0; }
228+
229+
@media (prefers-color-scheme: dark) { #source p input:checked ~ .r label.ctx { background: #056; } }
230+
231+
@media (prefers-color-scheme: dark) { #source p input:checked ~ .r label.ctx { color: #aaa; } }
224232

225233
#source p input:checked ~ .r label.ctx::before { content: "▼ "; }
226234

@@ -230,7 +238,9 @@ h2.stats { margin-top: .5em; font-size: 1em; }
230238

231239
@media (prefers-color-scheme: dark) { #source p label.ctx { color: #777; } }
232240

233-
#source p .ctxs { display: block; max-height: 0; overflow-y: hidden; transition: all .2s; padding: 0 .5em; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; white-space: nowrap; background: #aaeeff; border-radius: .25em; margin-right: 1.75em; }
241+
#source p .ctxs { display: block; max-height: 0; overflow-y: hidden; transition: all .2s; padding: 0 .5em; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; white-space: nowrap; background: #aef; border-radius: .25em; margin-right: 1.75em; }
242+
243+
@media (prefers-color-scheme: dark) { #source p .ctxs { background: #056; } }
234244

235245
#source p .ctxs span { display: block; text-align: right; }
236246

0 commit comments

Comments
 (0)