improve scroll-bar styling

and fix hidden gist scrollbar
ebfork · Jan 25, 2021 · 9c50449 · 9c50449
1 parent cd03c69
commit 9c50449
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 3 deletions.
diff --git a/assets/css/post-single.css b/assets/css/post-single.css
@@ -347,9 +347,19 @@ h6:hover .anchor {
 }
 
 .post-content ::-webkit-scrollbar-thumb {
+    border: 2px solid var(--hljs-bg);
     background: rgba(255, 255, 255, 0.32)
 }
 
 .post-content ::-webkit-scrollbar-thumb:hover {
-    background: rgba(255, 255, 255, 0.64)
+    background: rgba(255, 255, 255, 0.56)
+}
+
+.gist ::-webkit-scrollbar-thumb {
+    border: 2px solid rgb(255, 255, 255);
+    background: rgba(0, 0, 0, 0.32)
+}
+
+.gist ::-webkit-scrollbar-thumb:hover {
+    background: rgba(0, 0, 0, 0.56)
 }
diff --git a/assets/css/reset.css b/assets/css/reset.css
@@ -123,9 +123,14 @@ img {
 
 ::-webkit-scrollbar-thumb {
     background: var(--tertiary);
+    border: 5px solid var(--theme);
     border-radius: var(--radius)
 }
 
+.list:not(.dark)::-webkit-scrollbar-thumb {
+    border: 5px solid var(--code-bg)
+}
+
 ::-webkit-scrollbar-thumb:hover {
     background: var(--secondary)
 }
diff --git a/assets/css/zmedia.css b/assets/css/zmedia.css
@@ -27,8 +27,8 @@
 @media screen and (min-width: 768px) {
     /* reset */
     ::-webkit-scrollbar {
-        width: 10px;
-        height: 6px;
+        width: 19px;
+        height: 11px;
     }
 }