diff --git a/_includes/disqus.html b/_includes/disqus.html index c4746de..f4897c8 100644 --- a/_includes/disqus.html +++ b/_includes/disqus.html @@ -48,8 +48,8 @@ const modeToggle = document.querySelector(".mode-toggle"); - if (modeToggle !== null) { - modeToggle.addEventListener('click', reloadDisqus); + if (typeof modeToggle !== "undefined") { + /* modeToggle.addEventListener('click', reloadDisqus); // not pretty for 'color-scheme' */ window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', reloadDisqus); } diff --git a/_sass/addon/commons.scss b/_sass/addon/commons.scss index 86fb78e..c385b42 100644 --- a/_sass/addon/commons.scss +++ b/_sass/addon/commons.scss @@ -43,45 +43,6 @@ body { font-family: 'Source Sans Pro', 'Microsoft Yahei', sans-serif; } -/* --- Scrollbar --- */ - -$scrollbar-size: 7px; - -::-webkit-scrollbar { - width: $scrollbar-size; - height: $scrollbar-size; -} - -::-webkit-scrollbar-track { - @at-root body#{&} { - -webkit-box-shadow: inset 0 0 6px var(--scrollbar-track-bg); - } -} - -::-webkit-scrollbar-thumb { - background-color: var(--scrollbar-thumb-bg); - border-radius: calc(#{$scrollbar-size} / 2); -} - -.highlight { - border-color: transparent; - transition: border-color 0.5s ease; - - &:hover { - border-color: var(--scrollbar-thumb-bg); - transition: border-color 0.2s ease; - } - - &::-webkit-scrollbar-thumb { - /* add border to act as background-color */ - border-right-style: inset; - border-right-width: calc(100vw + 100vh); - border-color: inherit; - background-color: var(--highlight-bg-color); - } - -} - /* --- Typography --- */ h1 { @@ -842,17 +803,8 @@ $sidebar-display: "sidebar-display"; i { line-height: 1.75rem; // default line-height in body vertical-align: middle; - } - - #mode-toggle-wrapper { - @extend %icon; - - i { - @extend %sidebar-links; - @extend %cursor-pointer; - @extend %clickable-transition; - } + @extend %cursor-pointer; } .icon-border { @@ -865,10 +817,6 @@ $sidebar-display: "sidebar-display"; border-radius: 50%; } - #mode-toggle-wrapper:hover > i { - color: var(--sidebar-active-color); - } - } // .sidebar-bottom } // #sidebar diff --git a/_sass/colors/dark-typography.scss b/_sass/colors/dark-typography.scss index cc85bc6..58daeac 100644 --- a/_sass/colors/dark-typography.scss +++ b/_sass/colors/dark-typography.scss @@ -8,8 +8,6 @@ --mask-bg: rgb(68, 69, 70); --main-wrapper-bg: rgb(27, 27, 30); --main-border-color: rgb(44, 45, 45); - --scrollbar-track-bg: rgba(0, 0, 0, 0.3); - --scrollbar-thumb-bg: rgb(173 171 171 / 50%); /* Common color */ --text-color: rgb(175, 176, 177); @@ -143,4 +141,10 @@ } + color-scheme: dark; + + #disqus_thread { + color-scheme: none; + } + } // dark-scheme diff --git a/_sass/colors/light-typography.scss b/_sass/colors/light-typography.scss index a64ea59..3a5bd6f 100644 --- a/_sass/colors/light-typography.scss +++ b/_sass/colors/light-typography.scss @@ -8,8 +8,6 @@ --mask-bg: #c1c3c5; --main-wrapper-bg: white; --main-border-color: #f3f3f3; - --scrollbar-track-bg: rgba(0, 0, 0, 0.3); - --scrollbar-thumb-bg: rgba(0, 0, 0, 0.3); /* Common color */ --text-color: #34343c;