FatttSnake/oxygen-desktop
1
0
Fork 0
Code Pull Requests Activity

Refactor(HideScrollbar): Add scrollbar padding attributes

Browse Source 
Add scrollbar padding attributes to allow custom scrollbar padding style
This commit is contained in:
Fat Snake
2024-04-30 17:10:17 +08:00
parent e209bea2f3
commit 0aad1ac966
2 changed files with 8 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/renderer/src/assets/css/components/common/hide-scrollbar.scss
View File

@@ -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%;

10
src/renderer/src/components/common/HideScrollbar.tsx
View File

@@ -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 }}>