aboutsummaryrefslogtreecommitdiff
path: root/src/plugins/spotifyControls/spotifyStyles.css
diff options
context:
space:
mode:
Diffstat (limited to 'src/plugins/spotifyControls/spotifyStyles.css')
-rw-r--r--src/plugins/spotifyControls/spotifyStyles.css18
1 files changed, 11 insertions, 7 deletions
diff --git a/src/plugins/spotifyControls/spotifyStyles.css b/src/plugins/spotifyControls/spotifyStyles.css
index 9c7b1c0..63a06e3 100644
--- a/src/plugins/spotifyControls/spotifyStyles.css
+++ b/src/plugins/spotifyControls/spotifyStyles.css
@@ -1,20 +1,22 @@
#vc-spotify-player {
padding: 0.375rem 0.5rem;
border-bottom: 1px solid var(--background-modifier-accent);
+
--vc-spotify-green: #1db954; /* so cusotm themes can easily change it */
}
+
.vc-spotify-button {
background: none;
color: var(--interactive-normal);
padding: 0;
width: 32px;
height: 32px;
-
border-radius: 100%;
display: flex;
justify-content: center;
align-items: center;
}
+
.vc-spotify-button:hover {
color: var(--interactive-hover);
background-color: var(--background-modifier-selected);
@@ -24,15 +26,18 @@
height: 24px;
width: 24px;
}
+
[class*="vc-spotify-shuffle"] > svg,
[class*="vc-spotify-repeat"] > svg {
width: 22px;
height: 22px;
}
+
.vc-spotify-button svg path {
width: 100%;
height: 100%;
}
+
/* .vc-spotify-button:hover {
filter: brightness(1.3);
} */
@@ -51,7 +56,9 @@
white-space: nowrap;
padding-right: 0.2em;
max-width: 100%;
+ margin: unset;
}
+
.vc-spotify-repeat-1 {
font-size: 70%;
position: absolute;
@@ -92,15 +99,12 @@
overflow: hidden;
}
-.vc-spotify-tooltip-text {
- margin: unset;
-}
-
#vc-spotify-song-title {
color: var(--header-primary);
font-size: 14px;
font-weight: 600;
}
+
.vc-spotify-ellipoverflow {
white-space: nowrap;
overflow: hidden;
@@ -137,7 +141,6 @@
#vc-spotify-progress-bar {
position: relative;
-
color: var(--text-normal);
width: 100%;
margin: 0.5em 0;
@@ -153,6 +156,7 @@
#vc-spotify-progress-bar > [class^="slider"] [class^="bar-"] {
height: 4px !important;
}
+
#vc-spotify-progress-bar > [class^="slider"] [class^="grabber"] {
/* these importants are neccessary, it applies a width and height through inline styles */
height: 10px !important;
@@ -168,7 +172,6 @@
.vc-spotify-progress-time {
font-size: 12px;
-
top: 10px;
position: absolute;
}
@@ -176,6 +179,7 @@
.vc-spotify-time-left {
left: 0;
}
+
.vc-spotify-time-right {
right: 0;
}