✨ Style scrollbar

jupyter-book · Dec 17, 2024 · 3b06af1 · 3b06af1
1 parent ceb8196
commit 3b06af1
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/packages/site/src/components/Navigation/PrimarySidebar.tsx b/packages/site/src/components/Navigation/PrimarySidebar.tsx
@@ -174,7 +174,7 @@ export const PrimarySidebar = ({
           },
         )}
       >
-        <div className="flex-grow py-6 overflow-y-auto">
+        <div className="flex-grow py-6 overflow-y-auto primary-scrollbar">
           {nav && (
             <nav
               aria-label="Navigation"

diff --git a/styles/toc.css b/styles/toc.css
@@ -25,3 +25,13 @@
     height: 0;
   }
 }
+
+.primary-scrollbar::-webkit-scrollbar {
+  width: 10px;
+  height: 10px;
+}
+
+.primary-scrollbar::-webkit-scrollbar-thumb {
+  border-radius: 10px;
+  @apply bg-slate-300/30
+}