New Scrollbar with style

sk66641 · Jun 28, 2024 · 214bc27 · 214bc27
1 parent 18d30c4
commit 214bc27
Showing 1 changed file with 18 additions and 26 deletions.
diff --git a/css/style.css b/css/style.css
@@ -24,36 +24,28 @@ body {
 
 }
 
-.light-mode::-webkit-scrollbar-track {
-  background: black;
-  background: linear-gradient(180deg, rgba(148, 1, 1, 1) 0%, rgba(196, 171, 3, 1) 20%, rgba(44, 179, 2, 1) 40%, rgba(7, 200, 136, 1) 60%, rgba(31, 5, 148, 1) 80%, rgba(255, 0, 0, 1) 100%);
+::-webkit-scrollbar-track
+{
+	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.6);
+	background-color: #CCCCCC;
 }
 
-.light-mode::-webkit-scrollbar-thumb {
-  background-color: black;
-  opacity: 0.7;
-  /* Semi-transparent thumb */
-  border-radius: 3px;
-
-}
-
-/* Custom Scrollbar Styles */
-::-webkit-scrollbar {
-  margin-top: 100px;
-  margin-bottom: 100px;
+::-webkit-scrollbar
+{
+	width: 10px;
+	background-color: #F5F5F5;
 }
 
-::-webkit-scrollbar-track {
-  background: black;
-  background: linear-gradient(180deg, rgba(148, 1, 1, 1) 0%, rgba(196, 171, 3, 1) 20%, rgba(44, 179, 2, 1) 40%, rgba(7, 200, 136, 1) 60%, rgba(31, 5, 148, 1) 80%, rgba(255, 0, 0, 1) 100%);
-}
-
-::-webkit-scrollbar-thumb {
-  background-color: white;
-  opacity: 0.7;
-  /* Semi-transparent thumb */
-  border-radius: 3px;
-
+::-webkit-scrollbar-thumb
+{
+	background-color: #FFF;
+  border-radius: 10px;
+	background-image: -webkit-linear-gradient(90deg,
+	                                          rgba(0, 0, 0, 1) 0%,
+											  rgba(0, 0, 0, 1) 25%,
+											  transparent 100%,
+											  rgba(0, 0, 0, 1) 75%,
+											  transparent)
 }
 
 .unload {