Update to modern standard for scrollbar styles (#2596)

skeletonlabs · Apr 8, 2024 · a4acb5a · a4acb5a
1 parent c5aafca
commit a4acb5a
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 12 deletions.
diff --git a/.changeset/thirty-cows-laugh.md b/.changeset/thirty-cows-laugh.md
@@ -0,0 +1,5 @@
+---
+"@skeletonlabs/tw-plugin": minor
+---
+
+Bugfix: Update scrollbar styles to the latest standard.
diff --git a/packages/plugin/src/styles/base/core.css b/packages/plugin/src/styles/base/core.css
@@ -26,19 +26,12 @@ html {
 }
 
 /* === Scrollbars === */
+/* https://developer.mozilla.org/en-US/docs/Web/CSS/scrollbar-color */
+/* https://developer.chrome.com/docs/css-ui/scrollbar-styling */
 
-::-webkit-scrollbar {
-	@apply w-2;
-	@apply h-2;
-}
-::-webkit-scrollbar-track {
-	@apply !bg-surface-50-900-token px-[1px];
-}
-::-webkit-scrollbar-thumb {
-	@apply rounded-token bg-surface-400-500-token;
-}
-::-webkit-scrollbar-corner {
-	@apply !bg-surface-50-900-token;
+:root {
+	scrollbar-color: rgba(128, 128, 128, 0.5) rgba(0, 0, 0, 0.1); /* thumb / track */
+	scrollbar-width: thin;
 }
 
 /* Firefox */