diff --git a/src/renderer/components/player/MiniPlayBar.vue b/src/renderer/components/player/MiniPlayBar.vue index b5517e2..44757f2 100644 --- a/src/renderer/components/player/MiniPlayBar.vue +++ b/src/renderer/components/player/MiniPlayBar.vue @@ -52,13 +52,13 @@ > - + -
+
{ } .control-button { - @apply flex items-center justify-center rounded-full transition-all duration-200 border-0 bg-transparent cursor-pointer text-gray-600; + @apply flex items-center justify-center rounded-full transition-all duration-200 border-0 bg-transparent cursor-pointer text-gray-600 hover:text-gray-800 dark:text-gray-400 dark:hover:text-gray-200; width: 32px; height: 32px; @@ -484,10 +484,9 @@ const setMusicFull = () => { } .function-button { - @apply flex items-center justify-center rounded-full transition-all duration-200 border-0 bg-transparent cursor-pointer; + @apply flex items-center justify-center rounded-full transition-all duration-200 border-0 bg-transparent cursor-pointer text-gray-600 hover:text-gray-800 dark:text-gray-400 dark:hover:text-gray-200; width: 32px; height: 32px; - color: var(--text-color-2, #666); &:hover { @apply bg-gray-100 dark:bg-dark-300; @@ -546,8 +545,7 @@ const setMusicFull = () => { } .volume-slider-wrapper { - @apply p-4 rounded-xl bg-white dark:bg-dark-100 shadow-lg; - width: 40px; + @apply p-2 py-4 rounded-xl bg-white dark:bg-dark-100 shadow-lg bg-opacity-90 backdrop-blur; height: 160px; } @@ -608,4 +606,8 @@ const setMusicFull = () => { } } } + +:deep(.n-popover){ + background-color: transparent !important; +}