Add custom beautiful scrollbars

bluerobotics · Jul 28, 2023 · 88fe7dc · 88fe7dc
1 parent 9caba81
commit 88fe7dc
Showing 1 changed file with 18 additions and 0 deletions.
diff --git a/src/styles/global.css b/src/styles/global.css
@@ -24,3 +24,21 @@
 .v-leave-to {
     opacity: 0;
 }
+
+::-webkit-scrollbar {
+    width: 0.5em;
+    height: 0.5em;
+}
+::-webkit-scrollbar-track {
+    background-color: hsla(0, 0%, 0%, 0.1);
+    border-radius: 100vw;
+    margin-block: 0.5rem;
+    margin-inline: 0.5rem;
+}
+::-webkit-scrollbar-thumb {
+    background-color: hsla(0, 0%, 0%, 0.2);
+    border-radius: 100vw;
+}
+::-webkit-scrollbar-thumb:hover {
+    background-color: hsla(0, 0%, 0%, 0.411);
+}