Skip to content

Commit 8325191

Browse files
WIP: cleanup before squash
Fix Book code styling in dark mode by replacing hard-coded colors with variables Book pages used hard-coded colors for inline and block code (e.g. `#eee`, `#333`) in `book2.scss`, which prevented dark-mode styles from taking effect. As a result, code blocks in the Git Book did not adapt correctly when switching themes. This change replaces those hard-coded values with CSS variables (`--book-code-bg`, `--book-code-color`, `--book-code-border`), allowing dark mode to override Book code styling in the same way as other sections (e.g. man-pages). Not all `code.<language>` color rules are adjusted here, as they relate to syntax highlighting rather than theme contrast and require a separate, more holistic approach. An alternative approach—overriding Book code styles directly in `dark-mode.scss` using more specific selectors—was considered but rejected, as it would further increase selector complexity instead of fixing the root cause. Fixes #2120
1 parent 0bb516b commit 8325191

File tree

2 files changed

+15
-6
lines changed

2 files changed

+15
-6
lines changed

assets/sass/book2.scss

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
11
.edition2 {
2+
/* Book code colors (light mode defaults) */
3+
--book-code-color: #333;
4+
--book-code-bg: #eee;
5+
--book-code-border: #f5f5f5;
26
* {
37
box-sizing: border-box;
48
}
@@ -474,11 +478,11 @@
474478
}
475479

476480
pre {
477-
background: #eee;
481+
background: var(--book-code-bg);
478482

479483
code {
480484
display: inline;
481-
background: #eee;
485+
background: var(--book-code-bg);
482486
border: 0;
483487
}
484488
}
@@ -488,14 +492,14 @@
488492
overflow-x: auto;
489493
font-size: 0.9em;
490494
line-height: 120%;
491-
color: #333;
495+
color: var(--book-code-color);
492496
}
493497

494498
code { /* inline code */
495499
padding: 0;
496-
color: #333;
497-
background: #eee;
498-
border: 1px solid #f5f5f5;
500+
color: var(--book-code-color);
501+
background: var(--book-code-bg);
502+
border: 1px solid var(--book-code-border);
499503
}
500504

501505
table pre { /* code blocks within tables */

assets/sass/dark-mode.scss

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -82,6 +82,11 @@
8282
filter: brightness(.4) contrast(1.6);
8383
z-index: -1;
8484
}
85+
86+
/* Book pages: code colors */
87+
--book-code-color: #{$fixed-width-font-color};
88+
--book-code-bg: #{$no-changes-bg-color};
89+
--book-code-border: #{$pre-border};
8590

8691
img {
8792
filter: brightness(.6) contrast(1.2);

0 commit comments

Comments
 (0)