Comfywave 2 0 for Spotify Controls by | libVencore | Page 1

dense night May 19, 2023, 12:36 PM

#

can you make it not invert when paused and flashbang me, everything else is awesome, I tried editing the css but the inversion logic is spread across many lines

amber quartz May 19, 2023, 12:41 PM

#

It is possible, but I will have to define an extra darker wave color and keep the text to a bright color while paused

amber quartz May 19, 2023, 3:05 PM

#

dense night can you make it not invert when paused and flashbang me, everything else is awes...

#

does this look good to you?

#

:root {
  /* Change colors here (in HSL) */
  --spotify-vencord-color: 240deg 60% 60%;
  --spotify-vencord-dark: 240deg 60% 20%; /* choose darker tone (lower 3rd value) */
  --spotify-vencord-text: 100deg 50% 100%;

  /* Spotify Vencord color theme */
  --spotify-vencord-wave-width: 240px;
}
#vc-spotify-player::before {
  content: "";
  position: absolute;
  height: 25px;
  z-index: 1;
  width: var(--spotify-vencord-wave-width);
  margin-top: -28px;
  left: 0;
  background: hsla(var(--spotify-vencord-dark)/1);
  -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="240" height="25" viewBox="0 0 284 25"><path d="M283.999 15.2776C228.798 15.2776 211.243 -0.0317305 140.048 -0.000164877C69.0475 -0.000164877 51.2975 15.2776 8.58307e-06 15.2776V24.9998H284C284 24.9998 283.999 18.9392 283.999 15.2776Z"/></svg>');
  animation: spotifywave 4s linear infinite;
  animation-play-state: paused;
  animation-delay: 0s;  
  opacity: 1;
}
#vc-spotify-player#vc-spotify-player {
  background: hsla(var(--spotify-vencord-dark)/1);
  border-bottom: none;
} 
#vc-spotify-player #vc-spotify-progress-bar > [class^=slider] [class^=grabber][class^=grabber] {
  background-color: hsla(var(--spotify-vencord-dark)/1);
  border-color: hsla(var(--spotify-vencord-text)/1) !important;
  color: var(--interactive-normal);
  border-width: 2px;
  height: 8px !important;
  width: 8px !important;
}

dense night May 19, 2023, 3:13 PM

#

amber quartz ```css :root { /* Change colors here (in HSL) */ --spotify-vencord-color: 24...

I like to have a lot of contrast so my wave was all dark and text was pure white, so inversion wasn't suiting me, anything is better lol, nice trick

amber quartz May 19, 2023, 3:18 PM

#

yknow what, also update this to keep the profile container colored when paused

#vc-spotify-player + [class*=container-] rect[fill="#f23f43"],
#vc-spotify-player + [class*=container-] foreignObject[mask="url(#svg-mask-status-dnd)"] > div {
  fill: hsla(var(--spotify-vencord-text)/1) !important;
  background-color: hsla(var(--spotify-vencord-text)/1)!important;
}
#vc-spotify-player + [class*=container-] rect[fill="rgba(242, 63, 67, 1)"] {
  fill: hsla(var(--spotify-vencord-text)/1) !important;
}
#vc-spotify-player + [class*=container-] rect[fill="#23a55a"],
#vc-spotify-player + [class*=container-] foreignObject[mask="url(#svg-mask-status-online)"] > div,
#vc-spotify-player + [class*=container-] div[class^=dotOnline],
#vc-spotify-player + [class*=container-] i[class^=statusOnline-] {
  fill: hsla(var(--spotify-vencord-text)/1)!important;
  background-color: hsla(var(--spotify-vencord-text)/1) !important;
}
#vc-spotify-player + [class*=container-] rect[fill="rgba(35, 165, 90, 1)"] {
  fill: hsla(var(--spotify-vencord-tetx)/1) !important;
}
#vc-spotify-player + [class*=container-] rect[fill="#f0b232"],
#vc-spotify-player + [class*=container-] foreignObject[mask="url(#svg-mask-status-idle)"] > div {
  fill: hsla(var(--spotify-vencord-text)/1) !important;
  background-color: hsla(var(--spotify-vencord-text)/1) !important;
}
#vc-spotify-player + [class*=container-] rect[fill="rgba(240, 178, 50, 1)"] {
  fill: hsla(var(--spotify-vencord-text)/1) !important;
}

#

and

#vc-spotify-player + [class*=container-] {
  background: hsla(var(--spotify-vencord-dark)/1) !important;
}
#vc-spotify-player + [class*=container-] rect[fill="#82858f"],
#vc-spotify-player + [class*=container-] foreignObject[mask="url(#svg-mask-status-offline)"] > div,
#vc-spotify-player + [class*=container-] foreignObject[mask="url(#svg-mask-status-offline)"] > rect,
#vc-spotify-player + [class*=container-] div[class^=dotOffline],
#vc-spotify-player + [class*=container-] i[class^=statusOffline-] {
  fill: hsla(var(--spotify-vencord-text)/1) !important;
  background-color: hsla(var(--spotify-vencord-text)/1) !important;
}

#

dense night May 19, 2023, 7:04 PM

#

am I supposed to add all 4 of the messages, lemme try

#

ok works now

flint oak May 21, 2023, 1:17 PM

#

how do i get the part where the wave pauses when the music is paused but with the gradient from the earlier snippet that doesn't override the lower section (with username, mute, deaf, etc.)?
in case anyone reads this please ping

amber quartz May 21, 2023, 1:48 PM

#

@flint oak you mean the profile container goes back to normal when music is paused?

flint oak May 21, 2023, 1:50 PM

#

i wish for the wave to stop being animated but also without the colour overtaking the entire profile (like the image attached)

amber quartz May 21, 2023, 1:51 PM

#

In that case it would be the first snippet that I sent

#

The original one, not any of the snippets sent in this thread

flint oak May 21, 2023, 2:02 PM

#

https://cdn.discordapp.com/emojis/757383106196930581.webp?size=48&name=smoothbrain&quality=lossless moment

#

well uh , #🎨-css-snippets message
this one?

amber quartz May 21, 2023, 2:05 PM

#

this one

📎 tXFeZfXh.css

#

I should have said any additional snippets sent in the thread, sorrz

flint oak May 21, 2023, 2:06 PM

#

it's a bit confuzzling that search also searches threads

#

but uh when i pause it with that one the thing turns white?

#

~~but i want the gradient!~~

amber quartz May 21, 2023, 2:08 PM

#

so you want to kind of mix and match all the snippets together?

flint oak May 21, 2023, 2:09 PM

#

yes!

#

but i never messed with css before so uhh

amber quartz May 21, 2023, 2:09 PM

#

i will have to find the old gradient snippet again then

flint oak May 21, 2023, 2:10 PM

#

amber quartz i will have to find the old gradient snippet again then

#🎨-css-snippets message

flint oak May 21, 2023, 2:14 PM

#

amber quartz this one

this also swallowed the colour of the status icon

flint oak May 21, 2023, 2:15 PM

#

flint oak but uh when i pause it with that one the thing turns white?

paused

#

vs

gentle dockBOT May 21, 2023, 2:15 PM

#

flint oak vs

fixed, update, up
linux, l
mac, darwin, m
moreinfo, more info, mi
reinstall, redownload
windows, w, win

amber quartz May 21, 2023, 2:16 PM

#

flint oak paused

i did the color invert logic to differentiate between the states play and paused

#

because I kinda like it that way

flint oak May 21, 2023, 2:16 PM

#

'tis kinda bright compared to the amoled theme

amber quartz May 21, 2023, 2:18 PM

#

you can always change colors up

flint oak May 21, 2023, 2:18 PM

#

ig
just gotta find the inverted colour

#

sillytime

#

help

#

ok i quit

amber quartz May 21, 2023, 2:25 PM

#

i will try to work on it

#

but it will take a while

#

this color combination for example doesnt feel that bright to my eyes

flint oak May 21, 2023, 2:28 PM

#

taste 🤷

flint oak May 21, 2023, 2:28 PM

#

amber quartz but it will take a while

thamnk
it'd be best if these would be somehow laid out on a more organised basis

take your time ig

paper isle May 22, 2023, 8:33 PM

#

How to make it so that when it's paused, the user and the settings, mute, deafen, etc. icons are coloured like when playing

amber quartz May 22, 2023, 9:07 PM

#

amber quartz yknow what, also update this to keep the profile container colored when paused `...

This

amber quartz May 22, 2023, 9:07 PM

#

amber quartz and ```css #vc-spotify-player + [class*=container-] { background: hsla(var(--s...

And also this

paper isle May 22, 2023, 10:40 PM

#

amber quartz And also this

do i need to replace it or change it

amber quartz May 22, 2023, 10:40 PM

#

You will need to find the corresponding old code and replace it with the new one

paper isle May 22, 2023, 10:43 PM

#

amber quartz yknow what, also update this to keep the profile container colored when paused `...

All of these are new ones?

amber quartz May 22, 2023, 10:47 PM

#

iirc the original version only has them with the prefix body:has(vc.spotify-pause)

#

so in that case they are new yeah

paper isle May 22, 2023, 10:59 PM

#

amber quartz iirc the original version only has them with the prefix body:has(vc.spotify-paus...

I am a bit confused

#

I tried to replace them, but some of them were the same

amber quartz May 22, 2023, 11:08 PM

#

It means that you paste the mentioned code on top of this existing coelde

#

You will get 2 snippets of almost similar code, but one triggers when Spotify is in play, while other one does when Spotify is paused

paper isle May 22, 2023, 11:40 PM

#

amber quartz You will get 2 snippets of almost similar code, but one triggers when Spotify is...

I know I am a pain in the ass but if you can make it and send it to me that would be very much appreciated if u can't its okay cos it tryed and it won't work

vernal heron May 23, 2023, 11:06 AM

#

Any way to make it so that the wave wont overlap and the border for channels is bigger?

amber quartz May 23, 2023, 11:33 AM

#

yeah I see, the problem stemmed from the VC fix snippet

#

a solution I can think of now is keeping the buttons at the same color regardless of pause/play

#

#

but the settings buttons are now fine

#

I will send the code again in a separate snippet

#

i don't know how to publish there yet

#

lmao

amber quartz May 23, 2023, 12:11 PM

#

vernal heron Any way to make it so that the wave wont overlap and the border for channels is ...

the wave will overlap no matter what

#

i cannot fix that

amber quartz May 23, 2023, 12:14 PM

#

paper isle I know I am a pain in the ass but if you can make it and send it to me that woul...

i will post the full snippet again soon

sudden pollen May 23, 2023, 2:59 PM

#

vernal heron Any way to make it so that the wave wont overlap and the border for channels is ...

.sidebar-1tnWFu:has(#vc-spotify-player) ul[aria-label="Channels"] > li:last-child {
    padding-bottom: 20px;
}

amber quartz May 23, 2023, 3:36 PM

#

thank you for saving my life

vernal heron May 23, 2023, 3:58 PM

#

sudden pollen ``` .sidebar-1tnWFu:has(#vc-spotify-player) ul[aria-label="Channels"] > li:last-...

ooo nice. Is there a way to do this for the "Show All" button too like in the screenshot?

vernal heron May 23, 2023, 4:48 PM

#

    padding-bottom: 20px;
}```

Tried this but it didn't work (don't have any knowledge of css but just gave it a shot

sudden pollen May 23, 2023, 6:28 PM

#

vernal heron ooo nice. Is there a way to do this for the "Show All" button too like in the sc...

div#channels {
   padding-bottom: 20px;
}

queen field May 26, 2023, 7:46 PM

#

i assume this doesnt work on betterdiscord because vencord's spotify plugin is different from devilbro's?

amber quartz May 26, 2023, 7:59 PM

#

of course

#

I will continue working on spotify vencord over the weekend and hopefully release the fixed fixed fixed final version

dreamy robin May 27, 2023, 12:12 AM

#

/*custom colors in confywave 2*/
:root {
  /* Change colors here (in HSL) */
  --spotify-vencord-color: 213, 19%, 36%;
  --spotify-vencord-text: 210, 8%, 85%;

  /* Spotify Vencord color theme */
  --spotify-vencord-wave-width: 240px;
}```

#

any idea why?

amber quartz May 27, 2023, 6:08 AM

#

Don't put commas between HSL values

#

@dreamy robin Keep it as 213deg 19% 36% and 210deg 8% 85%

dreamy robin May 27, 2023, 6:42 AM

#

oh ok

dreamy robin May 27, 2023, 7:25 AM

#

thakns

#

wait lmao

#

why does the wave go flat at the trough

amber quartz May 27, 2023, 7:35 AM

#

Hmm?

dreamy robin May 27, 2023, 7:38 AM

#

#

it goes flat

amber quartz May 27, 2023, 7:45 AM

#

What's below the party plugins

#

Maybe it caused the flat trough

dreamy robin May 27, 2023, 8:10 AM

#

the other channels

#

js snippets

amber quartz May 27, 2023, 8:40 AM

#

I will see to it once I get home

amber quartz May 27, 2023, 10:46 AM

#

@dreamy robin hmmm i don't see any flats over here

dreamy robin May 27, 2023, 10:48 AM

#

hmm

amber quartz May 27, 2023, 10:50 AM

#

You can try adjusting this value until you no longer see any flats:

#vc-spotify-player::before {
margin-top: -128px;
}

remote nimbus May 27, 2023, 4:02 PM

#

anyone having no waves? persists even when theres no theme\

#

nevermind, i just saw it work for a few seconds and now its gone despite music playing

#

its messing with me (it seems to work now)

sudden pollen May 27, 2023, 4:34 PM

#

remote nimbus anyone having no waves? persists even when theres no theme\

i mean itll obv break on a highly stylized theme

amber quartz May 27, 2023, 4:35 PM

#

:3 hellpppp me check the entire thing again before I send snippet

remote nimbus May 27, 2023, 4:40 PM

#

sudden pollen i mean itll obv break on a highly stylized theme

it seems to be working

amber quartz May 27, 2023, 6:03 PM

#

The new version is here: #🎨-css-snippets message

#Comfywave 2 0 for Spotify Controls by