🎨-theme-development

[humble jay]

i cant find this original to see if it is still updated or anything

@vestal field

[humble jay]

ok fixed here

no rounded edges

/* [#🎨-theme-development message](/guild/1015060230222131221/channel/1134844326933954622/) */
/* ################ */
/* No Rounded Edges */
/* ################ */

*,
*::before,
*::after {
    border-radius: 0 !important;
}
/* Hide original indicators */
.cc5dd25190031396-svg > mask,
._44b0c28be7879b7b-svg > rect,
._44b0c28be7879b7b-svg > circle,
._44b0c28be7879b7b-svg > g,
._44b0c28be7879b7b-svg rect[mask='url(#:rhi:)'],
._20a53846fe2e8513-avatar .a423bdd721ddcc83-status {
    display: none;
}
/* Remove mask from pfps */
._68edb95846a37624-mask > foreignObject,
._44b0c28be7879b7b-svg > foreignObject,
._2338f50c3988e5ec-svg > foreignObject {
    mask: none;
}
._44b0c28be7879b7b-wrapper,
._1ce5d425feffd32a-container {
    --online-2: #43a25a;
    --idle-2: #ca9654;
    --dnd-2: #d83a41;
    --offline-2: #82838b;
    --streaming-2: #9147ff;
}
/* make square online icon */
._44b0c28be7879b7b-wrapper:has(rect)::after,
._1ce5d425feffd32a-container:has(.a423bdd721ddcc83-status)::after {
    content: '';
    display: block;
    position: absolute;
    height: 10px;
    width: 10px;
    bottom: -4px;
    right: -4px;
    border: 2px solid var(--background-base-lower);
}
._44b0c28be7879b7b-wrapper:has(rect[fill='#43a25a'])::after,
._44b0c28be7879b7b-wrapper:has(rect[fill='#45a366'])::after,
._44b0c28be7879b7b-wrapper:has(rect[fill='#23a55a'])::after,
._1ce5d425feffd32a-container:has(.a423bdd721ddcc83-status[style*='rgb(67, 162, 90)'])::after {
    background: var(--online-2) !important;
}
._44b0c28be7879b7b-wrapper:has(rect[fill='#ca9654'])::after,
._44b0c28be7879b7b-wrapper:has(rect[fill='#ffc04e'])::after,
._44b0c28be7879b7b-wrapper:has(rect[fill='#f0b232'])::after {
    background: var(--idle-2) !important;
}
._44b0c28be7879b7b-wrapper:has(rect[fill='#d83a42'])::after,
._44b0c28be7879b7b-wrapper:has(rect[fill='#da3e44'])::after,
._44b0c28be7879b7b-wrapper:has(rect[fill='#f23f43'])::after {
    background: var(--dnd-2) !important;
}
._44b0c28be7879b7b-wrapper:has(rect[fill='#82838b'])::after,
._44b0c28be7879b7b-wrapper:has(rect[fill='#84858d'])::after,
._44b0c28be7879b7b-wrapper:has(rect[fill='#80848e'])::after {
    background: var(--offline-2) !important;
}
._44b0c28be7879b7b-wrapper:has(rect[fill='#9147ff'])::after,
._44b0c28be7879b7b-wrapper:has(rect[fill='#593695'])::after {
    background: var(--streaming-2);
}

.cc5dd25190031396-lowerBadge {
    border: 2px solid var(--background-base-lower);
    bottom: -4px;
    right: -4px;
}
.cc5dd25190031396-upperBadge {
    border: 2px solid var(--background-base-lower);
    top: -4px;
    right: -4px;
}
._48112cbe77dc5022-folderGroup._48112cbe77dc5022-isExpanded > .dbd2630aec71879b-stack {
    overflow: visible !important;
}
._3f21e80f8677ec40-slider > rect[rx='10'] {
    rx: 0 !important;
}
::-webkit-scrollbar-thumb {
    border-radius: 0 !important;
}

[vestal field]

just steal it from github.com/refact0r/system24

you may have to replace the variables

[crimson skiff]

ie steal it from you

[tranquil whale]

Should i steal components from different themes abd make my own mashup

And*

Anyone willing to donate code

[languid copper]

Love ur theme :)

[junior grove]

Discord why

[echo frost]

what

[onyx mesa]

normalize giving context

[junior grove]

They moved the vc panels to the left and because of the option to resize the channel list, it was creating a loooooooong black square as max-width stopped existing

(and doing funny with oldcord)

[eager pagoda]

does anyone have a working CSS to hide the name glows / username gradients?

tried some recent ones I've found in this server and none of them work

[harsh harbor]

there's an option in accessibility to disable display name styles

[smoky belfry]

Yes

[smoky belfry]

Some want the styles but not the ass gradients

[eager pagoda]

already done that, shit still appears

example

[eager pagoda]

can you tell me which one it is?

[pine needle]

#🎨-theme-development message

I believe this still work just edit gradient-glow

[smoky belfry]

Oh yeah i forgor

[eager pagoda]

@pine needle @smoky belfry thanks to you both! I've managed to fix it with the link Fay gave me

edited it a little so it doesn't break role colors (only affects the chat)

[class*="usernameGradient"] {
    background: none;
    color: color-mix(in oklab, var(--custom-gradient-color-1), var(--custom-gradient-color-2));
    -webkit-text-fill-color: initial;
    filter: none;
}

👍

[smoky belfry]

This not enough if you don't want the glow

[eager pagoda]

it works

I also have "Display Name Styles" disabled

[eager pagoda]

^ before

after:

with both the CSS plus "display name styles" disabled

it's enough for me, as long as it's readable it's fine

[smoky belfry]

[class*=convenienceGlowGradient]::after
,[class*=nameGlow]
{
	display: none;
}

[class*=ColorGradient]
{
	background-image: unset;
	background-color: var(--custom-gradient-color-1);
} 

This is what i use with display name styles enabled

[tranquil whale]

im planning on making a new css snipet any ideas

[tranquil whale]

made a news ticker for discord

[languid copper]

What is that?

[late lichen]

finally its back, need to remove mine tho

[tranquil whale]

News ticker like the thing at the bottom of news channels and it updates daily

[crimson skiff]

mad shit

[tranquil whale]

It uses backend too

Its crazy

But i would say its worth it

[echo frost]

wtf

[tranquil whale]

stocks and quotes also possible

[languid copper]

using just css or is it a plugin?

[tranquil whale]

just css

[echo frost]

wdym that it updates daily?

[tranquil whale]

auto updating

[echo frost]

how are you doing that with just css

[vestal field]

fetch an image from a backend that updates maybe?

[echo frost]

yeah

they dmed me about it

i figured that, but they said just css which confused me

which like yeah it sort of is just css, but there's a backend which isn't css

[tranquil whale]

true

someone made a working login counter before

[tranquil whale]

oh god i found a way to make a login counter but must be self hosted as its one server per person

[velvet pawn]

you could make the user set a specific id or something

if that’s what you mean

[tranquil whale]

Used a backend server to generate svg to put in top bar when server is pinged on discord load, it ups the load count. basically just for fun

[languid copper]

can i get pls

[split compass]

Any people who are used to dealing with stylix? Currently using the default setting and I am a bit lost on how to fix this, currently passing in through a base16 palette

[north rapids]

anyone got background set with blur?

I need the css code for it

[ornate zodiac]

Anyone know how to change the window name of the Discord App with built in CSS?

   <div class="f34534e8a5d3ca64-icon edbb22df99c39831-guildIcon f34534e8a5d3ca64-iconSizeMini f34534e8a5d3ca64-iconActiveMini" style="background-image: url(&quot;https://cdn.discordapp.com/icons/1015060230222131221/0fdc21fa2852b67710d19ecd32b6462e.webp?size=40&quot;);"></div>
   <div class="_4bd5201c86a2042b-defaultColor _4bd5201c86a2042b-lineClamp1 cf48127484dbde85-text-sm/medium" data-text-variant="text-sm/medium">libVencore</div>
</div>```

[split compass]

Like the content between HTML tags or the class name?

[ornate zodiac]

I guess so, it changes based on server and which tab you're on IE: Friends, Direct Messages etc.

I need to force the name and possibly force image as it pulls directly from the servers icon or like the friend tab has a "friend" emoji so to speak

[ornate zodiac]

@tranquil whale Might be able to help, seems like you know alot?

[split compass]

selector {
   content: 'whatever it is you want to add';
}

[tranquil whale]

Sure i just woke up ill help later today

[ornate zodiac]

To add in the css in Vencord settings?

So confused right now, don't really do apps much

[tranquil whale]

Like the windows bar with custom controls or the app name

[ornate zodiac]

The name at the top, the window name

[tranquil whale]

Oh that one thats easy

Ill find it when on pc its in my stash somewhere

[ornate zodiac]

Alright thank you

[echo frost]

that's not how content works

that's how it works with pseudoelements like ::after and ::before, but not normal html elements

[split compass]

ahh gotcha

[echo frost]

https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/content

mdn is a great resource for css, and also html/js

[tranquil whale]

try this

.edbb22df99c39831-title::after {
font-family: var(--custom-title-font-family);
font-size: var(--custom-title-font-size);
font-weight: 500;
line-height: 1.2857142857142858;
content: var(--custom-title-text);
color: var(--text-default);
}

.edbb22df99c39831-title div {
display: none !important;
}

just set the vars

[ornate zodiac]

It doesn't seem to set the font family like Bold or Italic

font-family: "Sans Bold Italic", sans-serif;

or would I need to add
font-style: italic;

nvm

    font-style: italic;
    font-size: 14px;
    font-weight: 700;

It still shows the built in svg's (i assume) from discord however it still blocks the server profile image @tranquil whale

Even tho "edbb22df99c39831" is hidden, the svg is still loaded

<div class="edbb22df99c39831-title" aria-label="Open Quick Switcher" role="button" tabindex="0">
   <svg aria-hidden="true" role="img" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24">
      <path fill="var(--interactive-icon-default)" d="M13 10a4 4 0 1 0 0-8 4 4 0 0 0 0 8Z" class=""></path>
      <path fill="var(--interactive-icon-default)" d="M3 5v-.75C3 3.56 3.56 3 4.25 3s1.24.56 1.33 1.25C6.12 8.65 9.46 12 13 12h1a8 8 0 0 1 8 8 2 2 0 0 1-2 2 .21.21 0 0 1-.2-.15 7.65 7.65 0 0 0-1.32-2.3c-.15-.2-.42-.06-.39.17l.25 2c.02.15-.1.28-.25.28H9a2 2 0 0 1-2-2v-2.22c0-1.57-.67-3.05-1.53-4.37A15.85 15.85 0 0 1 3 5Z" class=""></path>
   </svg>
   <div class="_4bd5201c86a2042b-defaultColor _4bd5201c86a2042b-lineClamp1 cf48127484dbde85-text-sm/medium" data-text-variant="text-sm/medium">Friends</div>
</div>

[echo frost]

it isn't hidden
aria-hidden is for screen readers

[ornate zodiac]

so how would I remove the svg

even tho .edbb22df99c39831-title div { display: none !important; }

i dont mean aria-hidden, I mean the original div is hidden

[echo frost]

.c38106a3f0c3ca76-title>.edbb22df99c39831-title>:is(svg, .f34534e8a5d3ca64-icon) {
  display: none;
}
.c38106a3f0c3ca76-title>.edbb22df99c39831-title>.cf48127484dbde85-text-sm\/medium {
  font-size: 0;
  &::after {
    font-size: 14px;
    content: "custom title";
  }
}

[late lichen]

change div to svg?

[echo frost]

wdym

[echo frost]

use this

[ornate zodiac]

    display: none !important;
}

.edbb22df99c39831-title svg {
    display: none !important;
}``` 

this works too

I guess

[echo frost]

do not do that

that'll display none many other things

[ornate zodiac]

But am I not only hiding the SVG in div "edbb22df99c39831"

It works at the moment and I don't see any issues

    display: none !important;
}```

And this, I could then force another SVG using ::after and it'd work?

[late lichen]

id use ::before since the image comes first on the title, and you are already using ::after for the custom title

[ornate zodiac]

So would be like this to keep the same image on every page?

.edbb22df99c39831-svg::before {
<svg aria-hidden="true" role="img" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24">
}

[echo frost]

does this not work for you?

[ornate zodiac]

nvm im stupid

.edbb22df99c39831-svg::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3C/svg%3E");
}

Like this no?

[echo frost]

so you don't want to hide the svg

please actually say what you want to do

[ornate zodiac]

I do, which works here, yet I want to force a new one

[echo frost]

you want to replace it

[ornate zodiac]

Yes.

[echo frost]

that svg looks like it's blank

[ornate zodiac]

Right.

[echo frost]

pretty much except that class doesn't exist

do you have an image in mind that you want as the icon?

[tranquil whale]

anyone got basic css snippet to set a bg image

[echo frost]

background-image: url(image url here);

[echo frost]

you want to use that png or you want an svg that looks like that

[ornate zodiac]

Not sure if you can change the colour, with the SVG you could stroke="#000000"

[ornate zodiac]

That one

[echo frost]

you don't want it as an svg?

an svg is better in every way for things like that

[ornate zodiac]

I mean that would be ideal

[echo frost]

do you have the svg

[ornate zodiac]

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#CACACA" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path><circle cx="12" cy="12" r="3"></circle></svg>

then the stroke would be #CACACA to follow the text colour

[echo frost]

need to go now but can help more in 20-30 mins

[ornate zodiac]

Ight I might be asleep it's 2:40AM but if you could ping me then I can see it tomrrow.

/* Custom message prompt */

.placeholder__1b31f.slateTextArea_ec4baf.fontSize16Padding__74017 {
    visibility: hidden;
}

.placeholder__1b31f.slateTextArea_ec4baf.fontSize16Padding__74017::before {
    visibility: visible;
    content: var("-");

}

Also had this which seems to be broke now? 🤷🏼‍♂️

[late lichen]

?```css
.edbb22df99c39831-title::before {
content: "";
display: inline-block;
width: 24px;
height: 24px;
background-repeat: no-repeat;
background-size: contain;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%23CACACA" stroke-width="2" ><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path><circle cx="12" cy="12" r="3"></circle></svg>');
}

[ornate zodiac]

Pretty much

How would I alter the thickness

Stroke width right?

[late lichen]

yea, but its this way stroke-width="2"

[echo frost]

ok i'm back

[echo frost]

it's kebab case not camel case
so stroke-width etc.

so use this @ornate zodiac

.edbb22df99c39831-title {
  >:is(svg, .f34534e8a5d3ca64-icon) {
    display: none;
  }

  >.cf48127484dbde85-text-sm\/medium {
    font-size: 0;

    &::after {
      font-size: 14px;
      content: "custom title";
    }
  }

  &::before {
    content: "";
    width: 24px;
    height: 24px;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" stroke="%23CACACA" stroke-width="2"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path><circle cx="12" cy="12" r="3"></circle></svg>');
  }
}

[austere oar]

How do I make quick css not cover the entire ui

but just the bg

like it covers the images it covers all the ui everything

it covers the pfps

etc

how to change that

It makes it genuinely hard to use discord

And I cannot use that

😭

[onyx mesa]

what

[austere oar]

Ima send ss

My gf sent me a quick css

[austere oar]

Its just an image slapped on top of the entire screen

Over the pfps over the ui everything

[onyx mesa]

was it working fine for your gf?

[austere oar]

She uses it that way

💀

Cuz she has light theme and low opacity of image

But I dont so how can I fix this

But like

What do I do so it DOESNT cover it all

And isnt just a slapped image on top

[onyx mesa]

would need the css of the theme that adds that picture

there's also alot of transparent themes that let's you add any picture as background

could just use one of those instead

[harsh harbor]

try using this for example. does the job you want it to do.

if that doesn't work, quite literally there's a million themes that do this exact same thing, just look around for it.

[steady sapphire]

how do I hide the active now tab on the right?

keeps showing things from people that i blocked

nvm, i figured out

[class^=_133bf5eea8e33a34-nowPlayingColumn] {display:none;}
does the work well

[pure cairn]

I had a snippet for that, but it's outdated rn

[pure cairn]

I'll try to get it updated later

[ornate zodiac]

@echo frost Sorry to keep asking but do you know hwo to fix this?

[ornate zodiac]

  /* Discord Custom Message Box */
  div[contenteditable="true"][data-slate-editor] {
      position: relative;
  }

  /* Hide Discord's original fake placeholder */
  div[contenteditable="true"][data-slate-editor]
  span[class*="emptyText"] {
      color: transparent !important;
  }

  /* Custom placeholder when empty */
  div[contenteditable="true"][data-slate-editor]
  :has(span[data-slate-zero-width])::after {
      content: "Sample Text";
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      color: var(--text-muted);
      opacity: 0.4;
      pointer-events: none;
      font-size: 16px;
      line-height: 1.375;
      white-space: nowrap;
  }

was trying something like this

[echo frost]

try using the class updater in #theme-support

[timber mist]

does anyone have css to hide this button? there used to be an experiment for it but it got removed

i tried using the element inspector but i know basically nothing about css :c

[harsh harbor]

.a22cb0c66246f5d3-button {
  display: none;
}```

a fair warning, this might get rid of other stuff but my main aim was achieved

[echo frost]

that hides all buttons like that

this will only hide that button

.c0e32c5cffed3d9f-emojiPicker>.c0e32c5cffed3d9f-header>.a22cb0c66246f5d3-button {
  display: none;
}

>.c0e32c5cffed3d9f-header> you could probably replace this with a space, and be fine, but i like to be safe

[ornate zodiac]

Still doesn't work

[echo frost]

what is it supposed to do?

replace this?

[ornate zodiac]

Yeah

Not sure if it's because its a node

[echo frost]

what is var("-")

._1b31f471f0bb10ab-placeholder.ec4baf0360ff3578-slateTextArea {
  visibility: hidden;
  &::before {
    visibility: visible;
    content: var("-");
  }
}

[ornate zodiac]

the text that's meant to be replaced, just placeholder right now

[echo frost]

you mean the replacement?

[ornate zodiac]

/* Custom Chatbox Prompt  */

._1b31f471f0bb10ab-placeholder.ec4baf0360ff3578-slateTextArea.fontSize16Padding__74017 {
    visibility: hidden;
}

._1b31f471f0bb10ab-placeholder.ec4baf0360ff3578-slateTextArea.fontSize16Padding__74017::before {
    visibility: visible;
    content: var("TEST");
}

[ornate zodiac]

Yeah

[echo frost]

that won't work

var("TEST") won't

https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/var

[ornate zodiac]

It worked before but broke

[echo frost]

actually maybe it will treat that as the fallback

but it didn't work with "-", so no

you just do "TEST"

[ornate zodiac]

It's been working with @ornate zodiac for like a year

[echo frost]

._1b31f471f0bb10ab-placeholder.ec4baf0360ff3578-slateTextArea {
  visibility: hidden;
  &::before {
    visibility: visible;
    content: "TEST";
  }
}```

[echo frost]

?

[ornate zodiac]

But broke recently, only just noticed

"@ornate zodiac" as the text

[echo frost]

var("TEST") is invalid text

ok that'll work

it just can't be in a var

that's not how var works

[echo frost]

read this

[ornate zodiac]

How has it worked for like the last year?

It works now but blows my mind how it had worked now doesn't

[echo frost]

are you sure you had a string in var

[timber mist]

thanks

[ornate zodiac]

100% positive

[echo frost]

you probably had something like var(--text) or something

that's how it's supposed to be

unless

yeah putting that does not work

or like this content: var(--test, "TEST");

[ornate zodiac]

possibly, i did mess around with it before asking for help

not sure how it broke however

[echo frost]

you could do ctrl+z to see what it was if you haven't closed your quickcss
(don't edit it when you're back there, or you won't be able to ctrl+y back)

[ornate zodiac]

It's been opened and closed a few times tbf

[echo frost]

oh do you use tbf as to be frank?

it always confuses me when people use tbf (to be fair) like tbh (to be honest)

[unborn steppe]

hey guys, I got the new settings modal, does anyone know how to change it back to the old one

[pure cairn]

#🎨-css-snippets message

[ornate zodiac]

fiar not frank hahah

[tribal seal]

any way to change deafen color back to normal red? sticks out like a sore thumb

when i try to do it it colors all animated icons red though 💔

[half crystal]

go for something like .[#####]-redGlow .[#####]-lottieIcon to do it properly

[tribal seal]

what goes in the # parts? assuming thats a placeholder

[half crystal]

class hash

[tribal seal]

unfortunately doesnt seem to do anything

[pure cairn]

https://github.com/Krammeth/css-snippets/blob/main/StatusHider.css

can be helpful with that

[chilly knoll]

so sorry

[neon elm]

does anyone know what class or whatever server icons are under

i used to have a thing to square them but that broke and i cannot find anything that works to make them square again

::-webkit-scrollbar-thumb,
* {
    border-radius: 0 !important;
}

/* hide round masks */
[class^='listItem_'] [class^='wrapper_'] > [class^='svg_'] > mask,
[class^='bannerSVGWrapper_'] > mask > circle {
    display: none;
}
[class^='mask_'] > foreignObject,
[class^='svg_'] > foreignObject {
    mask-image: none;
}```
this old thing doesn't work anymore

nevermind i just saw another post answering my question whoops

#🎨-theme-development message
up here if anyone needs it

[neon elm]

okay so seemingly it was radialstatus that was causing the problem

though annoyingly its one or the other

[onyx mesa]

why does the nameplate on the user panel just become blank randomly

[austere cloak]

Discord change again variables 🔫

[pine needle]

anyone's themes running quite slow?
is it themes? or the client itself hmmm.

[errant zenith]

my client is painfully slow since today morning

[pure cairn]

My whole client has been slow since a few days now

Especially typing

[finite meteor]

How to fix server icons not displaying with QuickCSS enabled?

[vivid flame]

https://www.reddit.com/r/discordapp/s/6AlWpTEHbG it seems to be quite common a support staff even answered under the thread that they are looking into it

[echo frost]

remove the css that's causing the issue
or disable quickcss

typing is always much slower

I do think i'm noticing discord to be a bit slower than normal

[vivid flame]

yeah but its much slower now and i noticed cpu temps spike quite a bit when i type before their recent update it stayed the same

[pure cairn]

I should ask them to make devtools less laggy as well then

[vivid flame]

yeah fr its been a pain in the ass since the css format update

it crashes and lags a lot

[manic flume]

Does anyone have CSS for compact branches?

like this

[manic flume]

As a temporary solution, I just did this.

._5b40bdd67543ba35-container ._2ea32c412048f708-link {
padding-top: 0px !important;
padding-bottom: 0px !important;
}

[echo frost]

isn't that because of all the variables?

[pure cairn]

Yeah, so?

[brazen quartz]

yeah, newer firefox fixed this by adding a "show more" button

[echo frost]

oh i read that as why devtools is laggy for some reason

[pure cairn]

No, it's been laggy for a while now

[echo frost]

ik

[pure cairn]

But now with the other lag it's almost unbearable

[echo frost]

hasn't it always been laggy?

[pure cairn]

Not even my css's fault

[pure cairn]

It wasn't when :has() still had a minimum impact on performance

So about a year ago

[echo sonnet]

could anyone help me with how to modify the accent colors of https://github.com/refact0r/system24 i put this in my quickcss, it worked for a while but after some time it just broke

:root {
    /* Only change the purple variables that control accent colors */
    --purple-1: oklch(75% 0.16 65) !important;
    --purple-2: oklch(70% 0.16 65) !important;
    --purple-3: oklch(65% 0.16 65) !important;
    --purple-4: oklch(60% 0.16 65) !important;
    --purple-5: oklch(55% 0.16 65) !important;

    /* Make DND status a more vibrant red instead of the default red */
    --dnd: rgb(216, 58, 66) !important;

    /* Fix only the specific variables that were causing issues */
    --accent-new: var(--purple-2) !important;
    --streaming: var(--purple-2) !important;
}

/* Only override the accent variables that reference purple */
:root {
    --accent-1: var(--purple-1) !important;
    --accent-2: var(--purple-2) !important;
    --accent-3: var(--purple-3) !important;
    --accent-4: var(--purple-4) !important;
    --accent-5: var(--purple-5) !important;
}

/* Target only specific elements that are still pink */
/* New message indicator - very specific selector */
div[class*="unreadMessages"] {
    background-color: var(--purple-2) !important;
}

[echo sonnet]

like the colors arent applied anymore

i am using the install method install through link

[smoky belfry]

i know there's a tool to like see which CSS rules are the ones slowing down stuff, but i can't remember what it is, can someone tell me ?

[echo frost]

there's a performance tab in devtools

there was also a snippet that measured the time to queryselector the selectors, but that doesn't actually measure css performance accurately because css selectors work differently to queryselector

[lime ginkgo]

i have checked the BD theme doc
dont see any way to set the bg image?

[pure cairn]

Easiest way is setting it to the body and making everything else transparent

[lime ginkgo]

huh?
make everything trans?

[onyx mesa]

why did they anchor the button to the right side

instead of it being on the circle

this is so annoying

[errant zenith]

everybody transgender

transgender for everyone

[pure cairn]

😭

It was so fitting inside the role dot

[lime ginkgo]

so there is no way to make the background image?

[onyx mesa]

i fixed this with some ducktape and shit

now the gradient animation is broken and i can not seem to fix it

[pure cairn]

[onyx mesa]

it does not loop properly anymore, i haven't changed any values on it, so i am confused

[echo frost]

like krammeth said

body {
  background-image: url(https://cdn.discordapp.com/avatars/608842853392842753/cafc148d26d26aa5200a6410ff6fe2e2.png?size=1024);
  * {
    background: transparent !important;
  }
}

there's themes already made that you can just replace the image url and have it work immediately instead of having to pick and choose which elements need a background

[lime ginkgo]

cuz i use the other theme
but override with blur & image

the old theme is dead ofc
but now the quick css is also fail

so i just want a way to make it

[echo frost]

what other theme?

[vivid flame]

mfw changes are made just for the sake of having changes

[echo frost]

what did roles used to look like?
something looks so off about them now

oh i have a ss from 12/29

now they're like this

looks like the old border-radius was 8px

.af3987915705da59-role {
  border-radius: 8px;
}

[late lichen]

didnt it have a margin-left 2px on the text tho?

[echo frost]

yeah there was also more margin/padding before too

the border-radius bothers me more though

[pure cairn]

Smaller border-radius, the "remove role" cross was inside the role dot, the role icon was vertically aligned to the center instead of the bottom

[echo frost]

yeah

does anyone have a screenshot or video or something of what the x was like before

[harsh harbor]

it was like this inside the role dot

[echo frost]

do you have a not completely cropped image?

ik it was inswide the role dot

i don't remember how the behaviour was

[harsh harbor]

i just sourced this from the server, it isn't mine

[echo frost]

like does it show when hovering over the circle or the tag

[harsh harbor]

it showed when hovering over the role pill

iirc

[echo frost]

is the pill the whole thing or the circle?

[harsh harbor]

it was the circle

so you'd hover over the circle, the x would show and you could click to remove the role

[echo frost]

ok

i got the position and stuff, but i'm not sure how to make the x visible

because the dot can be any color

[pure cairn]

Try if white with some drop shadow helps

[hazy frigate]

been a hot minute so i'll ask about this again, does anyone have something to put this thing back in the bottom right corner?

[echo frost]

doesn't seem to work

ok well here's my css if anyone wants to mess around with it

.af3987915705da59-role {
  border-radius: 8px;
  &.af3987915705da59-hasRemoveButton {
    -webkit-padding-end: 8px;
    padding-inline-end: 8px;
  }
  .af3987915705da59-removeButton {
    position: absolute;
    color: black;
    width: 12px;
    margin: 0 4px;
    opacity: 0;
    transition: color 50ms ease-in, opacity 50ms ease-in; 
    /* &:hover {
      opacity: 1;
    } */
    /* svg {
      filter: drop-shadow(1px 1px 10px red);
    } */
  }
  &:hover .af3987915705da59-removeButton {
    opacity: 1;
  }
}

the commented out hover is for hovering over the dot to show the x

the one that isn't commented out is hovering over the role, which i prefer

[onyx mesa]

I used mix-blend-mode: difference; with a grey base color, seemed to work the best

[broken fable]

I'm on Linux. I assume css modifications should be platform-independent. How would I go about putting the window control buttons to the top left corner of the app instead of the right? I've found these divs in devtools but I'm not exactly sure what to do with them.

[broken fable]

I think I'm figuring it out lol I'll post results later

[pure cairn]

.c38106a3f0c3ca76-trailing {
  width: 100%;

  >.c38106a3f0c3ca76-winButtons {
    flex-direction: row-reverse; /* remove this if you don't want them to be reversed */
    position: absolute;
    left: 0;

    &::before {
      display: none;
    }
  }
}```

[broken fable]

it works 😭 🙏

hmm there's some weirdness going on with the buttons; it's not entirely equal in size or spacing if you look really close. I see inspector with weird 'almost' values like 17.993px when it's supposed to be 18px flat. Whatever, I'll figure it out some other time. Also got to fix that red highlight thing somehow, since I don't see it in devtools

[brazen quartz]

it rounds 17.993 to 18

[pure cairn]

I guess it's scaled accordingly to the screen size

looks good though

[broken fable]

thanks

the issue might have been because of my keeping my discord at 90% scaling

I think I can live with that

I just need to figure out the whole button highlighting thing that discord does but it's not like I notice it too often anyway

[pure cairn]

What button highlighting?

The one you get by pressing tab a bunch of times?

[pure cairn]

That makes a square here

[broken fable]

Oh that happens when I hover over the close window button

[broken fable]

my implementation of macOS-style window buttons. Thanks to @/krammeth for the main code

[echo frost]

why are you using pngs for the icons 😭

also why aree there some random true tabs when most of it is spaces

[broken fable]

I'm new to all this 🥹 I'm gonna try to do an svg implementation but no promises since I made this for myself

[echo frost]

i found a github repo with them as svgs
https://github.com/lwouis/macos-traffic-light-buttons-as-SVG/

you should probably remove the enable-background, i'm not sure what it's for, and my brief searching said it's deprecated

and i don't notice a difference when removing it

[echo frost]

found another. not sure which is better https://github.com/aw3r1se/macOS-traffic-lights

[hazy frigate]

bump

[pure cairn]

Give me 10m and I'll see what I can do

[pure cairn]

._0f481cbbd7530492-jumpToPresentBar {
  margin-right: 8px;
}```

(sorry, I fell asleep on the couch)

[frigid zinc]

css that will break on update cat_thinking

[pure cairn]

it takes so little to update that I stopped even caring about that

tbh

[chilly knoll]

meanwhile me who dropped my vencord port for the theme I use on everything bcuz i couldn't keep up with the changes

[minor panther]

is there css somewhere to revert this back to what it looked like before discord changed it

like this

[half crystal]

#🎨-css-snippets message

[minor panther]

ty

[pure cairn]

that's sad

[echo frost]

this with a few modifications (mix-blend-mode: difference) and what blade linked to
#🎨-theme-development message

I can send the version with the mix-blend-mode later

I'm not sure why your icons are to the left though
I don't remember them ever being that (but I didn't see many roles with icons, so I might be misremembering)

[minor panther]

oh

[minor panther]

ty

[echo frost]

the changes I made in this is I used color: #fff8; and put the mix blend mode in svg

[tranquil whale]

Is there a way to appeal from my modmail ban

i made the holy grail spotify player css snippet

custom grabber

[echo frost]

.af3987915705da59-role {
  border-radius: 8px;
  &.af3987915705da59-hasRemoveButton {
    -webkit-padding-end: 8px;
    padding-inline-end: 8px;
  }
  .af3987915705da59-removeButton {
    position: absolute;
    color: #999;
    width: 12px;
    margin: 0 4px;
    opacity: 0;
    transition: color 50ms ease-in, opacity 100ms ease-in; 
    will-change: opacity;
    svg {
      mix-blend-mode: difference;
    }
    &:hover {
      opacity: 1;
    }
  }
  /* &:hover .af3987915705da59-removeButton {
    opacity: 1;
  } */
}

actually i think #999 is better than #fff8

and you can uncomment the last hover if you want the x to show if you hover over the role, or keep it commented/delete it if you only want it to show if you hover over the circle

[tranquil whale]

mods pls unban me from modmail and I want to post this CSS snippet

[vestal field]

what did u get banned for

[tranquil whale]

first css snippet was low quality the mod said so i redid it and rerequested and got banned for repeat requesting "same thing"

[echo frost]

what was the snippet?

[tranquil whale]

spotify controls

it was honestly not that good but like

why ban someone from modmail for it

[echo frost]

if it wasn't good whyd you submit it twice?

what did it look like/

[tranquil whale]

they were ttwo different versions

[echo frost]

two different versions of the same snippet?

[tranquil whale]

btw the bar was working before

[tranquil whale]

they were same purpose different look

TBH i just post my snippets in smaller servers now

[echo frost]

oh

[tranquil whale]

currently i just modify existing themes and make niche css snippets

i do contribute a bit to chillax

[sonic mesa]

Are there more servers with snippets?

[tranquil whale]

Yup

[sonic mesa]

How to find them?

[tranquil whale]

Theres BetterDiscord theres moonlight there wq support server and ungigilos github lab

[tranquil whale]

Just search for theme support servers or other client mods

[sonic mesa]

Okay thank you 🙏

[dense depot]

how can i remove avatar decorations without removing mine?

[echo frost]

i think this should work

[src^="https://cdn.discordapp.com/avatars/959759292389556254/"]+.c19a557985eb7793-avatarDecoration {
  display: block;
}

just add it

it'll prevent your avatar decoration from being hidden

but there might be a few places where it doesn't work

but it works in chat, mini profile, and big profile at least

[dense depot]

worked thanks

doesnt show on mini/big profile tho

i also wanna remove glow without removing gradient

i couldnt make it work

[echo frost]

oh i tested improperly

i don't think there's a good way to do mini/big profiles with your user id

[src^="https://cdn.discordapp.com/avatars/959759292389556254/"]+.c19a557985eb7793-avatarDecoration,
[aria-label^="dispj, "] [class*=avatarDecoration] {
  display: block;
}

it needs your username

[dense depot]

worked thank you

[dense depot]

do you know how to do this one?

[echo frost]

like this?

.e5de7811b2777bfa-convenienceGlowGradient:after {
  display: none;
}

[dense depot]

yes, but doesnt discord randomly change these names?

anyway very thank you

[chilly knoll]

why is the emoji not aligned properly 😭

[minor panther]

ig discord changed it for some reason lol

[chilly knoll]

i mean yeh but didnt they align it with the text and ❌ 💀

[minor panther]

idk tbh

i don't really keep up with all the changes discord makes

[echo frost]

they bottom aligned it for some reason

[steady nexus]

sorry for the bother , is there anything working to hide the gif , sicker and apps launcher from the text chat? tried some but wouldnt work even if i tried to mess with em for a bit

yeah so whoever actually hates and wants to remove text chat buttons i have the laziest code ever

div[role="button"][aria-label="Send a gift"] {
display: none !important;
}


div[role="button"][aria-label="Apps"] {
display: none !important;
}


div[role="button"][aria-label="Open sticker picker"] {
display: none !important;
}


div[role="button"][aria-label="Open GIF picker"] {
display: none !important;
}

[onyx mesa]

anyone elses discord feeling kinda slow

especially with typing, typing feels so laggy for me

[pure cairn]

Been like that for almost a week now

[pure cairn]

^

[onyx mesa]

ok phew

i do not have to purge my css

[pure cairn]

No, we need to kill discord employees

[steep drum]

i think you mean "have a talk with" haha

[pure cairn]

In minecraft

[steep drum]

yop

[languid mango]

Hey does anyone know what variable is responsible for the color of the name of active channels (the one you're currently on) ? I can't seem to find it.

[quasi fractal]

I've got this theme with a retracting channel/server bar and moving the mouse over the server name makes the sidebar retract back. Any way to make it included so it keeps the sidebar expanded?

[hazy frigate]

yo thanks, i'll test it out

[pure cairn]

[hazy frigate]

definitely an improvement, thank you

[pure cairn]

np

[pure cairn]

._740174f3d6a2c8fe-buttons {
  /* Send Gift */
  >:not(.expression-picker-chat-input-button),
  /* GIFs */
  >:nth-last-child(5), 
  /* Stickers */
  >:nth-last-child(3),
  /* App Launcher */
  >.app-launcher-entrypoint {
    display: none;
  }
}```

[steady nexus]

thanks a lot but funny enough that other lazy code works pretty fine 😭

[pure cairn]

it'll only work if the app language is set to English

[steady nexus]

fair enough , thanks again

[pure cairn]

[echo frost]

yours won't work if the order changes though
and I think there's an experiment that changes the order

[pure cairn]

Imho it's easier to change a number rather than a whole aria-label string

The compatibility is also wider

[echo frost]

but if it's for personal use, they're not going to change their language

and it'll be harder to notice if the order changes

[pure cairn]

But since they posted the code for other people to use

¯_(ツ)_/¯

[echo frost]

i think a warning is best

[pure cairn]

Not really, you'd be missing important stuff so you'd notice

Between 3 and 5 there's a hidden element, so if stuff changes order something will get lost

[echo frost]

i'm not sure the average/below average css user will notice

[pure cairn]

I mean

[echo frost]

think of the average one

50% are worse

[pure cairn]

"where did my button go"

That's what the average css user would say

[echo frost]

yeah

[pure cairn]

So they would notice

[echo frost]

but i'd rather them say "it not work" when they first add it

rather than coming 2 months after the update that changed the order

i wonder if it would be possible to have a dynamic language on an import hosted on github.io

like user.github.io/css/hide-buttons.css?lang=no

[pure cairn]

Uhh

I think you would be better off having an import link with container queries and custom variables for languages

[echo frost]

does that not impact performance?

[pure cairn]

I have no idea

But I don't even know if what you said is possible

[echo frost]

yeah

i don't think it could be .css

probably wouldn't be possible on a static webpage

[pure cairn]

Or, as an alternative
Only post a link to the repo page readme.md file with different flags that, once clicked, links you to the corresponding language variant

Like imagine a massive table with flags

[echo frost]

probably best would be no-hide-buttons.css or en-hide-buttons.css etc.

or something

it would definitely be best to just use the lang in html

you can even do:lang(en-GB) i thought you'd have to do html[lang=en-GB]

[echo frost]

a few times a year, and you can fix them all in 1 minute with the class updater in #theme-support

attribute selectors are easier to overselect, and laggier

[oak plover]

don't update if you're on canary they ruined the classes

[brazen quartz]

it's fucking over

why even do this i wonder

i hope they at least left their actual names alone in js

[pure cairn]

Wdym ruined?

Like, how bad is it?

[onyx mesa]

https://tenor.com/view/staringsoldiercatok-gif-2130370366885478984

[pure cairn]

https://tenor.com/view/shock-gif-15901363242606965490

Ngl this might be it

If they push it to stable

[brazen quartz]

awesome opportunity to make a class map if everything else breaks

[pure cairn]

And people called me crazy when I nested starting from body

😔

[brazen quartz]

it's still crazy

[pure cairn]

[brazen quartz]

shouldn't be allowed to post this

[pure cairn]

It was fun

And not even that laggy

[tired prawn]

@edgy sentinel when these new classes get pushed to stable, make alot of broken plugins a known issue

[pure cairn]

I don't think this is the right channel to discuss about that

[half crystal]

css oppenheimer

[clear siren]

so discord did what steam did I feared this might happen

[toxic oak]

we're doomed

[brazen quartz]

steam's normal classes can still be used if you really want to (for now, some store pages have the same problem as discord)

[latent sapphire]

any fix for background of custom themes not working? or just boned

[pure cairn]

users: please optimize your client
discord: sure thing
proceeds to ruin all the custom themes

[oak plover]

fucks up themes instead of fixing the memory leak

[pure cairn]

sounds like discord behaviour

[pure cairn]

hell nah

[chilly knoll]

who even is aria

well what more like

is it meant for accesibilylyy or sum

[echo frost]

oh i didn't realize what it stood for

[iron smelt]

Didn’t even know it stood for anything

[echo frost]

yeah same

[bleak mica]

How do i diagnose css performance regressions?

like i have a theme i wrote that in the last couple days has become incredibly laggy despite no changes of my own

all i can see is that every character typed is forcing a reflow that takes 94ms but not what rule is involved that's so terrible

nor why its suddenly now an issue and wasnt before

oh shit ok

i found an option in the profiler that gives selector stats

[echo frost]

i think it's mostly just a discord bug right now that applies to people not even using css

i have an update on stable
should I do it
have they done the canary class changes on stable already?

[vestal field]

is it joever

[brazen quartz]

It's over

[late lichen]

.f75fb00fb7356cbe-chatContent {
    anchor-scope: --chatbox;
    flex-direction: column-reverse;

    .f75fb00fb7356cbe-form {
        anchor-name: --chatbox;
    }

    ._36d072eab2b2e737-messagesWrapper {
        position: absolute;
        position-anchor: --chatbox;
        --chatbox-height: anchor-size(height);
        left: 0;
        right: 0;
        top: 0;
        bottom: var(--h);

        --h: anchor-size(height);

        ._36d072eab2b2e737-scroller {
            bottom: calc(var(--h) * -1);
        }

        ._36d072eab2b2e737-scrollerSpacer {
            height: calc(16px + var(--h));

            &._36d072eab2b2e737-emptyForum {
                height: calc(8px + var(--h));
            }
        }
    }

    &:has(> .f75fb00fb7356cbe-form > .b8880176888cc928-typing) ._36d072eab2b2e737-scrollerSpacer {
        height: calc(21px + var(--h));
    }
}
```am i doing this wrong?

cause --h doesnt spread

[echo frost]

it's probably anchor-size(height)?

it might not work in vars

[pure cairn]

I updated yesterday and it was still fine

[onyx mesa]

can't wait to open my discord today

nothing bad is going to happen

[pure cairn]

https://cdn.discordapp.com/emojis/900871572259229696.webp?size=48

[chilly knoll]

[pure cairn]

Same emote, 3 different servers

[tranquil whale]

[echo frost]

ok phew it's fine

this version is safe
stable 488272 (47627a4) Host 1.0.9221 x64 (74058) Build Override: N/A Windows 11 64-bit

[tranquil whale]

When will a good discord theme emerge like all themes are shit other than chillax and lande della discordia (sorry those of u with ur own public themes)

[brazen quartz]

when you make one

[tranquil whale]

Its not that easy xD im better at css snippets

Or modifying existing themes or contributing to a theme

[brazen quartz]

then all themes will stay shit

[tranquil whale]

Only one developer could make a non shit theme and that's ascellayn but he is lazy and lives in hell. https://github.com/Ascellayn

[chilly knoll]

you not liking a theme doesnt mean its shit lol

[pure cairn]

Themes are simply multiple css snippets that fit together, put together

And if you don't like a theme it doesn't mean it's shit

[gritty silo]

how to add a font to my discord i downloaded it from dafont.com

[pure cairn]

#🎨-css-snippets message

Since it's a local font you don't have to import it but simply use the :root section

[gritty silo]

wait where

[latent sapphire]

wait can you use backgrounds in themes now? are themes fixed? how do i fix

mine isn’t working

[cloud jolt]

👉 #🏥-vencord-support-🏥

(Auto-response invoked by @steep drum)

[sonic mesa]

I think update got pushed into stable

[late lichen]

did they really change class names to only hashes?

[brazen quartz]

you even reacted to the image that showed it, but for now they reverted it

[languid copper]

It doesn't work anymore?

Does anyone have ss as to how it looked?

[pure cairn]

no

on stable it's back to classname_hash instead of _longhash-classname

[limber mantle]

@tired prawn

we can chat here btw

free white names

@steep drum all ur fault btw

[steep drum]

oh mein gott

[limber mantle]

yall bringing back communism by locking us

[steep drum]

i think they'll forget to unpriv this channel after so i'm just MUTING!

[limber mantle]

mute urself

if i will need to ima even donate just to protest

to free white names

[quick obsidian]

@limber mantle dude stop being annoying

image sender has permissions here

vmute 2h 996137713432530976 annoying

[cloud jolt]

Done!

Muted x2b (@limber mantle) for 2 hours

[full rover]

unfortunately im a white name so i got filtered in when vencord's main chat got closed since so many people dont know how to read #1257025907625951423 (ive already known so)

xd

[clear siren]

theme development

[full rover]

Ye ik

[echo frost]

lmao they went back to this

[pure cairn]

yes, and tbh I'm not complaining

[half crystal]

enjoy this magic to redo everything from dav

[pure cairn]

bless

[echo frost]

magic

[crimson skiff]

every single theme except midnight is broken, what the fuck

[warm bramble]

Um

Mine was working fine

[crimson skiff]

thanks

so helpful

[warm bramble]

Yu np

You do know vencord is broken Right

[pure cairn]

https://tenor.com/view/wuthering-waves-shorekeeper-wuthering-waves-shorekeeper-what-really-wuthering-waves-what-gif-6743694871735344271

[crimson skiff]

thanks sherlock

wtf is server locked down because of the discord update?

[crimson skiff]

am i stupid, or is the thing im using broken

[crimson skiff]

okay had to use repgrep, scooter didnt work

(i will not use vscode)

[warm bramble]

Rage baiting at its finest

[crimson skiff]

your welcome

glad to help

[viral jasper]

so, everything seems in order in terms of plugins

all that's left is the css

[tranquil whale]

I finally stoped procrastinating im making my own discord theme

[minor panther]

this is showing up for some reason. it's weird bc i don't think i have anything in my css that would make it appear

i don't have the oneko plugin enabled either so ik it's not that

also does anyone have some css to change this back to a circle

(the attachment button)

[sterile rain]

as someone who doesnt know code very well this has gotta be some sort of magic spell

[viral jasper]

so, how do i do this?

[sterile rain]

i mean it says it right there

[viral jasper]

never used vscode before

[sterile rain]

open vscode or whatever other code editor, make new file, change language to css, paste your css, open find and replace, press the .*, and put in what the message tells you to put in

[viral jasper]

I'll give 'er a spin.

holy shit, that is magic

[sick sage]

idk im too dumb with this stuff

[iron smelt]

That’s not the right place😭

[sick sage]

figured😭 idk what im doing whatever

[viral jasper]

nvm got it

[manic patio]

Did anyone ever see this weird ah bug? (i dont have any themes)

[maiden tartan]

this is some magic what the hell

[wide rain]

hey guys does anyone know an up to date version of this guild bar theme?

its broken on ptb/canary

[maiden tartan]

it's broken atm, wait for the dev to fix it
just replace that file with this @ import instead cuz that'll automatically update

@import url("https://scattagain.github.io/VencordStuff/css/GuildbarRevert.css");

[clear fractal]

midnight runs slow as hell for me

it used to be buttery smooth

[crimson skiff]

i sense skill issue

[clear fractal]

i recall a bunch of other people complaining about themes running slow starting ~2 weeks ago, so its not just me

[warm kayak]

hey anyone have the css snippet for this? making the whole thing smaller so it doesnt overlap the servers

discord cooked it again

[hasty dagger]

i know nothing about code but my quick css does not work idk how to fix it "[class*=-expandedFolderIconWrapper] {
svg {
width: 25px;
height: 25px;
margin-bottom: 1px;
}
}
.c38106a3f0c3ca76-title {
display: none !important
}
time[id^="message-timestamp"] {
color: #dddddd !important;
font-size: 0.85em !important;
}
.c38106a3f0c3ca76-bar {
background-color: #151619 !important;
border-bottom: none !important;
}
._4bbc6dc06e75ad52-container {
background: linear-gradient(90deg,rgba(42, 123, 155, 0) 0%, rgba(237, 221, 83, 0) 100%) !important;
}
._4bbc6dc06e75ad52-videoContainer {
mask-image: none !important;
}
._4bbc6dc06e75ad52-img {
display: none;
}
.visual-refresh section._5e434347c823b592-panels {
left: calc(var(--custom-guild-list-width));
width: calc(100% - var(--custom-guild-list-width));
box-sizing: content-box;
bottom: 0;
border-radius: 0;
border-bottom: none;
border-right: none;

.e131a99484292a19-actionButtons button {
    padding: 0;
}
._5e434347c823b592-activityPanel {
    border-radius: inherit;
}

/* GameActivityToggle Fix (delete if you don't use) */
/* ._37e49614b9f110a9-container>._37e49614b9f110a9-buttons {
    gap: 2px;
}
._37e49614b9f110a9-container>._37e49614b9f110a9-avatarWrapper {
    min-width: 32px !important;
} */

}
nav._5e434347c823b592-guilds, #channels {
margin-bottom: 0 !important;
}
._5e434347c823b592-sidebar:after {
display: none;
}
/* BetterFolders fix (delete if you don't use) /
/ .vc-betterFolders-sidebar~section._5e434347c823b592-panels {
left: calc(var(--custom-guild-list-width)*2);
width: calc(100% - var(--custom-guild-list-width)*2) !important;
} */
._629e4c86564a4ee7-unread {
display: flex;
justify-content: center;

>._629e4c86564a4ee7-unreadBar {
    opacity: 1;
    background-color: var(--background-surface-highest);
    border: 1px solid var(--border-normal);
    box-shadow: var(--shadow-high);
    padding: 0px 8px;
    color: var(--interactive-normal);

}

}
/* Hide Activity Header */
.visual-refresh .c8ffbb79449f399c-membersGroup:has(._095fe51feb41b3bb-headerContainer) {
display: none;
}

/* Hide Members activities */
.visual-refresh ._0f2e83213c878a13-container {
display: none;
}"

[visual pilot]

discord changed class names, #theme-support

[late lichen]

you could try this

[pine needle]

idk

[hasty dagger]

that fixed it! thank you!!

[warm kayak]

anyone?

[urban moat]

updated CSS snippet for Revert user area now that the classes have changed:

.visual-refresh section.panels__5e434 {
  left: calc(var(--custom-guild-list-width) + var(--space-xs));
  width: calc(100% - var(--custom-guild-list-width) - var(--space-xs)*2);
  box-sizing: border-box;

  .actionButtons_e131a9 button {
    padding: 0;
  }

  /* GameActivityToggle Fix (delete if you don't use) */
  /* .container__37e49 {
    padding: var(--space-xxs);
    gap: var(--space-4);
    >.buttons__37e49 {
      gap: 0;
    }
    >.avatarWrapper__37e49 {
      min-width: 32px !important;
      >.avatar__37e49 {
        scale: 0.9;
      }
    }
  } */
}
nav.guilds__5e434 {
  margin-bottom: 0 !important;
}
.sidebar__5e434:after {
  display: none;
}

[warm kayak]

thank you SO much bro 😭

[wide rain]

ah I see i cant wait for it to get fixed on ptb/canary

[cosmic vault]

i cant wait to sit around and do nothing until class updater saves me (yes i know about the replace regex thing, it didn't quite fix everything)

its a miracle im still maintaining my own theme

[maiden tartan]

class updater our lord and saviour

[cosmic vault]

i would have already stopped even trying to maintain this theme ages ago if it werent for class updater

[maiden tartan]

it's broken on the normal client too, but hopefully it'll fix soon!

[maiden tartan]

i don't have a published theme but dude i can imagine

it's such a hassle

[cosmic vault]

the only time ive been forced to do things myself was when they did visual refresh

[maiden tartan]

yeahh that was so bad

[cosmic vault]

i come home, open discord, see something broken, go insane, repeat

[maiden tartan]

literally me today

[wide rain]

yes for sure it completes the appearance

[maiden tartan]

discord loaded and i just

[cosmic vault]

we're like 75% there

i cba

[maiden tartan]

ooh what do you use for the bigger server icons

and the profile section not covering the server list

[cosmic vault]

my own?

i used https://discord.com/channels/1015060230222131221/1354502862390038528

[urban moat]

im just waiting on guildbarrevert to get fixed cause it's not compatible with the class updater

[cosmic vault]

the revert user area thing i actually made myself

i think it looks nicer than the snippet because its floating

[maiden tartan]

my brain is so fried i didn't process that you have a theme LMAO

that's sick

[maiden tartan]

yess i did something similar

[urban moat]

oh also for anyone using the visual refresh compact title bar by chloecinders i made a fork and a PR that fixes those selectors:
https://github.com/chloecinders/visual-refresh-compact-title-bar/pull/22
https://github.com/heikadog/visual-refresh-compact-title-bar

[cosmic vault]

if you want to steal any snippets https://github.com/tryflle/tryfletheme

next specifically, the original is old and a nightmare to read

[maiden tartan]

HELL YEAH some of these are probably better written than mine

[cosmic vault]

dont be so sure

lmfao

[urban moat]

gonna change the readme for the time being ! gimme a sec

[cosmic vault]

same codebase from the very start of visual refresh its gotten a bit messy but everything is labeled

[maiden tartan]

my css is a hot mess rn im procrastinating making a proper theme out of it

labeling is huge

[cosmic vault]

yeah literally like

everything is labeled that i can

[maiden tartan]

omg

[cosmic vault]

i just made it a habit

[maiden tartan]

that's what im aspiring to do

[cosmic vault]

yeah i had to rewrite

and that was the first thing in mind

[crimson skiff]

mine is not that crazy wtf

[cosmic vault]

the whole idea was make my old theme and have a balance of what i like about visual refresh and old layout

i think the new layout is just too big

like this is a desktop not an ipad

but i also think a lot of stuff was genuinely nice

[maiden tartan]

okay i just checked this out this is sick

i fw that heavy

[maiden tartan]

there's a lot of good changes

but at the same time a lot of weird inconsistency

[cosmic vault]

and my old theme was make something catppuccin like and also tokyo night like and also unique

that was the idea

given the fact im still maintaining it and using it what is almost 2 years later

preetty happy with it

i just hate maintaining it

discord is mean

[maiden tartan]

it feels like they just change stuff sometimes just for the sake of changing it

[cosmic vault]

yeah
i still prefer the old layout on mobile

[maiden tartan]

same

i recently updated it to the new one

[cosmic vault]

Debug Info:

Enmity: db482b0
Tweak: 2.2.6 (Regular)
Discord: 223.0 (Build 57230)
Hermes: for RN 0.72.3
Bytecode: 94
Device: iPhone17,3
System: 18.3.2

[maiden tartan]

i had it on the old one for 2 years cuz i refused to update LOL

[cosmic vault]

i have both stock and that installed

(sh)i(t)phone

[maiden tartan]

ONG

[cosmic vault]

its worse because mine is defective as fuck

it kernel panics and shit

burn in

ass battery health for very low number of cycles

<200 cycles, 85% battery health

the battery is rated for 1000 cycles to 80% battery health

[maiden tartan]

oh wtf

im still on the 13

[cosmic vault]

mines a 16

[maiden tartan]

i'll be using this until it dies on me 🗣️

[cosmic vault]

its also my first (and last) iphone

[maiden tartan]

i wanna get off iphone so bad

my family glazes it tho

[cosmic vault]

i only got on iphone because my hands are tiny and all the other options i was being forced to pick between due to provider deals were big and bulky

[maiden tartan]

ahh checks out

[cosmic vault]

like i'd rather have something the size of the 13 mini

[maiden tartan]

also iphone's are pretty heavy compared to some other brands from what i know

[cosmic vault]

they are pretty much the lightest on the market unless u have a pro

nonetheless, i still cant wrap my hand around it entirely

[brazen quartz]

Some of these got removed like --text-tertiary, iirc

[maiden tartan]

maybe im mistaken then oops

[cosmic vault]

my certificate was also revoked in JULY and ive been trying to get it back for like forever

[cosmic vault]

aware, its just a bit painful to keep track of what is removed and what isnt when they keep making major changes

[tranquil whale]

how do you guys take so long to update themes

[cosmic vault]

no will

[tranquil whale]

all my themes are back up

[cosmic vault]

no will when its major

[tranquil whale]

I just spent 30 mins making a class updater

[cosmic vault]

you should pass me that

[brazen quartz]

I have a list of what got removed if you want, maybe not full

[cosmic vault]

sounds good

i think the majority of whats messed up is variables

[tranquil whale]

dmed

[brazen quartz]

https://github.com/ricewind012/discord-gnome-theme/commit/d98d3cfa43596724e8cc0b2800c6f3ae3b8019f0

[cosmic vault]

ty

[cosmic vault]

ty

[cosmic vault]

dont think it did anything for me at all unfortunately

i believe all my issues have to do with new variables

i just really cba rn

[tranquil whale]

oh wait new version broke it

ill revert

[cosmic vault]

oops

[tranquil whale]

should work in like 2 mins

[cosmic vault]

still not doing anything for me unfortunately

[tranquil whale]

im rebboting server now

[cosmic vault]

o

[tranquil whale]

should work

if it still dosent the i went back one version too far

[cosmic vault]

that borked everything :/

it made the spotify modal wide though

idk how

[tranquil whale]

Im updating again

[atomic plank]

has https://syndishanx.github.io/Website/Update_Classes.html been updated with the new names and such?

or do I need to manually fix some CSS again

[tranquil whale]

not yet if im right

[atomic plank]

alrighty I'll wait then

[cosmic vault]

based on the commit dates, no

[atomic plank]

Oh I'm stupid I could've checked those

[cosmic vault]

yk what someone should make a github bot that automatically runs class updater when it gets a commit

i should do that

[tranquil whale]

already exists

but its a private bot

[cosmic vault]

🥺

[cosmic vault]

damn

time to make one myself

[tranquil whale]

its for chillax they updated like 2 hours ago

they also got discord bot to update css snippets

my tool should work now

[cosmic vault]

just tried it, no different than before

goes from this

to this

genuinely no clue what is going on here lmfao

i can just wait tbh

[cosmic vault]

hmmm i wonder if i have enough ties to people to get access (real and true)

i doubt it lmfao

[tranquil whale]

chillax was patched in 2 hours xD

[cosmic vault]

i could prob fix it myself in 2 hours

i just

[tranquil whale]

finally equicord web is ready for update

[cosmic vault]

dont want to

[tranquil whale]

they used a python script

[cosmic vault]

because to me it just looks like a bunch of variables being renamed

[tranquil whale]

which could be turned into a github bot

[cosmic vault]

if its this annoying being a theme maintainer

can you imagine maintaining vencord itself

[tranquil whale]

I mod themes

its easy enough to maintain

[cosmic vault]

its just annoying

[tranquil whale]

as the main theme is updated pretty quickly

[visual pilot]

the difference is that multiple people maintain vencord

[cosmic vault]

this is true

[visual pilot]

most themes are developed by a single person

[visual pilot]

which is how it was just fixed in just above a day after discord broke everything

[cosmic vault]

i almost wish i knew ts/js enough to fuck with discord but then i remember its ts/js and i want nothing to do with ts or js

[tranquil whale]

chillax is maintained by 3 people

I help a bit

[brazen quartz]

there is this which has easy enough usage i guess https://github.com/fedeericodl/discord-update-classnames

[cosmic vault]

why not use the one everyone else uses

[brazen quartz]

automation

[cosmic vault]

ohhh

ic

[brazen quartz]

and you did talk about a github bot or w/e

[cosmic vault]

didnt realize thats what it was til i read the readme

[echo frost]

there's some regex
#🎨-theme-development message

[cosmic vault]

ill worry about this all tmrw

it lreally just looks like a couple variables is all im missing though

which is an easy fix

[atomic plank]

Thank you obsidian

[pine needle]

/* Server Tooltip */ [class*=tooltip] { max-width: unset !important; }
im curious what is this btw? like is it work? XD

[frank yacht]

Anyone know what --blob-scale got changed to?

Trying to fix this

[tranquil whale]

This is what everyone that can make their own script uses even I use it

[urban moat]

that's a variable the theme uses, not one native to discord. i'd just wait until the theme gets patched

[echo frost]

what's the point of making your own script when it already exists?

[urban moat]

the suffixes used in the theme are the issue i believe. the class names got reverted to an earlier version so the automated class updater won't catch suffixes with wildcards like that (e.g. whatever781236478632-guilds)

[echo frost]

you can try and see if this regex fixes it
#🎨-theme-development message

[urban moat]

i tried this myself, only works if the class names are hardcoded but doesn't work if it's a wildcard like this one has

[echo frost]

yeah because it's only meant to

using class names is better than attribute selectors imo

[urban moat]

🤷 not my theme, just https://github.com/scattagain/VencordStuff/blob/main/css/GuildbarRevert.css

it's better for futureproofing. if the prefix or suffix in the attribute selector changes you just have to change those parts of the file and be done with it, but if they don't change and only the numbers change the theme still works. just doesn't make it compatible with the class updater tool

[frank yacht]

I...do not know how to use that...I am able to frankenstein code, not write it unfortunately

[urban moat]

like i said it only works if the classes are hardcoded ! that workaround doesn't work with this theme, just wait for an update :p

[echo frost]

yes i know why people do it
i used to do it
but it's worse for performance, can overselect, and you can't use the class updater on it

but if you want to fix attribute selectors just change [class*=-className] to [class*=className_], and it should fix it

[urban moat]

applied just now
in vscode, use find and replace and turn on the .* button:
find: \[class\*="-([^"]+)"\]
replace: [class*="$1_"]

not perfect cause the server icons get cut off by the add and discover buttons if a folder is expanded and has enough icons

[hasty dagger]

somewhere in this code becs i also have it on idk where tho #🎨-theme-development message

[onyx mesa]

the second tower has been hit i see and the class updater is not updated yet

[prisma stirrup]

can someone help me update my theme, because it got f'ed

[echo frost]

try this, otherwise wait a bit
discord pushed an update that broke css
#🎨-theme-development message

[pure cairn]

Regex comes in handy
#🎨-theme-development message

[pure cairn]

oh, you linked it too
Didn't see that lmao

[onyx mesa]

ok the work in the mines has finished

[mighty mural]

Oh no. Used the regex but nothing really changed? Still broken as hell

hollow~1

Oh wait. Had to fresh. Just the server icons are still broken.

[hoary stone]

So I know things are a bit broken atm, but does anyone know how to remove the half transparent gradient that slow mode puts above the chat bar?

[brazen quartz]

.chatGradientBase__36d07 { display: none; } ?

[mighty mural]

They basically "half-assed" reverted the 17th december changes. Kinda.

I just had to revert the guild icon classes to what they were before lol.

[static ruin]

dose anyone have the theme for this thing bc I forgot where I put it at

And it’s annoying af to look at

[plain kelp]

I would assume it's in your themes list or quickcss

[mystic lichen]

at least reverting the format is relatively simple, just a regex

\.([_a-z0-9]{6})[a-z0-9]+-([a-zA-Z0-9]+) replace all .$2_$1
basically take the section after the hyphen, put underscore, then the first 6 chars of the class

[supple sparrow]

since latest discord update my icons are messy https://i.imgur.com/8jFm8kI.png
I used to use this code which was beautiful for the icons the quickcss started like that :
`:root {
--guildbar-avatar-size: 48px;
--blob-scale: 48;

--guildbar-folder-size: var(--guildbar-avatar-size);
--folder-blob-scale: var(--blob-scale);

--custom-guild-list-padding: 12px;
--custom-guild-list-width: calc(
    max(var(--guildbar-avatar-size), var(--guildbar-folder-size))
    + var(--custom-guild-list-padding) * 2
);

}`

Anyone have an updated version for this quickcss?

it was from scattagain " @import url("https://scattagain.github.io/VencordStuff/css/GuildbarRevert.css"); "
idk if he/she updated it i just copied the code directly

[burnt lake]

Can anyone help me fix the title bar?
Because the update broke it.

/* ---- copy ---- */
@keyframes wallpaperRotatev2 { 0%, 25% { background-image: url('https://i.imgur.com/gEXoBXN.png'); } 25.01%, 50% { background-image: url('https://i.imgur.com/xhZAYR8.jpeg'); } 50.01%, 75% { background-image: url('https://i.imgur.com/hnbz4FC.png'); } 75.01%, 100% { background-image: url('https://i.imgur.com/Z5XUd2O.jpeg'); } }

/* ---- NEW: anim for title bar ---- */
.c38106a3f0c3ca76-title {
    background-image: url('https://i.imgur.com/gEXoBXN.png') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    animation: wallpaperRotatev2 23s infinite !important;

    
    backdrop-filter: blur(4px) brightness(0.85);
}

[echo frost]

/* ---- copy ---- */
@keyframes wallpaperRotatev2 { 0%, 25% { background-image: url('https://i.imgur.com/gEXoBXN.png'); } 25.01%, 50% { background-image: url('https://i.imgur.com/xhZAYR8.jpeg'); } 50.01%, 75% { background-image: url('https://i.imgur.com/hnbz4FC.png'); } 75.01%, 100% { background-image: url('https://i.imgur.com/Z5XUd2O.jpeg'); } }

/* ---- NEW: anim for title bar ---- */
.title_c38106 {
    background-image: url('https://i.imgur.com/gEXoBXN.png') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    animation: wallpaperRotatev2 23s infinite !important;

    
    backdrop-filter: blur(4px) brightness(0.85);
}

[burnt lake]

I still have issues with this part.

/* ---- copy ---- */
@keyframes wallpaperRotatev2 { 0%, 25% { background-image: url('https://i.imgur.com/gEXoBXN.png'); } 25.01%, 50% { background-image: url('https://i.imgur.com/xhZAYR8.jpeg'); } 50.01%, 75% { background-image: url('https://i.imgur.com/hnbz4FC.png'); } 75.01%, 100% { background-image: url('https://i.imgur.com/Z5XUd2O.jpeg'); } }

/* ---- NEW: anim for title bar ---- */
.title_c38106 {
    background-image: url('https://i.imgur.com/gEXoBXN.png') !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    animation: wallpaperRotatev2 23s infinite !important;

    
    backdrop-filter: blur(4px) brightness(0.85);
}

.c38106a3f0c3ca76-title svg path,
.c38106a3f0c3ca76-title svg {
    color: white !important;
    fill: white !important;
}



.c38106a3f0c3ca76-title::before {
    content: "";
    position: absolute;
    inset: 0;

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    animation: wallpaperRotatev2 23s infinite linear;

    z-index: 0;
}


.bar_c38106 { position: relative !important; height: 32.5px !important; min-height: 0 !important; max-height: 40px !important; z-index: 2147483646 !important; isolation: isolate !important; }


.bar_c38106::before {
  content: "";
  position: absolute;
  inset: 0;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  animation: wallpaperRotatev2 23s infinite linear;
  z-index: 0 !important;
}

[echo frost]

well i only fixed the part that you sent
how was i supposed to fix that too

use this regex #🎨-theme-development message

[burnt lake]

Because the update restored the old classes?

because I need to understand what the update changed in order to try to fix it

[echo frost]

that regex find and replace will fix it

but the classes went from .c38106a3f0c3ca76-title -> .title_c38106

so take the first 6 characters of the hash, and then put it after the class name and an underscore

[echo frost]

(and this happened with all the classes. i just used that for an example)

[burnt lake]

okey thx

[burnt lake]

Simplicity is the best thing, I think, but I don't know if that's true. We'll see. For now, nothing is breaking.

.page__5e434 {
    padding-top: 25px; 
}

[hexed imp]

I have tried the regex trick on this https://scattagain.github.io/VencordStuff/css/GuildbarRevert.css but I think it's broken beyond the new class names.
(this changes the size & roundness of the server icons and the server folder icons back to pre-refresh looking style)

That is way beyond my meager css to figure out which line(s) is/are wrong, and meanwhile my icons look offset like this lol

[pure cairn]

It's using attribute selectors

The first regex won't work on them

Try with this one, which I haven't tested
#🎨-theme-development message

[hexed imp]

Badass. That did work.

[pure cairn]

[misty trench]

If you remove the - in the class*="- part at the beginning of the class selectors inside guildbarrevert.css, the interface appearance you are looking for will come back, but I don’t know if it will cause another problem. This is how I fixed mine.

In a place like Visual Studio Code or Notepad, just search for class*="- and replace all with class*=", that will be enough.

[hexed imp]

The other regex trick linked a couple lines up cleaned it all up! 🙂

[misty trench]

I didn't see it while writing, I just wrote it directly in case anyone was having trouble, sorry for pinging you 😅

[hexed imp]

No problem 🙂

[hexed imp]

https://discord.com/channels/1015060230222131221/1362906396475265286
This snippet seems to have been abandoned. I did the class updater, which gives us the previous classnames, then did the two regex tricks on it, and finally cleaned up the remaining missed switchyroonies. It still doesn't work though. And tbh it's been so long since I opened a form I have no idea when it actually broke, but comments in the thread are from months ago lmao

This is my resulting CSS that still doesn't work. Anyone got any ideas? 🙏

    width: var(--modal-width-medium);

    .header__49fc1 {
        padding: var(--modal-vertical-padding) var(--modal-horizontal-padding);
        margin-bottom: var(--modal-vertical-padding);
        border-bottom: var(--border-normal) solid 1px;

        .colorHeaderPrimary_c9946a {
            text-align: center;
            font-weight: var(--font-weight-semibold);
            flex-grow: 1;
        }

        .closeButton_e858dd {
            top: unset;
            right: var(--modal-horizontal-padding);
            margin-bottom: auto;
            margin-top: auto;

            .contents__201d5 {
                height: 24px;
            }
        }
    }

    .submissionWarning_e858dd {
        display: none;
    }

    .formItem__1b11b .eyebrow_b717a1 {
        margin-bottom: 4px;

        .errorMessage_b717a1 {
            color: var(--text-danger);
        }
    }

    .input__0ed4f.error__0ed4f:focus {
        color: var(--text-normal);
        transition-property: border-color, color;
    }

    .footer__49fc1 {
        justify-content: space-between;
    }
}```

[dense creek]

Because of new update I needed to remake the whole theme. Any ideas to make it look better?

[echo frost]

you should be able to fix it with this if you don't want to remake it #🎨-theme-development message

[tranquil whale]

This is lande della discordia right

[dense creek]

Thanks, but I broke up with VS.

[echo frost]

you don't need to use vscode

it's just a regex find and replace

any code editor will have that

[dense creek]

Yep

[tranquil whale]

Its been fixed officially already

Check GitHub

[dense creek]

I'm talking about the fact that my theme was previously based on a theme from 2021, I rewrote it based on this one

Because it's really easier to use a theme that will update itself, and I'll only adjust some changes.

[minor panther]

/* revert chat input position */
.f75fb00fb7356cbe-channelTextArea {
margin-bottom: 25px;
}

/* revert chat input height */
.align-chat-input {
--custom-channel-textarea-text-area-height: 52px;
}
.align-chat-input ._0923f156a0410684-attachWrapper {
padding-top: 10px;
padding-bottom: 10px;
}

/* revert typing bubbles position */
.align-chat-input .b8880176888cc928-inTextChannel.b8880176888cc928-base {
bottom: 0px;
top: auto;
}
.align-chat-input .b8880176888cc928-inTextChannel .b8880176888cc928-typingDots {
margin-left: 5px;
}
.align-chat-input .b8880176888cc928-inTextChannel .b8880176888cc928-text {
margin-left: 0cqw
}

/* move chat back down to usual position */
._36d072eab2b2e737-scrollerSpacer {
height: 28px !important;
}

/* revert color of typing username */
.align-chat-input .b8880176888cc928-inTextChannel .b8880176888cc928-text>strong {
color: var(--text-secondary);
}

/* change attachment button svg back */
._0923f156a0410684-attachButton path {
d: path("M12 23a11 11 0 1 0 0-22 11 11 0 0 0 0 22Zm0-17a1 1 0 0 1 1 1v4h4a1 1 0 1 1 0 2h-4v4a1 1 0 1 1-2 0v-4H7a1 1 0 1 1 0-2h4V7a1 1 0 0 1 1-1Z");
}

/* attempt to fix typing issue /
.b8880176888cc928-inTextChannel.b8880176888cc928-base {
/ positioning */
position: absolute !important;
bottom: -5px !important;
top: auto;
left: 8px;
right: 8px;
z-index: 9999 !important;

/* box model */
margin: 0;
padding: 6px 8px;

/* behavior/visual tweaks */
pointer-events: auto;
transform: none;
transition: none;
}

/* fix announcement channel bars margins */
._44df51b030bd5ece-wrapper {
margin-bottom: 10px;
}

/* fix typing indicator being too close to names */
.b8880176888cc928-inTextChannel .b8880176888cc928-text {
margin-left: 10px;
}

/* remove weird gradient thing */
._36d072eab2b2e737-typingGradientNotAtBottom {
mask: none !important;
}

can someone update this? the class updater site didn't do that and idk anything about updating css lol

[late lichen]

/* revert chat input position */
.channelTextArea_f75fb0 {
    margin-bottom: 25px;
}

/* revert chat input height */
.align-chat-input {
    --custom-channel-textarea-text-area-height: 52px;
}
.align-chat-input .attachWrapper__0923f {
    padding-top: 10px;
    padding-bottom: 10px;
}

/* revert typing bubbles position */
.align-chat-input .inTextChannel_b88801.base_b88801 {
    bottom: 0px;
    top: auto;
}
.align-chat-input .inTextChannel_b88801 .typingDots_b88801 {
    margin-left: 5px;
}
.align-chat-input .inTextChannel_b88801 .text_b88801 {
    margin-left: 0cqw
}

/* move chat back down to usual position */
.scrollerSpacer__36d07 {
    height: 28px !important;
}

/* revert color of typing username */
.align-chat-input .inTextChannel_b88801 .text_b88801>strong {
    color: var(--text-secondary);
}

/* change attachment button svg back */
.attachButton__0923f path {
    d: path("M12 23a11 11 0 1 0 0-22 11 11 0 0 0 0 22Zm0-17a1 1 0 0 1 1 1v4h4a1 1 0 1 1 0 2h-4v4a1 1 0 1 1-2 0v-4H7a1 1 0 1 1 0-2h4V7a1 1 0 0 1 1-1Z");
}

/* attempt to fix typing issue */
.inTextChannel_b88801.base_b88801 {
  /* positioning */
  position: absolute !important;
  bottom: -5px !important;
  top: auto;
  left: 8px;
  right: 8px;
  z-index: 9999 !important;

  /* box model */
  margin: 0;
  padding: 6px 8px;

  /* behavior/visual tweaks */
  pointer-events: auto;
  transform: none;
  transition: none;
}

/* fix announcement channel bars margins */
.wrapper__44df5 {
  margin-bottom: 10px;
}

/* fix typing indicator being too close to names */
.inTextChannel_b88801 .text_b88801 {
  margin-left: 10px;
}

/* remove weird gradient thing */
.typingGradientNotAtBottom__36d07 {
  mask: none !important;
}
``` you couldve just scrolled up...

[full pebble]

what was that tool named to replace old class names with new ones

[prisma lynx]

is the class updater updated yet? got some broken stuff in my qcss

[minor panther]

mb 😭

[prisma lynx]

syndishanx class updater

it needs a seperate update though

i think last time classes got screwed up it took a day or two

[full pebble]

also replacing stuff doesnt work for me in vsc

like the window doesnt pop up

[minor panther]

this broke

[full pebble]

i need to start using ^= *= instead class names ffs...

[full pebble]

i just do tree

[minor panther]

what (sorry idk anything about this lol)

[full pebble]

also yeah aria labels are better iirc

[dense creek]

5 months ago last commit

[prisma lynx]

sheeeiiit

how tf did i update classes last time

cuz that was <5 months ago

[rustic leaf]

is there css snippets to make the call background translucent

[steep drum]

this is 100% very obscure but does anyone have a snippet to make the height longer?

[onyx mesa]

it got updated pretty fast last time they completely fucked class names

[steep drum]

nvm i got it

didn't wanna play nice without !important lmao

.popout_a16aea {
  max-height: 400px !important;
}```

[wanton stirrup]

round server/guild icons?

[warm bramble]

im interested why the theme im using didnt broke at all

[wanton stirrup]

break at all*

[warm bramble]

fair

[half crystal]

which theme?

[warm bramble]

T1 is the name idk if it helps

[prisma lynx]

probably doesn't use direct classes. idk the proper css term

selectors? uses selectors?

[warm bramble]

https://github.com/Eight-P/BD.8P

[warm bramble]

this is the theme i use

[pure cairn]

Can't be seen on mobile cuz they put everything on a single line (insane behaviour)

I'll check later on pc

[warm bramble]

lmao alright

[pure cairn]

But they probably used [class*="classname"] selectors

Which don't require updating if they did not include the starting dash and hash

[warm bramble]

i gotta get better understanding code

[pure cairn]

This means "find any class which contains, in any place, the string classname"

If you use ^= instead, it means "find any class which starts with the string classname"

And if you use $=, then it means "find any class which ends with the string classname"

[warm bramble]

Wait if i understand correctly discord changed sum stuff with - and _ which broke vencord?

[pure cairn]

Not just that

They radically changed how classes were called

[warm bramble]

oh

[pure cairn]

From _longhash-classname to classname_shorthash

[warm bramble]

what were they thinking

[prisma lynx]

probably just making it look less cluttered

[pure cairn]

And this is just from a css standpoint

I don't know what happened on the js side of things

[pure cairn]

Yeah they basically reverted to the old format they had before

[iron smelt]

Funny thing is one of my broken snippets started working again when they did that

[warm bramble]

wait did they have to manually revert to old format?

[pure cairn]

Lmfao that's funny

[warm bramble]

like change the code manually

prob a stupid question ngl

[pure cairn]

Nah, they probably just used regex to swap them around like we did for updating our snippets

[clear siren]

pretty much all my css started working again

:D

[pure cairn]

If it's broken don't fix it, I'll work again

[warm bramble]

oh

[wanton stirrup]

so does that mean the old snippet for round server icons works or no?

[pure cairn]

https://cdn.discordapp.com/emojis/900871572259229696.webp?size=48

[warm bramble]

dont make promises

my theme rn is using round icons

[wanton stirrup]

I need just round icons not a diff theme

[humble jay]

how do u pause the debugger again

i thought it was f8

[pure cairn]

nope, doesn't look like it

they're using plain classnames

[warm bramble]

ight