refactor(styles): Migrate Scrollbar from ReactJS

Brayan-724 · Brayan-724 · commit 9c32964a4e43 · 2025-06-24T14:06:49.000-07:00
diff --git a/js/react/lib/styles.css b/js/react/lib/styles.css
@@ -1,28 +1 @@
 @import "@rustlanges/styles";
-
-@layer utilities {
-  @supports not selector(::-webkit-scrollbar) {
-    .scrollbar {
-      scrollbar-color: var(--color-neutral-300) var(--color-neutral-100);
-
-      @variant dark {
-        scrollbar-color: var(--color-neutral-900) var(--color-neutral-600);
-      }
-    }
-  }
-
-  .scrollbar::-webkit-scrollbar {
-    @apply w-4;
-  }
-
-  .scrollbar::-webkit-scrollbar-track {
-    @apply rounded-full bg-neutral-100 dark:bg-neutral-900;
-  }
-
-  .scrollbar::-webkit-scrollbar-thumb {
-    @apply rounded-full bg-neutral-300 transition dark:bg-neutral-600;
-  }
-  .scrollbar::-webkit-scrollbar-thumb:hover {
-    @apply opacity-90;
-  }
-}
diff --git a/styles/utilities.css b/styles/utilities.css
@@ -1,2 +1,3 @@
 @import "./utilities/container.css";
+@import "./utilities/scollbar.css";
 @import "./utilities/shadow.css";
diff --git a/styles/utilities/scrollbar.css b/styles/utilities/scrollbar.css
@@ -0,0 +1,26 @@
+@layer utilities {
+  @supports not selector(::-webkit-scrollbar) {
+    .scrollbar {
+      scrollbar-color: var(--color-neutral-300) var(--color-neutral-100);
+
+      @variant dark {
+        scrollbar-color: var(--color-neutral-900) var(--color-neutral-600);
+      }
+    }
+  }
+
+  .scrollbar::-webkit-scrollbar {
+    @apply w-4;
+  }
+
+  .scrollbar::-webkit-scrollbar-track {
+    @apply rounded-full bg-neutral-100 dark:bg-neutral-900;
+  }
+
+  .scrollbar::-webkit-scrollbar-thumb {
+    @apply rounded-full bg-neutral-300 transition dark:bg-neutral-600;
+  }
+  .scrollbar::-webkit-scrollbar-thumb:hover {
+    @apply opacity-90;
+  }
+}

Original file line number	Diff line number	Diff line change
`@@ -1,2 +1,3 @@`
`1`	`1`	`@import "./utilities/container.css";`
	`2`	`+@import "./utilities/scollbar.css";`
`2`	`3`	`@import "./utilities/shadow.css";`