🎨-theme-development

[winged arrow]

i think manually setting the width should work

[hollow spire]

anyone knows how to remove this?

[onyx mesa]

[aria-label="DevTools"] { display: none }

you might be able to turn it off in settings but i did not bother to look

[hollow spire]

thanks, i know next to nothing about css besides the obvious things

[hollow spire]

looked but didnt find anything

[tight nimbus]

.inner__74017 is the whole box , .textArea__74017 is specifically the edit area

oops @winged arrow sorry forgot to make that a reply

[winged arrow]

yay thank u!!

  width: 100px;
}

would work ?

interesting

so its um

not that !

[winged arrow]

both of those change the send message bit, i need the edit message box

[tight nimbus]

what do you mean?

oh I understand sorry

.editor__1b31f

btw if you ever want to find what a specific element is, press Ctrl+Shift+I you can open up dev tools, press the "Select element" button in the top left (pictured), and then click on the element you want to select

[winged arrow]

ive been trying to use that, but its too confusing 4 me

and idk why but all the elements youve said also affect the chat box

[pure cairn]

.operations_bab751

if you mean this part

otherwise just say what you would like to do

[smoky belfry]

Display none it

[winged arrow]

this entire box needs to be smaller

[pure cairn]

gotcha

[winged arrow]

but idk if its the same thing as the send message box

i have a collapsable sidebar theme and bubble messages, it only happens when both are active

ive tried inspect element but idk what part is the box, text, alignment or actual entire box

[pure cairn]

.messageListItem__5126c>.message__5126c>.contents_c19a55>div:not([class]) {
  width: whatever;
}```

[winged arrow]

yay that works!

thank u!

[pure cairn]

they have the same class, so you have to be more specific with the selector

[winged arrow]

ahh thought so

[pure cairn]

what I did was adding some parent elements to avoid selecting the message box

[winged arrow]

didnt know what part was what, im p new to css

[pure cairn]

you can find the basics on a couple websites if you're interested

https://htmlcheatsheet.com/css/
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference
https://www.w3schools.com/css/default.asp

[winged arrow]

i had a bit of a look to get one of the themes working, im not 100% sure on discord specific stuff

[pure cairn]

the only specific part about discord are the classnames tbf

[winged arrow]

ya that #lol

[pure cairn]

added w3schools as well

[pure cairn]

and maybe a few properties that have not been released on the electron version Discord uses

but that's rare

[winged arrow]

i think all the stuff ive used has been normal css

its just the class names are so annoying

[pure cairn]

we could've had worse

[winged arrow]

ok ive had a bit of a play w it

its still uncentered

[pure cairn]

do you want it to be aligned to the right?

[winged arrow]

should be able to add left: xpx ?

[pure cairn]

don't do that

[winged arrow]

ya, after i get the width right

[winged arrow]

oh is it not ?

[pure cairn]

it's a quick solution

not the best one

[winged arrow]

what would you recommend ?

[pure cairn]

try if position: relative; right: 0; works

[winged arrow]

no change :(

[pure cairn]

have you been aligning everything with left/right px values?

[winged arrow]

tbh yeah

[pure cairn]

let me try something very stupid

[winged arrow]

i think just moving the scrollbar/text box

if i add anything it stops being aligned

is there a way to find its default values and copy + edit that ?

[pure cairn]

nah this is just stupid

[pure cairn]

disable the theme and check the values

[winged arrow]

how do I check them ?

sry for late reply I'm in the middle of cleaning my room out #lol

[pure cairn]

Open devtools and use the element picker tool

[pure cairn]

^

[winged arrow]

i cant get the right element

can i search for a specific bit in the console ?

class="hiddenAppLauncherAnchor__74017"

would it be this ?

[pure cairn]

I don't know what you're looking for, so

¯_(ツ)_/¯

[winged arrow]

ok, ive got it so i can see the entire message now

[winged arrow]

neither do i tbh!!!

thanks for ur help tho!!!!

[pure cairn]

That's a mood

[pure cairn]

Np

[tight nimbus]

inspect element > styles > computed > find the line that does that > press the little circled arrow that takes you to the source line > report back

[unique stone]

ok give me one sec

[tight nimbus]

this message made my day btw

[unique stone]

Haha why?

[tight nimbus]

somebody asking for help who is willing and able to follow somewhat complicated instructions to get more data? rarity and wonderful

[unique stone]

It seems to be related to my radical status I’m struggling to find the exact source line

[tight nimbus]

your radical status?

[unique stone]

Yeah I do always try and follow peoples help especially those that know way more about this stuff

[unique stone]

Yeah I have implemented radical glow and radical status into my theme

[tight nimbus]

does the offset circle occur anywhere else?

[unique stone]

Nah it’s just whenever someone is typing in a server or anywhere like dms etc

[tight nimbus]

if you'd like we can vc and I can help walk you through this

[unique stone]

I may have fixed it give me one second

[unique stone]

Yeah nope I have not fixed it a vc would be greatly appreciated

[tight nimbus]

https://discord.gg/4VKrtwNV

[pure cairn]

I think you mean radial status

[unique stone]

Yep that’s is 😂

[pure cairn]

Sadly I don't have my pc at hand but I would guess it's due to the typing dots being displaced

[leaden hinge]

Are they not also radical though?

[tight nimbus]

no

Radical - definition of radical by The Free Dictionary (archive)

[chilly knoll]

does anyone know how i can make stroke follow whatever colour discord uses for the icon
⁨⁨```css
path[d="M5.42 22a.9.9 0 0 1-.91-.9V2.9c0-.5.4-.9.9-.9h7.94c1.62 0 2.93.46 3.91 1.4 1 .92 1.5 2.15 1.5 3.67 0 1.2-.28 2.17-.86 2.9a4.8 4.8 0 0 1-2.23 1.57c1.18.25 2.1.78 2.78 1.59.7.8 1.04 1.9 1.04 3.33 0 1.86-.56 3.25-1.68 4.18-1.12.9-2.7 1.36-4.75 1.36H5.42Zm6.42-12c1.84 0 2.75-.73 2.75-2.2 0-1.47-.91-2.2-2.75-2.2h-3.1V10h3.1Zm.2 8.4c2.15 0 3.22-.8 3.22-2.4 0-1.6-1.07-2.4-3.22-2.4h-3.3v4.8h3.3Z"] {
d: path("M7.609 1A3.61 3.61 0 0 0 4 4.609V19.94A3.06 3.06 0 0 0 7.059 23H14a6 6 0 0 0 2.102-11.621A6 6 0 0 0 12 1zM12 11a4 4 0 0 0 0-8H7.609C6.72 3 6 3.72 6 4.609V11zm-6 2v6.941C6 20.526 6.474 21 7.059 21H14a4 4 0 0 0 0-8z");
fill-rule: evenodd;
stroke: ;
stroke-width: 3px;
}

[frigid zinc]

i'm pretty sure you can use currentColor

[chilly knoll]

thanks

i think that worked
https://atums.world/u/bY9lo3tgpr.png

[real quarry]

my timestamp css died, any ideas on how to fix? this is the only timestamp-related thing out of all the custom themes under my repos (i'm not the original author, i just dont want to put this into quickcss if it's gonna be on most of the time)

time[datetime]:hover::after {
  content: "("attr(datetime)")";
  width: max-content;
  position: absolute;
  z-index: 9999;
  backdrop-filter: blur(4px);
  padding: 0 4px;
  border-radius: 6px;
}```

ideally i'd like the full datetime to be displayed in the area next to the role icon

but i understand if that's not possible

[tight nimbus]

any suggestions on making this shorter while keeping all the info?

like it's too the point where the emojis get in the way

[wintry cape]

It works on hover of the time

[wintry cape]

I don't know if the snippet for the guildTag is here, but i saw a snippet where only the guildTag icon was visible and on hover it would show the name

The other things are pretty much plugins besides the new badge

And the time

I found this snippet for the [Clan Tags](#1370395931484360756 message)

Before & After

[tight nimbus]

thanks!

[real quarry]

fair enough I'll just assume one of my other themes is causing this timestamp overlap then

[echo frost]

yeah this is what that css does: #🎨-css-snippets message

that's probably a problem with reply timestamps or some css affecting reply timestamps weirdly

ok it's just a problem with replytimestamp

it's fixed if you update vencord

[real quarry]

if that's the name of a plugin i dont remember enabling it or installing it but i use vencord within legcord so i guess I'll just wait a few for legcord to get the update

[echo frost]

https://vencord.dev/plugins/ReplyTimestamp

you could make a temp fix with css

[civic steppe]

hey could i get a fix for this?

[pure cairn]

Have all the stuff besides timestamp slide in from the left when hovering the user name

[minor panther]

is there a fix for this

[pure cairn]

Scroll up the chat

[echo frost]

.vc-reply-timestamp {
  width: unset !important;
}

[echo frost]

try this ery ^

[minor panther]

ty

[minor panther]

mb

[echo frost]

I have this to make the buttons collapsible https://discord.com/channels/1015060230222131221/1304647342284214282

.buttonsInner__5126c:not(:hover)>:is(
  .separator_f84418~:not(:nth-last-child(2)),
  :nth-child(-n+6):not(:nth-last-child(2)),
  .separator_f84418
) {
  display: none;
}

it might need a bit of editing since you have 5 emojis

you'd change the 6 to a 10 for 5

[civic steppe]

i still need help with this >~< the inbox button is over the search bar

[tranquil whale]

wow shitty discord bot

i tried to make a discord bot that could edit theme files varibles but

[tight nimbus]

yeah i have five though specifically to save the extra click :/

thanks though!

[left thicket]

day 3 of waiting for my css snippet to get accepted

so i can upload more

[errant zenith]

what snippet

[echo frost]

well it shows on hover or pressing shift so it's not a click

[left thicket]

i had made a better image viewer with bigger arrows, fixed the bg scrim thing being too dark that some theming broke, made the X button bigger, and added a nice rounded box around the author.

will probably add some sort of background to transparent images to make images with black text more readable

heres what i submitted:

Image Viewer Tweaks

Import Url:

@import url('https://raw.githubusercontent.com/Benzeel/Bennys-Css-Snippets/refs/heads/main/ImageViewerTweaks.css');

Before
After

kabewm

i have other snippets im waiting to upload when i hopefully get the snippet dev role bleh

just didnt wanna submit my huge .. probably theme at this point
or @green vine's per user dm/ server background snippet that i am maintaining for them since they have stopped doing css stuff for the most part

[echo frost]

before: status
after: ad
amazing

when you actually post it, it would probably be better to use the same image to not confuse people

[green vine]

I am computer cat and I approve of this message

[tranquil whale]

good luck

[tranquil whale]

we neeeeeeeeeed more cats 🐈

[left thicket]

yeah i wanted to do that LOL
just was sleepy when i made the initial post

[echo frost]

I wouldn't worry about day 3. it took them like a month or something to accept mine (but they did request some changes which would've made it take longer)
If they haven't replied yet after 3 days, I think that's pretty normal though

[left thicket]

cat said they got theirs after like weeks of annoying them LOL

(not verbatim)

[plush river]

I decided I actually need more pink, not less, so I made an alternate Vesktop icon based on the cute oneko logo.

[echo frost]

very good talk about css https://youtu.be/nhbYveaV0pk

[hasty dagger]

how do i hide this in the emoji draw

[crimson skiff]

https://discord.com/blog/discord-patch-notes-february-4-2026
yibee i guess

[echo frost]

Does it not say the version so that you can check if you have the patch?

[pure cairn]

Who would've guessed

What about devtools though? Are they still painfully slow to use because of the variables?

[crimson skiff]

still slow

[pure cairn]

[wintry cape]

/* Hide "Top Emojis in {Server_Name}" */
.listItems_affa7e[style="inset: 0px 0px 8px;"] > .categorySection_c656ac:first-of-type {
  display: none;
}

Added ".listItems_affa7e" for better matching

[hasty dagger]

Thank You

[prisma lynx]

user area's only supposed to be as wide as the channel list, can't figure out why it broke and can't find the snippet that i used

[smoky belfry]

i really need to share my snippet lmao

so many people want some part of it

[smoky belfry]

you likely want something like this

[class^=panels] {
    left: calc(var(--custom-guild-list-width) + var(--custom-panels-spacing));
    width: calc(100% - var(--custom-guild-list-width) - var(--custom-panels-spacing) * 2);
}

[echo frost]

I have a snippet for that https://discord.com/channels/1015060230222131221/1354331484831354952

[prisma lynx]

this is what i was looking for thanks :]

[prisma lynx]

also thank you for putting this here for selector style :]

[smoky belfry]

full snippet based on the rules i use nested CSS and class start by on top

[class^=sidebar] {
    &::after { display: none; }
    > [class^=wrapper] {
        margin-bottom: unset;
        mask: unset;
        > [class^=unreadMentionsIndicatorBottom] { padding-bottom: var(--space-xs); }
        > [class^=tree] > [class^=itemsContainer] > [class^=stack] { padding: var(--space-xs) 0; }
    }
    > [class^=panels] {
        left: calc(var(--custom-guild-list-width) + var(--custom-panels-spacing));
        width: calc(100% - var(--custom-guild-list-width) - 2 * var(--custom-panels-spacing));
        > [class^=container] > [class^=buttons] > [class^=micButtonParent] > [class^=button] {
            border-radius: var(--radius-sm);
            &:not(:first-of-type) { display: none; }
        }
    }
}

[prisma lynx]

i also culled a ton of my qcss
i had relatively inconsequential shit from like 2022 in there and getting rid of it makes my client run significantly faster

[echo frost]

attribute selectors are bad for performance and maintainability

[pine needle]

/* Server Tooltip */ [class*=tooltip] { max-width: unset !important; }
anyone know what this actually do?

[echo frost]

it makes the max width unset

which means it doesn't have a max width

though it doesn't seem to work

[pine needle]

i see! thank you!

[echo frost]

well it is applying

but for some reason it doesn't seem to be doing anything

ah figured it out

[class*=tooltip], [class*=Tooltip] { 
    max-width: unset !important; 
}

makes it like this

this will probably select way more than just the server tooltips though, so i would use something else

I think this'll work for only the server/folder tooltips.

/* Server Tooltip */
.tooltip__4e35b,
.tooltip__4e35b .listItemTooltipContent__91816 { 
  max-width: unset !important; 
}

and you coiuld change it to 400px or something if you just want it a bit wider

@pine needle ^

[pine needle]

thank you very much!

[smoky belfry]

i disagree
selector styles are fine for performance and good for maintainability
as long as you stick to ^= and abuse specificity, you're fine
if you use global ones you're fucked tho
the root element must be the least global possible

[echo frost]

they are worse for performance

a few are fine, but they do add up a bit

and I say they're better for maintainability because you can easily fix it with the class updater no matter what

like it literally just happened that the format of classes changed then changed back

and class updater worked, but selectors didn't

[echo frost]

and also using attribute selector wouldn't work here

[smoky belfry]

except that with nice slectors, you never need to fix them

[echo frost]

wrong

[plain kelp]

I suspect you guys have a nonstandard definition of selector

[smoky belfry]

literally just swapped temporarily from ^= to *= with trash perf and then got back

[echo frost]

i edited my message to fix say attribute selector

[smoky belfry]

i use his term

[echo frost]

oh oops

i didn't realize i called it a selector style there

[leaden hinge]

Objectively they are always worse for performance. The browser keeps a very optimized mapping for things like classes and IDs. But for selectors it has to process the CSS, then decide the best-case approach for keeping track of what the CSS is asking for. With a specific absolute selector value this is more or less just as performant as a single class or ID with a single element. But as soon as that selector is used on more than one element or has different values assigned, the browser has to do more work.

[echo frost]

oh

[smoky belfry]

^= is very fast
*= isn't

[echo frost]

i used deci's term

[plain kelp]

^= is still slower than classes, but not by very much I think

[echo frost]

yeah that will select what i sent obviously

it will select other things too

[smoky belfry]

actually it does work

[class^=tooltip] {
    box-shadow: var(--shadow-low);
    max-width: unset;
}

ah yes mine target ALL tooltips

i find wrapping when you have space stupid

[echo frost]

huh

[smoky belfry]

i spent time writing CSS to make Gemini not shit

CSS ftw

max-width unset

[echo frost]

what about css to make the tabs show when the sidebar is collapsed

[smoky belfry]

gemini.google.com##hallucination-disclaimer
gemini.google.com##input-container:style(padding-inline: unset !important;)
gemini.google.com##.input-area-container:style(max-width: unset !important;)
gemini.google.com##input-area-v2:style(border-radius: unset !important;)
gemini.google.com##.conversation-container:style(max-width: unset !important;)
gemini.google.com##user-query:style(max-width: unset !important;)
gemini.google.com##.user-query-bubble-with-background:style(max-width: unset !important;)
gemini.google.com##user-query-content:style(--max-lines-for-collapse-count: unset !important;)
gemini.google.com##.query-content:style(padding-left: unset !important;)
gemini.google.com##.preview-image-button:style(height: unset !important;)
gemini.google.com##.preview-image-button:style(width: unset !important;)
gemini.google.com##.preview-image-button:style(max-height: unset !important;)
gemini.google.com##.preview-image-button:style(max-width: unset !important;)
gemini.google.com##.preview-image-button:style(border-radius: unset !important;)
gemini.google.com##.image-container:style(border-radius: unset !important;)
gemini.google.com##.overlay-container:style(max-width: unset !important;)
gemini.google.com##.overlay-container:style(border-radius: unset !important;)

[smoky belfry]

i could, but i can just do a js injection instead

[leaden hinge]

TL;DR:
Direct class names and id references are the fastest. Relative selectors based on DoM tree are slightly slower.
= is probably fine.
^= and $= are barely slower (it uses the char array of the attribute for a match lookup, so both only look at the first relevant character in most circumstances)

*= is the worst case. The browser has to search up until nchar-1 chars for every tag.

All of these can be improved substantially by limiting scope with a more absolute fast selector.

[smoky belfry]

ublock origin set variable and problem solved

[echo frost]

I had that a long time ago (i think when gemini first came out?), but it broke

[leaden hinge]

I.E. use an absolute selector to limit what branch of the DoM tree and then use your inefficient attribute or :has selectors inside that.

:has is way faster in the last dozen or so chromium versions than prior to that.

[echo frost]

wait wtf you're using ublock origin for css on websites? use stylus

[smoky belfry]

nah i'm not installing a useless extension

uBo does CSS injection just fine

ok i need to spam !important everywhere but eh, it works™

[echo frost]

key character: ™

stylus is very nice for writing css for websites

[smoky belfry]

most of my custom ubo rules are css injection

i even found a bug in my school website, they were hiding shit client side with css

admin be like : how did you do that
me : press ctrl+shift+i

[tranquil whale]

what the hell is this

[smoky belfry]

uBo filters to inject CSS into Gemini for nicer UI

because wasting space is stupid™

[clear siren]

unsane

[tranquil whale]

spending money on a ai api key is also stupid

so i made a completely free ai api service

im gonna break the bank with this one

[smoky belfry]

Imagine paying for AI

I get it for free

[tranquil whale]

me too

using open router

and google ai studio and groq

[tight nimbus]

imagine using ai

[tranquil whale]

imagine not lol

[crimson skiff]

i have an interesting tampermonkey script that injects css on a per-website basis, helps me quite a bit

[crimson skiff]

so true

[tight nimbus]

tf you mean imagine not? can you not do things yourself anymore?

[tight nimbus]

i need to set up userChrome.css

[pure cairn]

Are you sure you want the answer to that question?

[tight nimbus]

yes?

[pure cairn]

https://tenor.com/view/apocalypse-benjammins-demise-deserving-destruction-destroy-gif-10688645292819466807

[tight nimbus]

is too tired to process meme. please try again later

[clear siren]

imagine imagining

I've used chatgpt like 3 times

[tight nimbus]

i used to use it a lot when it was new and i worked in education

now i don't use generative or agentic ai, and i'm conflicted about the uses of ai for accessibility

[crimson skiff]

not userchrome, but whatever

[tight nimbus]

like old school predictive ai is generally fine because the datasets were ethically collected, so i'm okay with stuff like auto captions (even though they're still not sufficient and you should be using manual captions)

[tight nimbus]

(your message just reminded me -- sorry i should have disabled ping)

new school predictive ai datasets probably aren't collected ethically, though that is just an assumption

[crimson skiff]

oh ok

[tight nimbus]

but also i was in the position of creating the entire digital accessibility program for my institution, so i understand the scope of things like retroactively giving all videos audio description, and i know gemini can understand video content and do that at scale

so i'm conflicted

[pure cairn]

You would be surprised to know how many people can't do anything by themselves anymore after AI spread like wildfire

😔

[tight nimbus]

that's really sad

[tranquil whale]

yeah im now so lazy

[tight nimbus]

imo laziness is not a valid excuse to use stolen labor, spike people's electricity bills, take their water, and hand over your autonomy to a few corporations

[tranquil whale]

it is

[tight nimbus]

imo

[smoky belfry]

I mean AI is a tool
Just like a knife you can use it to stab people or cut your meat
Not using AI is as stupid as only using AI
Everything needs a balance

[tight nimbus]

using a knife doesn't enherently spike people's electricity bills and take their water though

you can do good things with ai, but you have to also do bad things

unlike a knife where you can just do good things

[onyx mesa]

you can do good things with AI

[smoky belfry]

stolen labor is a complex topic
spike people electricity bill, yeah that's bad
take their water, that part is wrong and has been debunked, an AI "consume" water just as much as a nuclear reactor does, it reject clean non-contaminated water as the cooling loops are separated
Hand your autonomy is bad, hence why it should stay a tool, you shouldn't only rely on it, but doing without if you can use it is a bit stupid, it's like saying i'm gonna crank this valve by hand when there's a wrench
You shouldn't just put a motor on it, but not using a wrench because the valve work is meh

[tight nimbus]

i said that

you can do good things with ai, but you have to also do bad things

[smoky belfry]

I'm reading the message backlog in order, i answered to that

[tight nimbus]

that part is wrong and has been debunked
source?

You shouldn't just put a motor on it, but not using a wrench because the valve work is meh
i mean there's a difference between turning a valve and creating though

like by all means you should put a motor on it. why would you want to not think or create though?

[tight nimbus]

where?

[smoky belfry]

Here's an example
https://www.researchgate.net/publication/392129990_No_AI_Doesn't_Drink_a_Bottle_of_Water_per_prompt_The_Engineering_Reality_of_AI_Infrastructure_Closed-Loop_AI_Cooling_and_Power_Technical_Report

[tight nimbus]

oh i'm not claiming that it uses a bottle of water per prompt -- i agree that obviously that's wrong

i'm talking about the impacts on people who live in communites next to the big ai data centers (see I Live Next To Amazon's Largest Data Center. They're Stealing Our Water — More Perfect Union (CC) · YouTube, Invidious)

[smoky belfry]

I mean there are impacts
But they are not dissimilar to other data centers

[tight nimbus]

true, but the amount of data centers has skyrocketed with ai

so unlike other internet tools where they're just a little part of the water usage, ai alone is the culpret for many of these data centers

like when crypto bros pointed out that the global banking industry also uses a lot of electricity, but that's the global banking industry for 8 billion people, not a speculative investment tool for a few thousand

like yeah the internet at large uses a lot of water, but that's the internet at large, not like 5 tools

[smoky belfry]

Weeeell, the crypto technologies are very cool and potentially good, they're being heavily misused tho

And it's the same thing for AI, the tech in itself is good, but right now it's in a peak of abuse

When it'll calm down it'll be better

[tight nimbus]

agree

right now though it should be avoided

[smoky belfry]

I don't think it should be avoided, i think it should be used with reason

We should educate people

Not ban it

Banning stuff only lead to bad consequences

[tight nimbus]

i'm not saying ban it, i'm say avoid it personally

we definately should educate people about it

[potent ore]

I think it should be avoided but not for fancy moral reasons like that. I think it should be avoided because it's way too easy to get it to think for you, which is terrible for you.

[tight nimbus]

and again i think it should be used in the future (see accessibility argument above), but right now you should avoid it because "it's in a peak of abuse"

[tight nimbus]

that too yes

[smoky belfry]

Actually i'd disagree with that
I can accept someone not using it for moral reasons
But not because it can think for you
For that part all that should happen is education

[tight nimbus]

yeah i think you probably don't need to outright avoid it completely for that reason alone

definately be careful though

i do think you should outright avoid it completely for now for the ethical reasons though

[potent ore]

No, I legitimately think for 99% of the population it's best to avoid it altogether

[smoky belfry]

If one is stupid enough to give all it's reasoning to the AI, i'd say it's a user issue

[potent ore]

What do you mean by education? GenAI is currently in the process of killing education.

[tight nimbus]

what if there was good education about it though?

[smoky belfry]

Learning to think

Like AI can be very useful for education

[tight nimbus]

that doesn't mean that user shouldn't avoid it if it affects them?

[smoky belfry]

Lemme give you an example

Basically i don't know everything so sometimes i want to research into some topic but i don't have the vocabulary for it, but just a concept
Regular search engines are very bad with that but AI was basically made for that
So what i can do is ask the AI about it and just take its answer as open doors which i have to explore with critical thinking, basically just using it to show me paths and give me a kickstart

[smoky belfry]

No it means they should try to educate themselves

[tight nimbus]

so like an encyclopedia?

[smoky belfry]

But that's my opinion on it
I like to learn and think that learning is our goal
Learning and passing down knowledge, information

[tight nimbus]

yeah i agree with that

i just think right now ai is very harmful so it's best avoided until it settles down

[smoky belfry]

Not really
Cause to search in the encyclopedia you need to know what to search

[tight nimbus]

can you give a specific example of this?

[smoky belfry]

It's hard to think of it like that, but when i have a concept of an algorithm to do something, sometimes it might just exist, but i just don't know the name

[tight nimbus]

do you have an example of the last time you did that?

[smoky belfry]

Lemme look in my convos

[tight nimbus]

for context i'm trying to test the claim that an encyclopedia can't do this

[smoky belfry]

Found one

[potent ore]

While I agree that in a perfect world, this would be a good use for GenAI, when you start getting into topics that aren't well-summarized on the internet, GenAI might start hallucinating. This means that using GenAI in the way you describe is probably okay, but there's a chance that you are being mislead. Due to the confirmation bias, this can be very dangerous.

[smoky belfry]

I wanted to do something which is basically read a human written date and transform it into a timestamp
I can search for parser, date parser, etc
But the exact words i needed to find was natural language parser
And once i was able to find that, i was able to find what i was searching for
(technically i found it before the AI told me cause while the AI do its thing, i still try to search on my own to be able to cross results)

[smoky belfry]

Except that an hallucination is already a start
It's like when you decide of an hypothesis before doing an experiment
It might be wrong or right, at the end you'll have discovered more and that allow you to search more and discover more

[tight nimbus]

what was the prompt you used?

[potent ore]

This isn't a good simile, as an experiment is designed to fail in as many ways as possible, whereas a user is expecting a correct answer (due to the low rate of hallucination).

[smoky belfry]

I gave it context about what i wanted to do, some stuff i had already seen like the fact i knew dayjs did that, asked it how i could search similar libraries in other languages, etc

[tight nimbus]

right could you share that please? i need to know what you knew at the time to test whether an encyclopedia could do the same job

[smoky belfry]

Except that is wrong expectation
When asking an AI i don't expect a good answer, i expect an answer which is correlated to the context

[tight nimbus]

(also ping me please i need to switch tabs for a sec)

[tight nimbus]

wait literally the fourth result for "human written date parser" has "natural language date parser" in the title

human written date parser at DuckDuckGo (archive)

[smoky belfry]

Try on google

Also i didn't phrase it like that

[tight nimbus]

google is a bad search engine -- why would you use a bad version of a tool when better ones are free and easier

[potent ore]

That's a great attitude to have, but the majority of people don't think that way.

[potent ore]

Default 😔

[tight nimbus]

right this is part of education of using a tool -- knowing how best to use it

[tight nimbus]

yeah but chatgpt isn't the default so clearly they're willing to use something other than the default

[smoky belfry]

No, for most thing Google is way better than other search engines

[tight nimbus]

can you give an example?

[potent ore]

The lesson here shouldn't be "AI is better than Google"; it should be "I don't know how/don't have the patience to use Google properly."

[tight nimbus]

wait actually nvm i don't even need to make this argument

[tight nimbus]

it's still the fourth result

Startpage Search Results (archive)

[smoky belfry]

Great, that's why i used AI on the side and searched for things myself and ended up falling onto it by reading and reading
But for that case where i found because it was simple enough, in other cases it may be harder

[smoky belfry]

Still not on google

[tight nimbus]

right but if the massive water and electricity usage are inherent to using ai and other things work, why wouldn't you just choose the other things?

[tight nimbus]

startpage is just a google front end i don't want to visit google.com

[smoky belfry]

I did try out duckduckgo and others
I don't just use defaults, i'm a Firefox user, not edge or even chrome
But for some things, Google is just good

[potent ore]

For me on Google it's the 10th result

[tight nimbus]

that's still fine

that's first page

(but again even if it were second page, that's part of education of using a tool -- knowing how best to use it)

[smoky belfry]

Today it's right at the bottom, yesterday it wasn't even there, personalized results

[tight nimbus]

did you check beyond the first page yesterday?

(also knowing about and knowing when to disable personalized results is part of education of using a tool -- knowing how best to use it)

[smoky belfry]

Even then, the time i might save is too big
It doesn't mean i don't search on the side on my own
But there are times where it did help

[potent ore]

We're not trying to convince you that your usage didn't help you or save time

Just that overall, most people would benefit from avoiding GenAI altogether

[tight nimbus]

if your argument is that ai is fine if you're properly educated on how best to use it, then that goes for alternatives too

clearly you aren't great at using search engines, but if you had proper education about it they would work fine

[smoky belfry]

The ratio of the cost of AI to the gains is for me positive

I know how to use search engines, i've spent a while using them before AI existed

[tight nimbus]

see if you had proper education about how to use a search engine you would know when to go through the list of results itself insead of going through the results individually

[tight nimbus]

i said you're not great at using them. obviously you know how to use them, but you're not great at it (as evidenced by not being able to find the thing i found immediately first try, and thinking that search engines actually aren't even equipped to do that in the first place)

[smoky belfry]

Except that as i said, i ended up finding before the AI on that

I did actually find it myself

But i could potentially have not

[tight nimbus]

right so again: if the massive water and electricity usage are inherent to using ai and other things work, why wouldn't you just choose the other things?

[smoky belfry]

Because the cost is lower than the gain

The water use isn't massive

[tight nimbus]

but it's not with proper education, which you argue is essential to using the tools

[tight nimbus]

again see I Live Next To Amazon's Largest Data Center. They're Stealing Our Water — More Perfect Union (CC) · YouTube, Invidious)

[echo frost]

why not just use an extension like stylus?

[crimson skiff]

boring

[tight nimbus]

real

[crimson skiff]

also too much for my brain trust

and not sure on syncing

[tight nimbus]

alternative solution: just use ntfs (/s)

[crimson skiff]

like the filesystem? no i use zfs on linux

but still ntfs on windows, id love to use zfs on windows

[echo frost]

wdym?

[crimson skiff]

like does stylus sync across browser sessions

[echo frost]

you want syncing?

[smoky belfry]

Ext4 simple and efficient

[echo frost]

browser sessions like the same computer?

either way yes

[smoky belfry]

uBo dors sync custom rules for sure

I like uBo

[echo frost]

it has cloud syncing if that's what you mean

[crimson skiff]

no, different browsers on different laptops

[crimson skiff]

oh cool

nah, too lazy anyways

[echo frost]

do you have syncing with your tampermonkey script?

[crimson skiff]

yes

[smoky belfry]

💀 it doesn't just do the normal thing of using the browser profile ???

[crimson skiff]

sync it like every week or whenever i want

[smoky belfry]

Like uBo does the syncing through Firefox sync for me

[echo frost]

it probably has that too (maybe)

i've never tried

[smoky belfry]

Well it show Dropbox Google drive one drive and webdav

[echo frost]

yeah and the profile would be automatic so wouldn't need to show up in that list

[smoky belfry]

Mmm

[echo frost]

oh manually?

[crimson skiff]

no automatically

[echo frost]

how?

I just had the thought that you could put it on github or something and have tampermonkey auto update it

oh tampermonkey has this too

[crimson skiff]

userscript sync

in settings

not utilities

utilities is manual

[echo frost]

you mean userscript update?

[crimson skiff]

no, userscript sync

set your config mode to advanced

[echo frost]

oh

[crimson skiff]

yeah

peak theme development chat

[echo frost]

yeah

[supple sparrow]

im using https://raw.githubusercontent.com/scattagain/VencordStuff/4fa465629d6d71092c20aa11245abb6ad4a44641/css/GuildbarRevert.css
as quickcss and there is an overlap here basically i can't click the cross https://i.imgur.com/dutYZmd.png

[potent ore]

How do you do these cool links?

[clear siren]

https://support.discord.com/hc/en-us/articles/210298617-Markdown-Text-101-Chat-Formatting-Bold-Italic-Underline#h_01H53FJBNB9B5RT9M1M9V1EQ7W

[tight nimbus]

it's the share bookmarklet here

bookmarklets: A collection of useful bookmarklets (archive)

[potent ore]

I know markdown, but there looks to be some other tool

[potent ore]

Thank you!

[tight nimbus]

thanks for asking / calling it cool! it took a decent amount of effort 🙂

[tight nimbus]

course! (also lmk if you ever encounter any bugs)

[potent ore]

~u9000/share-bookmarklet - A bookmarklet to copy a Markdown link to any site, including alternate frontends - sourcehut git (archive)

Nice

[tight nimbus]

(supports youtube, invidious, reddit, and redlib. for other services it will also link to a Farside front end if available, and if not will link to an archive)

[potent ore]

Farside isn't working for me

[tight nimbus]

can you send a link?

[wintry cape]

There is a extra bracket error } in that snippet at GuildbarRevert#L142-145 but that is not the issue.
Bot doesn't work, so the error is below now.

#guild-list-unread-dms > div {
            height: var(--guildbar-avatar-size) !important;
        }
    }

You can make the header children length a bit less so the trailing goes a bit to the left.

/* Change the 50% to your liking */
.children__9293f {
  max-width: 50%;
}

[supple sparrow]

that worked! thank you so much! 😄

[wintry cape]

Your welcome

[lucid lynx]

has anyone got a working css to turn it back to the right image? mine broke after a recent update

[echo frost]

#1354331484831354952 message

[tidal heron]

anyone else had this weird issue

literally clicked nothing apart from an image

and its only that channel

[lucid lynx]

tysm

[hexed imp]

Confirming, happens to me. Still happens without Vencord, so it's a Discord thing. Doesn't happen on browser or mobile, only desktop client. & only happens if I can't send a message, doesn't happen if I have message perms.

[past nexus]

Discord on Linux won't respect my portrait monitor boundaries because of the min-width property. Does anyone have a CSS fix for Vencord that forces the app to fit within 900px without overflowing to the next screen?

[onyx mesa]

the thing where the banner goes blank in the user area started happening again, i looked at it and the <video> element in videoContainer__4bbc6 just disappears, no way to bring it back without restarting the whole app

[onyx mesa]

reworked the new VC redesign discord did, did not like it

[tight nimbus]

what did they look like before you did that?

[tight nimbus]

and this is how they looked before discord changed it?

[pure cairn]

no

[onyx mesa]

that's what i changed it to

this glow design is not available in every server right now

[tight nimbus]

ah that makes sense

[smoky belfry]

You can just disable it with experiment

[oak plover]

i think they rolled it back entirely not sure tho

okay mostly there's still a couple that have it

[karmic eagle]

how do i make this bit black

[tranquil whale]

can i have this snippet really hate it too

[tight nimbus]

Ctrl+Shift+I > elements > press the select button in the top left (pictured below) > click the part you want to be black > styles > computed > find color > click the circled arrow (pictured) > find the css query that does that

[karmic eagle]

where is computed

[jovial arrow]

may i have this too, please? esp if lets you recolor the green or you can tell me how i like the idea of it but not the wall of gradient lmao

[pine needle]

may i have this too please?

[tranquil whale]

im think of finally making my own discord theme

[tranquil whale]

I have decided to make the first 3d discord theme ever

[onyx mesa]

@tranquil whale @jovial arrow @pine needle

.voiceChannelHighlightContainer_c69b6d {
    .voiceChannelHighlightBorder_c69b6d {
        width: 4px !important;
        border-radius: 8px;
        inset-inline-start: 20px;
        top: 34px;
        bottom: 10px;
        box-shadow: 0 0 12px color-mix(in srgb, var(--icon-feedback-positive) 50%, transparent 50%);
        transition: box-shadow 0.3s;
    }
    &:hover .voiceChannelHighlightBorder_c69b6d {
        box-shadow: 0 0 12px color-mix(in srgb, var(--icon-feedback-positive) 100%, transparent 0%);
        transition: box-shadow 0.3s;
    }
    .voiceChannelHighlightGlow_c69b6d {
        background: none;
    }
}

[tranquil whale]

thanks

[tranquil whale]

im making a 3d css snippets collection

[pine needle]

ty moon!

[tranquil whale]

is it really the end of discord

what are all of y'all moving to

rootapp?

[pure cairn]

https://tenor.com/view/context-context-hat-i-require-context-soyjak-wojak-gif-11496174374422496290

[tranquil whale]

like this age verification thing is making a lot of people to move away from discord

many moving to rootapp

[pure cairn]

Cool, less questionable people to deal with on the platform

[tranquil whale]

come on spare me and ill still be on discord btw

[echo frost]

I assume you mean the tan background?
If you only want to replace specific colors, you can do this, and add any colors you want in the :is()
If you want to replace all colors, just remove the :is(...)

.callContainer_cb9592 :is(
  [style="background-color: rgb(211, 192, 175);"],
  [style="background-color: rgb(20, 4, 17);"]
).background_fb62e2 {
  background-color: black !important;
}

[onyx mesa]

when will they fix the laggy ass typing

[echo frost]

I thought it got better for me

[echo frost]

try disabling your css and see if it's still laggy

I had some css with :has() that singlehandedly made my discord really laggy

[unique stone]

anybody got a way to remove this shit discord added in there infinite wisdom?

[tight nimbus]

yeah it's either earlier in this conversation or in #🎨-css-snippets

[unique stone]

thanks

[late lichen]

is this good?

[echo frost]

I think it's this experiment dev://experiment/2025-12_voice_channel_hoisting

[tranquil whale]

Im trying to make 3D models in discord lol

[tranquil whale]

thoughts

3D is the next generation

[karmic eagle]

didnt work

[echo frost]

well that looks like a different color

[karmic eagle]

yea

diff pfp

[echo frost]

so you do want it to apply to all of them
did you remove the :is()?

[karmic eagle]

no i jsut wanna apply it to mine

[echo frost]

just do this if you want it to apply to all

.callContainer_cb9592 .background_fb62e2 {
  background-color: black !important;
}

oh

[echo frost]

this is you?

[karmic eagle]

yea

[echo frost]

.callContainer_cb9592 [data-selenium-video-tile="1408574820668669962"] .background_fb62e2 {
  background-color: black !important;
}

the 1408... is your id

[karmic eagle]

nope

wat

[echo frost]

so if that's an alt account or something, replace it with the id of the alt account

[karmic eagle]

id for this acc?

okok

[echo frost]

id for this account

[karmic eagle]

ok done thx

[echo frost]

and if you want multiple you can do it like this

.callContainer_cb9592 :is(
  [data-selenium-video-tile="1408574820668669962"],
  [data-selenium-video-tile="id_here"]
) .background_fb62e2 {
  background-color: black !important;
}

[late lichen]

theres something i just realized, its possible to climb the nesting tree

[echo frost]

yeah with :has()

[late lichen]

the other way around

[echo frost]

assuming you mean to get like the parent of .element?

oh you mean .parent>.element ?

[late lichen]

idk how to explain it

[echo frost]

sending the css would explain it

[late lichen]

its not discord but i think it will work

.ytp-chrome-controls {
                height: 48px;
                line-height: 48px;
                
                .ytp-left-controls {
                    .ytp-volume-area {
                        .ytp-volume-panel {
                            .ytp-volume-slider-active & { /* this activates if any of the above has ".ytp-volume-slider-active" */
                                width: 52px;
                                margin-right: 3px;
                            }
}}}}}```

[echo frost]

doesn't .ytp-volume-slider-active & evaluate to .ytp-chrome-controls .ytp-left-controls .ytp-volume-area .ytp-volume-slider-active .ytp-volume-panel

https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Selectors/Nesting_selector#appending_the_nesting_selector

[late lichen]

i think not, cause it triggers when chrome-controls has it, so it cant be that

[echo frost]

you're thinking it's equivalent to .ytp-chrome-controls .ytp-volume-slider-active, .ytp-left-controls .ytp-volume-slider-active, .ytp-volume-area .ytp-volume-slider-active ?

[late lichen]

hold on, let me check it again

[echo frost]

https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Nesting/Using#example_3:~:text=In the following CSS%2C we are creating the styles for .card and .card h2

[echo frost]

or rather :is(.ytp-chrome-controls, .ytp-left-controls, .ytp-volume-area) .ytp-volume-slider-active .ytp-volume-panel

[echo frost]

also just realized i had .ytp-volume-area at the end of this instead of .ytp-volume-panel

[late lichen]

(with .ytp-volume-slider-active on ytp-chrome-controls)

[echo frost]

that can't be right

are you sure it's not just highlighting it incorrectly

and why it it italicized?
Doesn't that mean it's inherited or something?

can I see this myself?

where is this

[late lichen]

youtube?

[echo frost]

just a normal video?

is it builtin css?

[late lichen]

custom, idk why im modding yt..

[echo frost]

can you send the css?
also why is it italic? i'm seeing some css with that says it's an injected stylesheet, is it that? and what does that even mean

[late lichen]

extensions css

[late lichen]

this

[echo frost]

that's different than the screenshots, and it has an extra right bracket

[echo frost]

what extension?
the extension i use (stylus) doesn't say it's injected stylesheet

[echo frost]

and where in the dom is this

[late lichen]

you mean that or the full tree?

i need to sleep, gn

[echo frost]

<@&1073655264923881602> not sure where you're seeing that
this is what it looks like for me with the css you initially sent

wtf

silent didn't work

why is there a role called silent

<@&1073655264923881602>
test

wait what how'd you manage to do this
did you use the SilentMessageToggle plugin?

it's a role in this server

<@&1073655264923881602>

test

so it's only possible with the SilentMessageToggle plugin?

this is so stupid

[crimson skiff]

<@&1073655264923881602>

mad

[tranquil whale]

lol

[real quarry]

probably

[pure cairn]

Yes

You can only climb one step at a time with classname &

You can climb more if you add more though
https://github.com/Krammeth/css-snippets/blob/main/StatusHider.css

[echo frost]

wdym by this?

like wdym by climb

[pure cairn]

Ignore it, I should not be looking at css at 6am in the morning right after I woke up

😭

[onyx mesa]

i haven't added anything significant into my css besides updating the broken ones and i have seen other people complaining about it too

[echo frost]

Try disabling it just to double check

discord has made some improvements lately, and I think I've been experiencing less lag

[onyx mesa]

yeah it did not made a difference

it's definitely not as laggy as it was before but there's couple stutters now and there

it's not that big of a deal

[leaden hinge]

There's a few things that can be done without discord changing their DoM and JS and without plugins. You can use CSS to move the chat bar to its own compositing layer and then also tell the browser that its contents won't ever affect containers around it. You can also use grid layout to place the chat bar and the channel contents into rows of the same grid. This lets the browser cheat at how much math it has to do on reflow calcs.
You can disable spell check.

But until they stop using content editable div with a span per word with on keyup spell check with no real throttling it'll be kinda laggy.

But with even pretty simple themeing we accidentally make it so every keystroke is causing all chat messages in the channel to recalc and that's "not good™"

Oh, and with Nvidia drivers there's some weird shit where an active 3d canvas will cause chrome and by proxy electron hardware acceleration to actually shit the bed.

Nvidia won't be fixing that though, too busy ai genning another leather jacket.

[echo frost]

what how do you do the moving chat bar to its own compositing layer?

and the other things you said in the first paragraph

[crimson skiff]

bros just yapping nonsense

[leaden hinge]

This:

.form_f75fb0 {
    will-change: transform;
    transform: translateZ(0);
    backface-visibility: hidden;
    contain: layout style;
}

Tells the browser to put this in a GPU layer and keep it there (will-change: transform is enough of a hint on newer browsers, but translateZ(0); forces it on older browsers.)

We aren't planning on showing the back of the element so we turn off the backface visibility since it's never going to show the back side of the element.

contain: layout style tells the browser "Whatever happens inside this box, stays inside this box"

In this case, it lets chrome render everything inside the chat box and then insert the complete element rather than trying to calculate the shift for each of it's children nudging it's siblings.

Note that this isn't some broad stroke you can apply though. Use sparingly as this forces the browser to keep a layer active for an element and then composite them back together later. It can speed some things up, but there is a cost associated and if you use it too much it will lower performance rather than improve it.

For the grid layout approach you'd do something like:

.chatContent_f75fb0 {
    display: grid;
    grid-template-rows: 1fr auto;
    grid-template-areas: 
        "messages"
        "input";
    height: 100%;
    overflow: hidden;
}

.messagesWrapper__36d07 {
    grid-area: messages;
    overflow-y: auto;
    min-height: 0; 
}

.form_f75fb0 {
    grid-area: input;
}

document.querySelectorAll('[spellcheck]').forEach(el => {
  el.spellcheck = (el.spellcheck === false);
});

To turn spellcheck off

(it actually toggles it, so if it's on it will turn off and then vice versa)

[echo frost]

is spellcheck actually laggy?

[leaden hinge]

So the problem isn't directly spellcheck but rather it being unthrottled and then also being used in combination with Slate.js.

Basically, the spellcheck is hooked up to put the red squiggles under text. Slate.js is hooked up to handle markdown formatting inline while editing (preview the bold, italic, syntax highlighting etc.) You start typing something, and as you type the spellcheck fires, but then suddenly slate.js sees something it recognizes, yeets that part of the DOM to rewrite it as it's formatted version and then the spellcheck has to fire again.

I think they could hook the spellcheck up to a callback from Slate.js

That way it only fires once Slate.js is "done" doing what its going to do

it also wouldn't be so bad if the contenteditable div that slate.js is attached to wasn't nested 30 levels deep

Its just a bunch of small issues stacking up that causes the chat bar to feel like dogshit though. Any one of the issues would be pretty inconsequential but all of them stacked up feels pretty bad

For grins you can also just turn off the slate.js stuff in discord's settings. You lose your pretty preview as you type though.

Likely this is all just a consequence of "We should have rewritten the core dom structure 100 versions ago and now it's too much work."

(or its a consequence of we use frameworks to generate our dom and css and js with reckless abandon and no concern for real-world performance.)

Hard to say which.

[clear siren]

🤔

[smoky belfry]

Don't worry when discord goes over 4GB of ram used it'll restart itself when idle

[leaden hinge]

Definitely a more suitable solution than fixing whatever is consuming that much memory.

We have NVME SSDs, letting the memory free and then reloading from disk is faster than fixing a bug these days.

[crimson skiff]

https://github.com/ianstormtaylor/slate

(Currently in beta.)

[leaden hinge]

https://github.com/discord/slate

Discords fork is even more in beta.

[tidal vapor]

is there some way to remove these from memberlists

[tidal vapor]

right click?

doesnt work for me

[echo frost]

I don't see it in your ss

do you have css that could be hiding it?

[tidal vapor]

custom hover-over memberlist

[echo frost]

there should be this Activity - #

[tidal vapor]

not quite there

[echo frost]

yeah so disable your css and right click it then

[tidal vapor]

alright

[sick sage]

anything to fix this/make it cleaner

[wintry cape]

/* Change the 50% to your liking */
.children__9293f {
  max-width: 50%;
}

Changes the width from the channel header's children so it moves a bit more to the left to fit in

[sick sage]

Idk if its because of what i have in the quick css already but it didnt change

[wintry cape]

Play with the % a bit

[sick sage]

hm still nothing

[wintry cape]

Check in your theme if you have something that overwrites it

[sick sage]

wait now it worked i had to go until 25% for it to change

[wintry cape]

So it works fine now?

[sick sage]

yea, alot better thanks

[wintry cape]

Great

[late lichen]

you still have that maximized thing?

[wintry cape]

I made it myself and never changed it since lol, i had winbuttons display none, but i uncommented that to show the above

[late lichen]

ok, i think i went a little to far on bg-image svgs, uhh cause i got animated arrows now running on the svg, well foreignObject but still

[harsh mist]

has this been fixed yet or is there something else to change it? the small icons bother me so much

[echo frost]

-# their question was resolved apparently #1354502862390038528

[prisma plinth]

The new toggle switches for channels now apply CSS on the element instead of with a class and nothing seems to change other than the applied style, is there any way of targeting this with just CSS so the switch can be a different color when it's off?

[fading crest]

thank you :3

[echo frost]

not sure what you mean by switches for channels and now
but here's some css I made to make toggle switches a different color. I made it for it to use the css accent color variables, but you can replace the transparent with whatever color you want for when it's off. it's a bit scuffed but the switches are implemented without css and purely with javascript for some reason, so it's not really doable to do much more

.switchIndicator_a28278 {
  transition: background-color 0.1s ease !important;
  background-color: var(--control-primary-background-hover) !important;
  border-color: var(--control-primary-border-hover) !important;

  &[style^="opacity: 1; background-color: rgb(88, 101, 242);"] {
    background-color: var(--control-primary-background-default) !important;
    border-color: var(--control-primary-border-default) !important;
  }

  &:active {
    background-color: var(--control-primary-background-active) !important;
    border-color: var(--control-primary-border-active) !important;
  }
}
.switchIndicator_a28278:is(
  [style*="; background-color: rgba(0, 0, 0, 0.12);"]
) {
  background-color: transparent !important;
}

[echo frost]

oops forgot to reply

[noble sleet]

Are there any snippets available to remove this annoying little popup above the chatbox? I've tried using search in this server but haven't come across anything (only others complaining about the same thing)

[echo frost]

can you reply to this message so I can test it?

[echo frost]

got it
this should work

.threadSuggestionBar__841c8 {
  display: none;
}```

[noble sleet]

Thanks!! I'll try this when I'm on PC again!

[tight edge]

how do you get rid of the dark gradient that appears in some chat areas when you arent at the very bottom?

[white orbit]

is this a place to ask about if a theme has been made?

[tranquil whale]

Just ask

No one really cares about whatever is sent here

[white orbit]

has anyone made the SkeuoCord theme but for vencore?

[clear siren]

if it's for another client mod it should work with vencord

[white orbit]

its for better discord

[clear siren]

assuming it's up to date it should work fine

doesn't matter what client mod you use or if you use web discord it's the same html

(mostly)

[white orbit]

how do i know if i installed vencord correctly?

[echo frost]

look in settings for vencord section

[white orbit]

now how do i install the theme?

[echo frost]

go to themes

[chilly knoll]

if i have an icon i wanna change it to use another icon by replacing its paths (which are used for other icons), is there a way to make the paths change only for that specific icon?

icon in question is CalendarPlusIcon, the path used for the plus is used for other icons and i wanna add display: none to it for CalendarPlusIcon

[tranquil whale]

Im taking a break from theme development for at least 2 months maybe more

Gonna try out development for r/honk the reddit gane

And maybe do art and music

Hope you al enjoy your time as a theme dev 😄

This is me singing off for the last time maybe

Bye

[pure cairn]

where's that icon? I can't find it

[chilly knoll]

neither can I lmao, i did see it in equicord icon browser tho

its gonna bother me if I dont do this right thats why I asked despite not being able to see it anywhere in the app

[echo frost]

is it even actually used?

[pure cairn]

I don't think so

[chilly knoll]

maybe it isnt used

still gonna bother me but oh well no biggie

[oak plover]

Possibly the create event option in the server context menu

I MAY be wrong though it could just be a regular calendar icon

[pure cairn]

no you are right, it's there

@chilly knoll if I understood correctly, this is what you want

.item_c1e9c4[id="guild-header-popout-create-event"]>.iconContainer_c1e9c4>.icon_c1e9c4>path[d="M19 14a1 1 0 0 1 1 1v3h3a1 1 0 0 1 0 2h-3v3a1 1 0 0 1-2 0v-3h-3a1 1 0 1 1 0-2h3v-3a1 1 0 0 1 1-1Z"] {
    display: none;
}```

[chilly knoll]

thanks

[pure cairn]

[white orbit]

should the thing be going off the edge of the box?

[wintry cape]

No, that is because that doesn't have a border normally

[id="privacy_and_safety_standing-tab"] {
    padding-right: 25px;
}

[white orbit]

so how do i fix it?

[wintry cape]

.

Add this in your theme

[white orbit]

anywhere?

[echo frost]

most anywhere will work, but just do it at the bottom

[wintry cape]

Yes

[white orbit]

did not do a thing

[wintry cape]

What is your theme?

[white orbit]

skuocord

[wintry cape]

Can you send your theme here

[white orbit]

^

[wintry cape]

I see

[white orbit]

?

[wintry cape]

I noticed, i am looking for a fix now

[white orbit]

oh ok

[wintry cape]

One issue is that you can't place css that are not variables (start with --) in the :root {}

[white orbit]

oh so what do i do?

[wintry cape]

Like this?

Add this at the bottom of your theme

#privacy_and_safety_standing-tab .status_d878e7 {
    padding-right: 25px;
}

[white orbit]

with the #?

[wintry cape]

Yes, the # means it is a id

[white orbit]

ok

thx

[wintry cape]

Your welcome

[crimson skiff]

also about this, i think stylus is unable to inject into shadow doms, but i want some styles to be injected (like removing grammarly's stupid blur filter over premium tips or some shit)

[echo frost]

wdym shadow doms

[crimson skiff]

shadow roots, shadow doms, etc

[echo frost]

yeah wdym shadow

oh

[crimson skiff]

essentially an iframe, but not an iframe in a way an iframe would behave

[crimson skiff]

yes

that stupid thing

i hate it so much when it does a (closed)

because then you cant make any changes to it from the outside

https://developer.mozilla.org/en-US/docs/Web/API/ShadowRoot

[echo frost]

seems like you might be able to do it with ::part()? https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Selectors/::part

[crimson skiff]

too lazy to change

also doesnt work

[echo frost]

oh wait it seems like that only works when an element has a part attribute

[crimson skiff]

because grammary doesnt use ::part in their dom

[echo frost]

which is what it says, but i didn't notice

yeah

[crimson skiff]

yeah thats the issue

[echo frost]

i feel like stylus should be able to inject it into shadow doms if you can do it with a tampermonkey script

[echo frost]

is it on your github?
How does it work?

[crimson skiff]

not yet

[echo frost]

could you send it to me in dms or something?

[echo frost]

wtf why's discord's syntax highlighting not working :(

[crimson skiff]

i obviously removed all the urls, because those are quite revealing

partial vibecode as well

[crimson skiff]

dont see any issues

unless its a shiki thing

[echo frost]

i don't use shiki

maybe shiki fixes it

[crimson skiff]

yeah im using shiki rn

[echo frost]

oddly the comments are colored when it's not expanded, but when i expand it it's pure white

[crimson skiff]

by injecting the shadow dom, you can target the .ftgla1i and set its filter to none !important and you get the pro suggestions for free, just without the fix

[echo frost]

your script is way simpler than i was expecting

[crimson skiff]

were you expecting dark magic

[echo frost]

i'm surprised stylus doesn't do this

idk

[crimson skiff]

could make an issue ig

https://github.com/openstyles/stylus/issues/739

[frozen pulsar]

how do i make make the users profiles a single font only? same as the normal font no weird changes

[white orbit]

is there a way i can turn these into squares

[pure cairn]

toggle this off

[prisma lynx]

voice option dropdowns in the user area showed up again. changing these classes to their new hash isn't working. was this already discussed today?

[iron smelt]

https://syndishanx.github.io/Website/Update_Classes.html

Try updating it

[echo frost]

it doesn't work

i'm working on a fix which will be done in like a minute

[echo frost]

/* Hide the mic/deafen arrows */
.audioButtonParent__5e764>.buttonChevron__5e764 {
  display: none;
}
.audioButtonParent__5e764>.audioButtonWithMenu__5e764 {
  border-radius: var(--radius-sm);
}

[prisma lynx]

worked, thank you :D

i shoulda noticed that lol

[echo frost]

Also, not sure if you're using my snippet or you made it yourself, but here's the thread if you are: #🎨-css-snippets message

[prisma lynx]

yeah

works fine for me, though?

[echo frost]

yeah, i just meant that you can ask for help with my snippet in the thread

[minor panther]

is there any css to hide these arrows

[echo frost]

@minor panther scroll up a bit

[minor panther]

i tried to scroll up but it was being slow mb

[white orbit]

is there a version of vencord for fluxer?

[echo frost]

what is fluxer?

[white orbit]

discord but not discord

[echo frost]

vencord is for discord

there might be client mods for fluxer, but i've never heard of fluxer, so i don't have any recommendations
but i doubt it needs client mods since it's open source

[errant zenith]

it supports custom css by default

[white orbit]

how do you do it?

[white orbit]

i cant get it to work

[echo frost]

This isn't a fluxer support channel
You'll be better off asking in a fluxer server or something

but it says on the website it supports custom css
So it should be pretty easy to do. Look in the settings or something

and if you're trying to use a discord theme in fluxer, it's not going to work

[echo frost]

it's in settings under Look & Feel
Expand Custom Theme Tokens

[white orbit]

ohhhhh

[chilly knoll]

this is why i wanted it hiding, the plus bit is part of the icon im using lol

where is the CalendarRetryIcon used

[pure cairn]

Makes sense, that looks good

[pure cairn]

No clue, I've also just turned off my pc

[errant zenith]

idfk i dont use that shit

[white orbit]

ok

[sullen hound]

is it possible to hide elements that only have a part of their name randomized

like, for example,
<use href="#«r1q1»-lower_badge_masks" fill="black"></use>
i want to hide by using the href, but the stuff between «» gets randomized

[brazen quartz]

[href$="lower_badge_masks"] { display: none; }

[sullen hound]

fascinating, ok. i shoved that in my block of other hidden stuff and it didnt work at first

but i got it under control now.

thank you, you do not want to see how i terribly determine how to hide things

[late lichen]

catbox down?

[pure cairn]

Looks like it

[echo frost]

whoa

[steep drum]

do you need !important if you're trying to edit an already-set value?

[pure cairn]

sometimes adding a parent element is enough

https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Cascade/Specificity

[steep drum]

oh dear god

[late lichen]

mdn is op

its documentation but still

[pure cairn]

[crimson skiff]

just add a .visual-refresh #app-mount, should be more than enough specificity

[echo frost]

unless it's defined in style attribute
then you need !important

[burnt lake]

Can I have both Vencord and Equicord at the same time?
Will there be any conflicts?

[lament trench]

there will be conflicts

why would you even do that

just use one or the other what do you need both for

[burnt lake]

because vencord dev for its own plugins is terrible, honestly, it often loses support
Sometimes updates don't work or the app crashes.

Unfortunately, they divide it into two channels: stable vencord and dev vencord. Eh

[lament trench]

????????

https://tenor.com/view/breaking-bad-funny-wtf-wth-jesse-gif-17336046

[iron smelt]

But yet, why would you even need to do that?

Equicord is a fork of Vencord, it has all the same stuff as Vencord

It’s literally just Vencord + some extra stuff

[pure cairn]

real

[chilly knoll]

you underestimate the stupidity of discord users

no offense to that person

[odd pine]

@edgy sentinel

[potent idol]

Remodified Bigger server icons again - Original by @dusty tusk

  scale: 110% 110%;
}

[aria-label="Servers"] .isExpanded__48112{
  --space-xxs: 10px !important;
}

.listItem__650eb{
  height: 41px !important;
}

[id^="folder-items-"] {
  height: auto !important;
}```

[potent idol]

Fixed Small User Area - Original CSS By @cosmic pollen

  width: 300px!important;
  height: auto!important;
  display: flex!important;
  flex-direction: column;
  border-radius: 15px!important;
  filter: drop-shadow(7px 7px 7px rgba(0, 0, 0, 0.123)) ;
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
  .wrapper_e131a9 {
    height: auto!important;
  }
}
.sidebar__5e434 {
  overflow: visible!important;
}
.container__2637a {
  padding-bottom: 0px!important;
}
.scroller__99e7c {
  margin-bottom: 0px!important;
}
.bottom__7aaec {
  bottom: 0px!important;
}


.visual-refresh [class^="panels_"] [class^="container__"] [class^="buttons__"] {
  opacity: 0;
  transform: scale(0);
  transform-origin: left;
  transition: opacity 0.1s ease-in, transform 0.1s ease-in;
  will-change: opacity, transform;
}

.visual-refresh [class^="panels_"]:hover [class^="container__"] [class^="buttons__"] {

  transform: scale(1);
  
  opacity: 1;
}

.visual-refresh .panel__5dec7 {
  display: none;
}

.visual-refresh [class^="panels_"]:hover .panel__5dec7 {
  display: block;
}```

[ornate zodiac]

half my damn custom css broke again

how would one go and update this

[wintry cape]

Either above or you have to look in devtools for the classes

[ornate zodiac]

it worked but I have this

/* Discord Window Name */

.title_edbb22 {
  >:is(svg, .icon_f34534) {
    display: none;
  }
  >.text-sm_cf4812\/medium {
    font-size: 0;
    &::after {
      font-size: 14px;
      content: "MSCPTN";
    }
  }
  &::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="1.5"><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>');
  }
}```

to change the top title bar but hasn't changed the name only the image

[pure cairn]

Discord rerolled classes again?

[ornate zodiac]

Looks that way

[narrow hinge]

Not since they reverted

[ornate zodiac]

Maybe I've not noticed before lmao

takes me a little while usually

[pure cairn]

Good to know, I'm still chilling

[ornate zodiac]

Anyone know what the top bar css is?

Can't figure it out

This one

[late lichen]

i have these, title element, title text, and topbar

[upbeat flicker]

if you look for exactly that, its .title_c38106 like in the other message

[burnt ermine]

vc

[dusky maple]

has anyone tried anything with the new nitro names with custom css? I'm trying to find that one class(probably a class) that makes the nitro name fonts work and exclude it from my entire font override I've done I wanna keep that nitro font name thing
https://cdn.discordapp.com/attachments/1349664491893424128/1476673188099391538/image.png?ex=69a1fa93&is=69a0a913&hm=13cbceb4f6038222b499d284f37baff33c33e8dff2f11c935f7451c36056e1e1&animated=true

I wanna keep the font in the small pic that has my name without the custom font overriding it, tried inspect element but I'm pretty lost

NVM‼️ I'm figuring it out you can ignore this message

[dusky maple]

if anyone is curious this is what I did

[pure cairn]

so basically

:root {
  --font-primary: "Rajdhani", sans-serif;
}```
but with way too many extra steps

[dusky maple]

Oops😭😭😭
Thanks anyways, it's my first theme after all

[pure cairn]

you can check the pinned post on #🎨-css-snippets for the universal font changer

[pure cairn]

np

[pure cairn]

as a psa, this looks like a ticking lag bomb ready to explode

using * as a selector is kinda dangerous, performance-wise

I also think you can chain :not() selectors more easily

if I'm not mistaken, using :not([class],[class], etc...) should do the trick

you can check websites like MDN and w3schools for more info

have fun learning

[dusky maple]

yeah that's cool, it's my first time using :not since I didn't really need before

[echo frost]

also you can do multiple things in 1 :not()

oh

oops I forgot to read

[dusky maple]

yeah dw I got it now

is there a way I can make this icon have my online color? adding !imporant won't load the background color at all if I do
probably not since it's an img

[pure cairn]

It's an svg, so you have to change the color property

Either color or fill if you select the path

[dusky maple]

alright I just got it

awesome

never messed with svgs before

[pure cairn]

They're not exactly images

You can think of them as a bunch of consequential coordinates that, at the end, will form a drawing

Which is what makes them suitable for responsive designs, as they can get bigger or smaller without losing quality

[late lichen]

thats a <path>?

[pure cairn]

Yeah

Basically

[dusky maple]

that's really interesting, that way you can change color easily too right?

[pure cairn]

You can change it with fill or directly in the svg properties if you're working on html instead of css

As you can see in
<path fill="#45a366"... >

[dusky maple]

yeah

[wintry cape]

@eager heart

[dusky maple]

blud got hacked @eager heart

[subtle sedge]

vban 1

[cloud jolt]

Done!

banned @fierce iris

[subtle sedge]

vunban 1439805786455932939

[cloud jolt]

Done!

Unbanned santos.emp11 (@fierce iris)

[dreamy osprey]

is there a way to make it where people who mute them selfs show as a diffrent color

[echo frost]

only with :has() which can be laggy

[echo frost]

what part of them do you want to be a different color?
this will make them have a red background

.voiceUser__07f91>.content__07f91:has(>.icons__07f91
  >.iconGroup__07f91>svg>path[d^="m2.7 22.7 20-20a1 1 0 0 0-1.4-1.4l-20"]
) {
  background: red;
}

and it could potentially cause a bit of lag

but this shouldn't be too bad

[dreamy osprey]

was hoping for the mic with a line through it but that could work

[echo frost]

oh just change the color of the icon?

I don't think that'll need :has()

what about deafen?

[echo frost]

so just make the mic and cross red?

.voiceUser__07f91 svg {
  color: var(--icon-voice-muted);
}

like this?

.voiceUser__07f91 svg {
  color: orange;
}```

and you can use a hex color if you want

like #ffff00

[dreamy osprey]

nice ty

[echo frost]

and quickcss will have a color picker if you hover over that

or you could use an online one

if you want a specific color

[sonic oyster]

how do i hide badges

[echo frost]

the ones in profiles?

oh theyu left

[pure cairn]

[half crystal]

God that's a great emoji

[echo frost]

guy

[jovial arrow]

is there a way to increase the brightness / decrease transparency of the ping highlight without changing its color could someone smarter than me assist

[echo frost]

it would be better to just change the color

[echo frost]

test

[echo frost]

You can use relative color space functions, and either replace the h s l or alpha variable or use calc() to do a math operation on them

I just realized that this will override other colors like the color when replying or jumping to a message, etc., so those other colors will also have to be redefined, or you should redefine the --message-mentioned-background-default and --icon-feedback-warning variables instead
~~```css
.mentioned__5126c {
background: hsl(from var(--message-mentioned-background-default) h calc(s2) calc(l1.2) / calc(alpha / 2));
&::before {
background: hsl(from var(--icon-feedback-warning) h calc(s2) calc(l1.2) / calc(alpha / 2));
}
}

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

you can also use oklch which is a more perceptually uniform color space, but might be slightly different (but should be fairly straight forwards) than what you're used to https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/color_value/oklch

[scenic urchin]

Does anyone know the CSS Div ID for slash command box

[echo frost]

do ctrl+shift+i and then use select element on it

[echo frost]

does anyone know what a .nitroMessage__5126c is?
it's a type of message highlight (like the mention highlight etc.,), but i don't know when it appears or if it's even implemented

ig it doesn't really matter actually
I can see what it looks like by just adding the class to a message

[pure cairn]

I hope it's not some new bullshit they're implementing for nitro users to make their message backgrounds ✨prettier✨

[echo frost]

i feel like i've seen it before, but not sure where

[agile ice]

hey guys, any css that will hide the Gift Nitro button (any maybe some of the others too?)

[brazen quartz]

https://codeberg.org/ridge/Discord-Adblock

[clear siren]

I wonder how many people actually use the nitro gifting button there

[chilly knoll]

this is what I use idk if it still works

/* Hide Nitro gift button */
[aria-label="Give a Gift"],
[aria-label="Send a gift"] {
  display: none !important;
}

[chilly knoll]

i dont think anyone does tbh

or maybe like 0.00000001% of discord users do

[agile ice]

Yup ty this is similar to what I used:

div[class*="buttons"] div[role="button"][aria-label="Send a gift"],
div[class*="buttons"] div[role="button"][aria-label="Open sticker picker"],
div[class*="buttons"] div[role="button"][aria-label="Open GIF picker"],
div[class*="buttons"] div[role="button"][aria-label="Apps"] {
    display: none !important;
}```

btw how did you format that code block to have syntax highlight?

[scenic urchin]

I'm having an issue because it's a pop-up I've checked the entire html source also

[echo frost]

does it disappear when you open devtools?

try using f8break plugin

[scenic urchin]

No it doesn't disappear only when I click out of the window

[echo frost]

?

[echo frost]

i'm not sure what you're having trouble with

my devtools was being a bit laggy

[scenic urchin]

I'll try again later with a force closed client thanks. It also freezes when i use filter

[echo frost]

idk what you mean by a force closed client

filter can be laggy because there's a ton of variables

[primal hedge]

i need opinion on that pretty please

[subtle crater]

how would i set font size for all parts of discord to 13?

im using the cozette font

body {
    font-size: 13;
    font-smooth: false;
    --font-primary: "CozetteVector", "system-ui", "JetBrainsMono Nerd Font";
    --code-font: "CozetteVector", "monospace";
}```
this is what im using to set fonts but its not working

i see that someone got it working #🧊-off-topic-iceman-only message

but thats on linux so its probably not the vector version

[chilly knoll]

put the language after the first 3 backticks

[hazy tinsel]

i feel like that can be simplified btw

[aria-label="Send a gift"], 
[aria-label="Open sticker picker"], 
[aria-label="Open GIF picker"], 
[aria-label="Apps"] { display: none !important; }```

doesn't need the button definitions there's no way those labels are linked to other things

[onyx mesa]

can they stop changing random ass var names for no reason

[brazen quartz]

What did they change?

[pure cairn]

^

[gleaming vortex]

looks cool

[calm rain]

how do I change the dm discord icon in the top left with custom theme?

to a custom icon

[hazy tinsel]

[data-list-item-id="guildsnav___home"] > [class*="childWrapper_"] {
  fill-opacity: 1;
  background: url("https://i.pinimg.com/236x/17/bf/c2/17bfc213da4454f840f099843b66acbb.jpg") center/cover no-repeat;
}```

pretty sure its like this

[calm rain]

it doesn't work or I'm just stupid at css

still the discord logo

[pure cairn]

Check if you have the ThemeAttributes plugin enabled

[calm rain]

now I do and it works but the old discord logo is stil there

[pure cairn]

add

svg { display: none; }

Before the closing }

[data-list-item-id="guildsnav___home"] > [class*="childWrapper_"] {
  fill-opacity: 1;
  background: url("https://i.pinimg.com/236x/17/bf/c2/17bfc213da4454f840f099843b66acbb.jpg") center/cover no-repeat;
  svg { display: none; }
}```
Like this

[calm rain]

it works but it's a bit too zoomed out

[pure cairn]

Use background-size to adjust as you see fit

Usually 70% 70% looks fine

[burnt lake]

Are there any plugins or something on GitHub that allows you to create your own local overlays for your profile?

because Discord doesn't release black ones at all, and in my S.W.A.T. style

[primal hedge]

lowk they should add this into decor, but im pretty sure there is none on git

[pure cairn]

if it's just local then it can be done with css

no need for a plugin

[calm rain]

this text is a bit unreadable. what is the colour value called?

oh and I'm noticing not all text use my selected font. why is that?

[pure cairn]

.member_c8ffbb,
.member__5d473 {
    /* replace USERID with your ID */
  &>.nameplated__91a9d:has(>.memberInner__5d473>.avatar__91a9d>.wrapper__44b0c>.mask__44b0c>foreignObject>.avatarStack__44b0c>.avatar__44b0c[src*="USERID"])>.container__4bbc6 {
        /* customize image here */
        background: url("add image link here") center/cover !important;

        &::after {
            position: relative;
            content: "";
            /* play around with the gradients until you find something that you like */
            background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.08) 20%, rgba(255, 255, 255, 0.08) 50%, rgba(255, 255, 255, 0.2) 100%);
            mask-image: linear-gradient(to right, rgba(0, 0, 0, 0.3) 220px, rgb(0, 0, 0) 270px);
            width: inherit;
            height: inherit;
            display: flex;
        }

        &>.img__4bbc6 {
            display: none;
        }
    }
}```
have fun

[chilly knoll]

is there a way to see all places discord uses an icon at?

like without having to manually look at the entire app

[calm rain]

what about the ugly blue active color?

[pure cairn]

set the background-color to transparent

https://github.com/nvhhr/discordcss/blob/main/snippets/swaphomeicon.theme.css

[lunar hamlet]

swaphomeicon.theme.css:

/**
 * @name swaphomeicon
 * @author nvhhr
 * @description replace home icon/dm button with custom image
*/

/* set a background-image on dm button */
[data-list-item-id=guildsnav___home] > [class*=-childWrapper]
 { background-image: url("https://i.imgur.com/ekIk6Ux.png");
   background-position: center;
   background-repeat: no-repeat;
   background-size: 70% 70%; /*adjust as you see fit*/
   svg { display: none; }} /*remove discord logo from top leaving only background*/

[pure cairn]

I'm using a small edit of this