feat: add scrollbar tokens

Justineo · Justineo · commit 2e6c39744c4c · 2023-05-05T15:23:06.000+08:00
diff --git a/packages/less-plugin-dls/test/specs/scrollbar/scrollbar.css b/packages/less-plugin-dls/test/specs/scrollbar/scrollbar.css
@@ -0,0 +1,8 @@
+div {
+  -dls-scrollbar-track-width: 10px;
+  -dls-scrollbar-track-color: transparent;
+  -dls-scrollbar-thumb-width: 6px;
+  -dls-scrollbar-thumb-color: rgba(49, 76, 140, 0.2);
+  -dls-scrollbar-thumb-color-hover: rgba(83, 98, 128, 0.5);
+  -dls-scrollbar-thumb-border-radius: 5px;
+}
diff --git a/packages/less-plugin-dls/test/specs/scrollbar/scrollbar.less b/packages/less-plugin-dls/test/specs/scrollbar/scrollbar.less
@@ -0,0 +1,8 @@
+div {
+  -dls-scrollbar-track-width: @dls-scrollbar-track-width;
+  -dls-scrollbar-track-color: @dls-scrollbar-track-color;
+  -dls-scrollbar-thumb-width: @dls-scrollbar-thumb-width;
+  -dls-scrollbar-thumb-color: @dls-scrollbar-thumb-color;
+  -dls-scrollbar-thumb-color-hover: @dls-scrollbar-thumb-color-hover;
+  -dls-scrollbar-thumb-border-radius: @dls-scrollbar-thumb-border-radius;
+}
diff --git a/packages/less-plugin-dls/tokens/components/scrollbar.less b/packages/less-plugin-dls/tokens/components/scrollbar.less
@@ -0,0 +1,9 @@
+@import "../global.less";
+
+@dls-scrollbar-track-width: @dls-height-unit * 2.5;
+@dls-scrollbar-track-color: transparent;
+
+@dls-scrollbar-thumb-width: @dls-height-unit * 1.5;
+@dls-scrollbar-thumb-color: @dls-color-translucent-4;
+@dls-scrollbar-thumb-color-hover: @dls-color-translucent-6;
+@dls-scrollbar-thumb-border-radius: @dls-scrollbar-track-width / 2;
diff --git a/packages/less-plugin-dls/tokens/tokens.less b/packages/less-plugin-dls/tokens/tokens.less
@@ -46,3 +46,4 @@
 @import "./components/layout.less";
 @import "./components/message.less";
 @import "./components/empty.less";
+@import "./components/scrollbar.less";
