From 2c71d657d0d2582a6f7a59b6e33585f0f4bca0c8 Mon Sep 17 00:00:00 2001
From: seal <yejunhai2001@gmail.com>
Date: Fri, 10 Jan 2025 15:25:52 +0800
Subject: [PATCH] feat: customize native scrollbar and simplebar styles

---
 src/global.css | 42 ++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 42 insertions(+)

diff --git a/src/global.css b/src/global.css
index 3a970036..42dc38d8 100644
--- a/src/global.css
+++ b/src/global.css
@@ -11,3 +11,45 @@
 @import "tailwindcss/base";
 @import "tailwindcss/components";
 @import "tailwindcss/utilities";
+
+:root {
+  --c-bg: transparent;
+  --c-scrollbar: #aaa;
+  --c-scrollbar-hover: #777;
+}
+html {
+  background-color: var(--c-bg);
+  overflow: auto;
+}
+html.dark {
+  --c-bg: transparent;
+  --c-scrollbar: #555;
+  --c-scrollbar-hover: #888;
+}
+
+/* native scrollbar customize */
+::-webkit-scrollbar {
+  width: 7px;
+  cursor: pointer !important;
+}
+::-webkit-scrollbar:horizontal {
+  height: 7px;
+}
+::-webkit-scrollbar-track,
+::-webkit-scrollbar-corner {
+  background: var(--c-bg);
+  border-radius: 10px;
+}
+::-webkit-scrollbar-thumb {
+  background: var(--c-scrollbar);
+  border-radius: 10px;
+}
+::-webkit-scrollbar-thumb:hover {
+  background: var(--c-scrollbar-hover);
+}
+
+/* simplebar customize */
+.simplebar-scrollbar::before {
+  border-radius: 10px;
+  background: var(--c-scrollbar-hover);
+}