Merge branch 'feature/use-default-scrollbar'

_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);
   }
 

_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

_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

_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;