xinyin025/soybean-admin
1
0
Fork 0
mirror of https://github.com/soybeanjs/soybean-admin.git synced 2025-11-12 19:53:41 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

refactor(projects): perfect scrollbar style [完善滚动条]

Browse Source
This commit is contained in:
Soybean
2022-11-13 09:45:00 +08:00
parent 1bdd81a1d8
commit 1a02cab97c
5 changed files with 1014 additions and 904 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/styles/css/global.css
View File

@@ -1,5 +1,6 @@
@import './transition.css';
@import './reset.css';
@import './scrollbar.css';
html, body, #app {
height: 100%;

61
src/styles/css/scrollbar.css
View File

@@ -1,26 +1,53 @@
/*---滚动条默认显示样式--*/
::-webkit-scrollbar-thumb {
background-color: #e6e6e6;
border-radius: 6px;
}
/*---鼠标点击滚动条显示样式--*/
::-webkit-scrollbar-thumb:hover {
background-color: #e6e6e6;
border-radius: 6px;
}
/*---滚动条大小--*/
::-webkit-scrollbar {
width: 6px;
height: 6px;
html {
scrollbar-width: thin;
scrollbar-color: #e1e1e1 transparent;
}
/*---滚动条默认显示样式--*/
html::-webkit-scrollbar-thumb {
background-color: #e1e1e1;
border-radius: 8px;
}
/*---鼠标点击滚动条显示样式--*/
html::-webkit-scrollbar-thumb:hover {
background-color: #e1e1e1;
border-radius: 8px;
}
/*---滚动条大小--*/
html::-webkit-scrollbar {
width: 8px;
height: 8px;
}
/*---滚动框背景样式--*/
::-webkit-scrollbar-track-piece {
html::-webkit-scrollbar-track-piece {
background-color: rgba(0, 0, 0, 0);
border-radius: 0;
}
html {
html.dark {
scrollbar-width: thin;
scrollbar-color: e6e6e6 transparent;
scrollbar-color: #555 transparent;
}
/*---滚动条默认显示样式--*/
html.dark::-webkit-scrollbar-thumb {
background-color: #555;
border-radius: 8px;
}
/*---鼠标点击滚动条显示样式--*/
html.dark::-webkit-scrollbar-thumb:hover {
background-color: #555;
border-radius: 8px;
}
/*---滚动条大小--*/
html.dark::-webkit-scrollbar {
width: 8px;
height: 8px;
}
/*---滚动框背景样式--*/
html.dark::-webkit-scrollbar-track-piece {
background-color: rgba(0, 0, 0, 0);
border-radius: 0;
}