\ very smol hover to open for channels

[sage niche]

for the channel one- with certain additional CSS the spotify player still somewhat shows. can i prettyplease have a line to add to the snippet that hides the player when the channels aren't hovered?

[merry remnant]

what certain additonal css?

[sage niche]

will fuck around and check out what causes it

#1108415920201814118 message

this added the icons for me

#vc-spotify-song-title::before,
#vc-spotify-song-title + div::before,
#vc-spotify-song-title + div + div::before {
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  padding: 7px;
  margin-left: -17px;
  margin-top: 2px;
  content: '';
  background-color: var(--header-primary);
  /* Spotify wave thingy fix */
  /*background-color: hsla(var(--spotify-vencord-text)/1);*/
  position: absolute;
}
#vc-spotify-song-title + div::before,
#vc-spotify-song-title + div + div::before {
   background-color: var(--header-secondary);
  /* Spotify wave thingy fix */
  /*background-color: hsla(var(--spotify-vencord-text)/1);*/

}
#vc-spotify-song-title::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%' height='100%' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-music-4'%3E%3Cpath d='M9 18V5l12-2v13'%3E%3C/path%3E%3Cpath d='m9 9 12-2'%3E%3C/path%3E%3Ccircle cx='6' cy='18' r='3'%3E%3C/circle%3E%3Ccircle cx='18' cy='16' r='3'%3E%3C/circle%3E%3C/svg%3E");
}
#vc-spotify-song-title + div::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-mic'%3E%3Cpath d='M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z'%3E%3C/path%3E%3Cpath d='M19 10v2a7 7 0 0 1-14 0v-2'%3E%3C/path%3E%3Cline x1='12' x2='12' y1='19' y2='22'%3E%3C/line%3E%3C/svg%3E");
}
#vc-spotify-song-title + div + div::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-disc-2'%3E%3Ccircle cx='12' cy='12' r='4'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='12' x2='12' y2='12.01'%3E%3C/line%3E%3C/svg%3E");
}

had to send them seperately but this is what I have that has the icons

i fiddled with the position : absolute to different options but it was either one or the other

gonna just remove it for now its not needed :>

i can't tell what causes the time to stay there

[merry remnant]

I think its because Spotify player's padding is separate from the channel list, but the width are linked. I'll try fixing it when I remember to do it.

[sage niche]

hm ok, thank you

[wild wind]

It doesn't work for the channels on my end, not sure what I'm doing wrong. The collapsible effect works on servers just fine.

Also is there any way to make it compatible with Nitro theme colors? I use the darjer purple one so it turns the left side into a narrow black box. If it's not possible, no wçorries!

[merry remnant]

I cant modify it for nitro as discord can't theme their own fucking app properly,why should I? For the channels thing, is the channels one at the top of your CSS?

[wild wind]

No worries for Nitro Discord, totally understandable! I don't think I had the channels snippet code at the top of my CSS no, going to give it another go. Thanks for the follow up, appreciate it 👍🏾

[jagged fiber]

It's not working right now...

[sage niche]

/* small channel list */
.sidebar_ded4b5 {
    width: 0px!important;
    padding-left: var(--channel-mini)!important;
    transition: all 0.4s;
}
.sidebar_ded4b5:hover {
    transition-delay: 0s;
    width: var(--channel-max)!important;
    padding-left: initial!important;
}
/* edit it */
:root {
    --channel-mini: 24px;
    --channel-max: 240px; /* normal channel list size */}

class name change

[jagged fiber]

Hurrah!

[lunar patio]

you have for server part?

[sage niche]

/* small server list */
.guilds__2b93a {
    width: 0px!important;
    padding-left: var(--guild-mini)!important;
    transition: all 0.3s; /* smoothest slide in the west */
}
.guilds__2b93a:hover {
    transition-delay: 0.1s;
    width: var(--guild-max)!important;
    padding-left: initial!important;
}
/* edit it */
:root {
    --guild-mini: 24px;
    --guild-max: 72px; /* normal server list size */ }

[jagged fiber]

Honestly this works way better with both enabled than BetterDiscord's CollapsibleUI plugin

[lunar patio]

thankyou~

[charred barn]

why is it like this?

[merry remnant]

Shitty PC. Try using vesktop

Or if you have many plugins or CSS snippets on, try turning them off

[charred barn]

vestop?

ohh i see ill try tat

it worked ty

[nocturne basin]

neat

[hearty steeple]

does this still work on one newer discord versions? I thought it was an incompatibly with a theme at first but I disabled all themes and still couldn't get it to work

[sage niche]

works for me, use the class name changes i posted above

https://tenor.com/view/cat-cute-adorable-tablet-scrolling-gif-17747579

[night sage]

@sage niche did u ever figure out the spotify icons situation?

[sage niche]

uuh

lemme find itttttttttttttttt

[sage niche]

oh i just ended up removing the symbols entirely

this is what mine looks like now\

couldnt figure out how to remove the movement of the progressbar when i hover but otherwise it works for all i need it to :)

[nocturne basin]

@merry remnant looks like this is broken on latest canary :P

[merry remnant]

hfuwhwrehwefhigbsdiahefsdbfsigbepfvojdf

[nocturne basin]

/* fuck you discord */
.sidebar_e031be {
    width: 0px!important;
    padding-left: var(--channel-mini)!important;
    transition: all 0.4s;
}
.sidebar_e031be:hover {
    transition-delay: 0s;
    width: var(--channel-max)!important;
    padding-left: initial!important;
}
```fixed ![bleh](https://cdn.discordapp.com/emojis/1032974662122098698.webp?size=128 "bleh")

[unkempt grove]

is this no longer working?