diff --git a/3ed-2018/auto-dark.svg b/3ed-2018/auto-dark.svg new file mode 100644 index 0000000..3da4fe2 --- /dev/null +++ b/3ed-2018/auto-dark.svg @@ -0,0 +1,109 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/3ed-2018/auto-light.svg b/3ed-2018/auto-light.svg new file mode 100644 index 0000000..571011d --- /dev/null +++ b/3ed-2018/auto-light.svg @@ -0,0 +1,101 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/3ed-2018/dark.svg b/3ed-2018/dark.svg index e038c7b..be33203 100644 --- a/3ed-2018/dark.svg +++ b/3ed-2018/dark.svg @@ -13,10 +13,10 @@ - + - + diff --git a/3ed-2018/light.svg b/3ed-2018/light.svg index 973cfd3..c66a52f 100644 --- a/3ed-2018/light.svg +++ b/3ed-2018/light.svg @@ -13,10 +13,10 @@ - + - + diff --git a/3ed-2018/pbrstyle.css b/3ed-2018/pbrstyle.css index 6e61c39..38708e0 100644 --- a/3ed-2018/pbrstyle.css +++ b/3ed-2018/pbrstyle.css @@ -31,7 +31,32 @@ p { --legend: #000; --footnote-btn: #6080e0; --footnote-btn-bg: #fff; - --icon: url("/3ed-2018/light.svg"); + --icon: url("/3ed-2018/auto-light.svg"); +} + +@media (prefers-color-scheme: dark) { + :root { + --bg: #3a3a3a; + --bg-navbar: #343434; + --bg-cse: #343434; + --bg-table: #383838; + --bg-tooltip: #444444; + --bg-navlink-active: #444; + --border-color: rgba(255, 255, 255, 0.125); + --text: #acacac; + --text-navbar: rgb(172, 172, 172, 0.75); + --landing-title: #eee; + --link: #7186ac; + --link-active: blue; + --table-outline: #dee2e6; + --text-red: #ff0000; + --text-midred: #a00000; + --fig-outline: #404040; + --legend: #acacac; + --footnote-btn: #6080e0; + --footnote-btn-bg: #3a3a3a; + --icon: url(/3ed-2018/auto-dark.svg); + } } body { diff --git a/3ed-2018/pbrt-display.js b/3ed-2018/pbrt-display.js index 45add71..a5aa1b5 100644 --- a/3ed-2018/pbrt-display.js +++ b/3ed-2018/pbrt-display.js @@ -46,23 +46,35 @@ function setPBRTDisplayModeVars(displayMode) document.documentElement.style.setProperty('--text-red', '#ff0000'); } +function clearPBRTDisplayModeVars() +{ + document.documentElement.removeAttribute("style"); +} + function setPBRTDisplayMode() { var displayMode = localStorage.getItem("displayMode"); - if(displayMode == "null") { - displayMode = 0; // no stored display mode, default to light mode - localStorage.setItem("displayMode", displayMode); + if(displayMode != null) { + setPBRTDisplayModeVars(displayMode); } - setPBRTDisplayModeVars(displayMode); } function TogglePBRTDisplayMode() { var displayMode = localStorage.getItem("displayMode"); - if(displayMode == 0) displayMode = 1; - else if(displayMode == 1) displayMode = 0; - localStorage.setItem("displayMode", displayMode); // update the stored display mode - setPBRTDisplayModeVars(displayMode); + if(displayMode == "0") + displayMode = "1"; + else if(displayMode == "1") + displayMode = null; + else if(displayMode == null) + displayMode = "0"; + if (displayMode != null) { + localStorage.setItem("displayMode", displayMode); // update the stored display mode + setPBRTDisplayModeVars(displayMode); + } else { + localStorage.removeItem("displayMode"); + clearPBRTDisplayModeVars(); + } } setPBRTDisplayMode(); \ No newline at end of file