lkddi/AlgerMusicPlayer
1
0
Fork 0
mirror of https://github.com/algerkong/AlgerMusicPlayer.git synced 2026-04-24 08:07:23 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: 自动隐藏menu滚动条

Browse Source
This commit is contained in:
alger
2025-10-11 20:27:15 +08:00
parent 29ba231a7d
commit f3a9f8b979
1 changed files with 16 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/layout/components/AppMenu.vue
+16 -5
View File
@@ -105,10 +105,11 @@ const toggleMenu = () => {
max-height: calc(100vh - 120px); /* 为header预留空间，防止菜单项被遮挡 */ max-height: calc(100vh - 120px); /* 为header预留空间，防止菜单项被遮挡 */
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
/* 自定义滚动条样式 */ /* 自定义滚动条样式 - 默认隐藏，悬停时显示 */
scrollbar-width: thin; scrollbar-width: thin;
scrollbar-color: rgba(156, 163, 175, 0.5) transparent; scrollbar-color: transparent transparent;
padding-bottom: 20px; padding-bottom: 20px;
transition: scrollbar-color 0.3s ease;
&::-webkit-scrollbar { &::-webkit-scrollbar {
width: 4px; width: 4px;
@@ -119,11 +120,21 @@ const toggleMenu = () => {
} }
&::-webkit-scrollbar-thumb { &::-webkit-scrollbar-thumb {
background-color: rgba(156, 163, 175, 0.5); background-color: transparent;
border-radius: 2px; border-radius: 2px;
transition: background-color 0.3s ease;
}
&:hover { /* 悬停时显示滚动条 */
background-color: rgba(156, 163, 175, 0.7); &:hover {
scrollbar-color: rgba(156, 163, 175, 0.5) transparent;
&::-webkit-scrollbar-thumb {
background-color: rgba(156, 163, 175, 0.5);
&:hover {
background-color: rgba(156, 163, 175, 0.7);
}
} }
} }
} }