From 0aad1ac966c5f02b5c911077aa2cec8536bf9599 Mon Sep 17 00:00:00 2001
From: FatttSnake <fatttsnake@gmail.com>
Date: Tue, 30 Apr 2024 17:10:17 +0800
Subject: [PATCH] Refactor(HideScrollbar): Add scrollbar padding attributes

Add scrollbar padding attributes to allow custom scrollbar padding style
---
 .../assets/css/components/common/hide-scrollbar.scss   |  2 --
 src/renderer/src/components/common/HideScrollbar.tsx   | 10 ++++++++--
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/renderer/src/assets/css/components/common/hide-scrollbar.scss b/src/renderer/src/assets/css/components/common/hide-scrollbar.scss
index 80f9463..6ca07e8 100644
--- a/src/renderer/src/assets/css/components/common/hide-scrollbar.scss
+++ b/src/renderer/src/assets/css/components/common/hide-scrollbar.scss
@@ -68,7 +68,6 @@
   }
 
   .vertical-scrollbar {
-    padding: 12px 2px;
     height: 100%;
     left: 100%;
     top: 0;
@@ -80,7 +79,6 @@
   }
 
   .horizontal-scrollbar {
-    padding: 4px 12px;
     width: 100%;
     left: 0;
     top: 100%;
diff --git a/src/renderer/src/components/common/HideScrollbar.tsx b/src/renderer/src/components/common/HideScrollbar.tsx
index a79889b..49b8521 100644
--- a/src/renderer/src/components/common/HideScrollbar.tsx
+++ b/src/renderer/src/components/common/HideScrollbar.tsx
@@ -21,6 +21,8 @@ interface HideScrollbarProps
     minHeight?: string | number
     scrollbarWidth?: string | number
     autoHideWaitingTime?: number
+    scrollbarAsidePadding?: number
+    scrollbarEdgePadding?: number
 }
 
 export interface HideScrollbarElement {
@@ -74,6 +76,8 @@ const HideScrollbar = forwardRef<HideScrollbarElement, HideScrollbarProps>(
             children,
             style,
             className,
+            scrollbarAsidePadding = 12,
+            scrollbarEdgePadding = 4,
             ...props
         },
         ref
@@ -578,7 +582,8 @@ const HideScrollbar = forwardRef<HideScrollbarElement, HideScrollbarProps>(
                                         ? maskRef.current?.clientLeft +
                                           maskRef.current?.clientWidth -
                                           1
-                                        : undefined
+                                        : undefined,
+                                    padding: `${scrollbarAsidePadding}px ${scrollbarEdgePadding}px`
                                 }}
                             >
                                 <div className={'box'} style={{ width: scrollbarWidth }}>
@@ -620,7 +625,8 @@ const HideScrollbar = forwardRef<HideScrollbarElement, HideScrollbarProps>(
                                         ? maskRef.current?.clientTop +
                                           maskRef.current?.clientHeight -
                                           1
-                                        : undefined
+                                        : undefined,
+                                    padding: `${scrollbarAsidePadding}px ${scrollbarEdgePadding}px`
                                 }}
                             >
                                 <div className={'box'} style={{ height: scrollbarWidth }}>