customized scrollbar

mate-academy · Mar 22, 2024 · 5d3c6ec · 5d3c6ec
1 parent b82a80d
commit 5d3c6ec
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 1 deletion.
diff --git a/css/main.css b/css/main.css
@@ -734,4 +734,14 @@ html:has(.mobile-menu.active) {
 
 body {
   background-color: #FFEEFC;
+}
+body::-webkit-scrollbar {
+  width: 5px;
+}
+body::-webkit-scrollbar-track {
+  background: #FFEEFC;
+}
+body::-webkit-scrollbar-thumb {
+  background-color: #F9512E;
+  border-radius: 20px;
 }/*# sourceMappingURL=main.css.map */
diff --git a/css/main.css.map b/css/main.css.map
diff --git a/src/styles/main.scss b/src/styles/main.scss
@@ -11,11 +11,27 @@ html {
   scroll-behavior: smooth;
   cursor: url(/src/images/cursor-28px-reverse.png), auto;
 
+
   &:has(.mobile-menu.active) {
     overflow: hidden;
   }
 }
 
 body {
   background-color: $light-pink;
+
+  &::-webkit-scrollbar {
+    width: 5px;
+  }
+
+  &::-webkit-scrollbar-track {
+    background: $light-pink;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: $accent-orange;
+    border-radius: 20px;
+  }
 }
+
+