diff --git a/book.js b/book.js index 67a8a5b0..351e28c7 100644 --- a/book.js +++ b/book.js @@ -346,7 +346,7 @@ function playground_text(playground, hidden = true) { } setTimeout(function () { - themeColorMetaTag.content = getComputedStyle(document.body).backgroundColor; + themeColorMetaTag.content = getComputedStyle(document.documentElement).backgroundColor; }, 1); if (window.ace && window.editors) { diff --git a/css/general.css b/css/general.css index 344b53eb..a6db6805 100644 --- a/css/general.css +++ b/css/general.css @@ -5,6 +5,7 @@ :root { /* Browser default font-size is 16px, this way 1 rem = 10px */ font-size: 62.5%; + color-scheme: var(--color-scheme); } html { diff --git a/css/print.css b/css/print.css index 5e690f75..27d05e92 100644 --- a/css/print.css +++ b/css/print.css @@ -22,14 +22,6 @@ overflow-y: initial; } -code { - background-color: #666666; - border-radius: 5px; - - /* Force background to be printed in Chrome */ - -webkit-print-color-adjust: exact; -} - pre > .buttons { z-index: 2; } diff --git a/css/variables.css b/css/variables.css index 21bf8e55..59fcda88 100644 --- a/css/variables.css +++ b/css/variables.css @@ -50,6 +50,8 @@ --searchresults-border-color: #888; --searchresults-li-bg: #252932; --search-mark-bg: #e3b171; + + --color-scheme: dark; } .coal { @@ -90,6 +92,8 @@ --searchresults-border-color: #98a3ad; --searchresults-li-bg: #2b2b2f; --search-mark-bg: #355c7d; + + --color-scheme: dark; } .light { @@ -130,6 +134,8 @@ --searchresults-border-color: #888; --searchresults-li-bg: #e4f2fe; --search-mark-bg: #a2cff5; + + --color-scheme: light; } .navy { @@ -170,6 +176,8 @@ --searchresults-border-color: #5c5c68; --searchresults-li-bg: #242430; --search-mark-bg: #a2cff5; + + --color-scheme: dark; } .rust { @@ -210,6 +218,8 @@ --searchresults-border-color: #888; --searchresults-li-bg: #dec2a2; --search-mark-bg: #e69f67; + + --color-scheme: light; } @media (prefers-color-scheme: dark) {