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

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

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