learn typing idiot
#🎨-theme-development
vast delta
strong mortar
Running
@import url(//dablulite.github.io/css-snippets/HorizontalServerList/import-topbar.css);
(dablulite's horizontal server bar).
Doesn't seem to work well with BetterFolders, it keeps yeeting the folder icon so I can't actually close the folder if I open the wrong one, any ideas?
vast delta
turn off the sidebar stuff in the plugin
strong mortar
Tried that, no change. Well, I might need to reload rq. Lemme try that
Had to reload first nvm. Thx
strong mortar
Hey, So I rotated the Read All button from ReadAllNotifications, Any way to rotate just the text so I can have the button rotated but the text is readable?
Was trying text-orientation but doesn't seem to affect it
.button-ejjZWC.lookFilled-1H2Jvj.colorBrand-2M3O3N.sizeMin-3Yqxk5.grow-2T4nbg{
background-color: #111214 !important;
color: #a5abb3 !important;
font-weight: lighter !important;
text-align: center !important;
transition: color 0.2s,background-color 0.2s;
transform: rotate(270deg);
}
.button-ejjZWC.lookFilled-1H2Jvj.colorBrand-2M3O3N.sizeMin-3Yqxk5.grow-2T4nbg:hover{
background-color: red !important;
color: white !important;
}
.button-ejjZWC.lookFilled-1H2Jvj.colorBrand-2M3O3N.sizeMin-3Yqxk5.grow-2T4nbg {
border-radius: 10px;
font-size: 8px;
margin-left: -15px !important;
text-transform: uppercase;
}
That's two snippets I merged together
Produces that and it glows red when hovered, which is neat.
But would be great if it read Read All, going top down.
vast delta
open your console, choose click on element and click on the text, then do the rotate on the parent object of that text
vast delta
if you are using my snippets, the link is boutta change again lmao, it wont change again after that though since im moving to github pages (lets hope so)
vast delta
it works, just replace the old link before the file name with https://coolesding.github.io/shiggycord/Deploy/
rugged echo
now its deploy
rugged echo
is it possible to make unavaible emojis and stickers gray again with fakenitro? like with css but I haven't tried
because I don't want to accidentally send an emote that isn't avaible because of boost and getting like banned or something, if not well I guess I will not send anything
sorry thats not how you type available
vast delta
now its deploy
and GitHub.io
vast delta
@grand surge if you wanna post your CSS snippet in #🎨-css-snippets please post it here inside a Codeblock like this
```"css
.object {
property: true
}"```
nevermind it doesn't work
use ``` instead of "
vast delta
what the hell is happening with that Codeblock lmao
grand surge
I'll do it later
safe python
what the hell is happening with that Codeblock lmao
discord has amazing markdown parsing
dark dragon
Does this work maybe?
.class {
property: value
}
nope
*css .class { property: value; } *
slim pond
rugged echo
and GitHub.io
but there was already a github.io import, or thats what I remember
vast delta
good one
slim pond
thanks, made it mostly because it bothered me, seeing 2 bars, where there could have been only one, like in macos
slim pond
I also made this
vast delta
mm nice
slim pond
mortal mantle
im testing it
but it makes everything else be pushed down a bit
and imagezoom plugin also doesnt work
slim pond
ye, I had to do some crazy tomfoolery to get it where it is
elfin glade
my first try.
elfin glade
little update.
slim pond
does this have a certain use case (for example: action importance or smth), or is it simply a recolor?
if it doesn't, you could try coloring some of the icons with colors that are know to match these icons
(idk, just giving ideas, im too bored to do anything)
elfin glade
does this have a certain use case (for example: action importance or smth), or i...
just recolor.
slim pond
hmm, very nice
elfin glade
thanks
mortal mantle
never have I thought there would be a day I multiply a variable by minus 1
honestly this looks way better than whatever i created last month
slim pond
noice
slim pond
that then changes to this when a clorway is active?
mortal mantle
Top one
vast delta
imagine doing hover effects, c r i n g e
slim pond
Imagine not doing hover effects
mortal mantle
huh
vast delta
uhh, role went poof?
yus :(
mortal mantle
What happen
little agate
o
vast delta
sad shigging
mortal mantle
soon™️
vast delta
you can actually use shiggycord now, I "released it" (which means I feel comfortable enough with my code to not immediately die in a hole as soon as someone tries it and sends me 184828 screenshots of issues)
mortal mantle
I imported the radial statuses from your deploy tabs but I think its better if I reupload that code in my repo instead
in case there are any changes to the naming of your files
teal cave
good ol' reliable gh pages
vast delta
I got source for the source code and I'm gonna automatically minify deploy from source
vast delta
You will hate me immediately
no variables?
teal cave
is it a private repo bc can't' find it
mortal mantle
It makes syncing easier ig
teal cave
Looks fine imo just lack of comments is a little skulley
also I'd say use scss since this could do with splitting up into more files, but if you've got a system down for organisation then eh
edgy sentinel
honestly if you just want splitting you could just write a super simple script that globs all css files and just appends them to one file
don't need scss
teal cave
true I just like introducing scss because it's cool and good in other ways also
dark dragon
Or you could be the one to write up a cli tool to quickly template a theme with post css
You could be that hero
edgy sentinel
why would i
mortal mantle
tbh I don't know any other languages than css and some C at this point
much less how to organize things
dark dragon
why would i
you could be my hero, baby?
edgy sentinel
nuh uh
I feel like anyone who taught themselves css can also teach themselves how to make that
even if u don't know coding it's not hard to just google how to list files in a dir, how to read files, how write files
and just put it together into some script
python, js, even cmd or bash
mortal mantle
Most themes I have seen uses the BD scaffold thing
dark dragon
dark dragon
Most themes I have seen uses the BD scaffold thing
That's probably Gibbu's one, it's nice quite nice to use. I've not tried Salt's, but I believe it compiles for Vencord too, so it might be worth a look if you're interested
teal cave
My compiler is specifically for compiling into quick css folder on all client mods, imo it's a bit jank way to theme dev and I'd recommend Gibbu's for that purpose instead
remind me to PR vencord support to Gibbu's compiler at some point
edgy sentinel
huh, why do you do it via quickCss?
obviously for old vencord, but now and for other mods I don't think there's a benefit is there?
teal cave
I don't theme dev via quickcss, I use it to write and sync quickcss across all the client mods
mortal mantle
i have been theme devving via quickcss the entire time 😭
teal cave
ig use my compiler if it fits your workflow lol
edgy sentinel
I don't theme dev via quickcss, I use it to write and sync quickcss across all t...
oh i see, that's pretty clever ig
mortal mantle
ig use my compiler if it fits your workflow lol
i will check it out, thanks a lot
gilded radish
hey, can someone please give me a selector for the attach button?
vast delta
click it using your devtools click on element function, than choose what suits you best
if you wanna move it, you go to the highest parent element that only has that icon, if you wanna change the icon you probably want to find an svg
gilded radish
if you wanna move it, you go to the highest parent element that only has that ic...
nah I just want to remove it from existance
vast delta
yeah then click it and choose the highest one that includes only that thing
edgy sentinel
why do u wanna remove the upload button....
vast delta
display: none is your weapon of choice
edgy sentinel
gilded radish
well I think I'm dumb but I don't see the selector
gilded radish
why do u wanna remove the upload button....
- Drag and Drop
- I never use apps
- only I listen to my spotify playlist
vast delta
well I think I'm dumb but I don't see the selector
copy the class of sans attachbutton
don't ask about it's name, might be an Undertale Reference
gilded radish
this one?
vast delta
yup, you can ignore the inner part
gilded radish
aight lemme try
edgy sentinel
copy the class of sans attachbutton
sans = without
gilded radish
nah fam it's
.objectname {display: none;}
mm minified
vast delta
attachwrapper or uploadinput is the parent you want
mortal mantle
why do u wanna remove the upload button....
I second this ...
glossy aurora
nah fam it's
```css
.objectname {display: none;}
```
clearly you dont minify
.objectname {display:none}
eww unreadable code
glossy aurora
yeah i thought we were minifying
gilded radish
no it needs the space
mortal mantle
nah fam it's
```css
.objectname {display: none;}
```
you dont need the semicolon
nor the space
gilded radish
anyways on that selector
gilded radish
THANK YOU SM
glossy aurora
yop
mortal mantle
don't you love legible code
teal cave
Minifying your quickcss 
mortal mantle
you are the one doing it all the time ...
teal cave
because I don't look at the css once generated 
mortal mantle
omg
vast delta
because I don't look at the css once generated <:thumbsup:1109900336912662538>
performance=clearvision
gilded radish
just write every single element and then one display none only
nah
vast delta
just write every single element and then one display none only
god no...
gilded radish
i'ma keep it like this and trigger people
vast delta
the inefficiency
gilded radish
yeah that's just inefficient
mortal mantle
teal cave
performance=clearvision
don't compare me to clearvision :(
mortal mantle
this is the epitome of efficiency
vast delta
don't compare me to clearvision :(
:)
vast delta
this is the epitome of efficiency
exactly how my stuff looks
vast delta
exactly how my stuff looks
teal cave
this is the epitome of efficiency
I recently split my border-radius: 0 thing with 800 selectors into blocks of 10 selectors each, because there comes a point where inspecting one of those elements fucking kills devtools because theres so many selectors shown at once
so uh, cautionary tale
vast delta
I recently split my `border-radius: 0` thing with 800 selectors into blocks of 1...
lmao
teal cave
gilded radish
I like how at the end of this there's just one dependency line lmao
mortal mantle
this will give me nightmares tonight
teal cave
gilded radish
this will give me nightmares tonight
you're welcome 
teal cave
no more nightmare 😌
vast delta
https://github.com/MiniDiscordThemes/Squared lol
call this theme border-radius 0% please
vast delta
I like how at the end of this there's just one dependency line lmao
you're still using old radialstatus? yucky
gilded radish
you're still using old radialstatus? yucky
idk the only places where it's broken I hid, I don't need new radial status
teal cave
call this theme border-radius 0% please
it used to be called BorderRadiant (as in border-radiun't) but eh found it too wanky
mortal mantle
radial status my love
vast delta
radial status my love
my variables are great
fun fact, whenever you import default variables get set so you can remove the ones you haven't changed, I can say from memory your glow and large thickness are default
teal cave
radial status my love
Are old RadialStatus vars compatible with your version? Thinking about possibly switching
vast delta
Are old RadialStatus vars compatible with your version? Thinking about possibly ...
yeah
well the phone doesn't exist
mortal mantle
old variables but completely rewritten
vast delta
and I put more variables, you can check them at the top
teal cave
Cool and good, I'll see how it hehaves with my themes that use old RS
gilded radish
https://github.com/coolesding/shiggycord/blob/v2/Deploy/Radialstatus.css
do I still need a @import?
vast delta
https://github.com/coolesding/shiggycord/blob/v2/Advancedvariables.css
variable hell
gilded radish
actually
mortal mantle
too much
gilded radish
nvm it tanks my performance
vast delta
Cool and good, I'll see how it hehaves with my themes that use old RS
it changes how rs works
vast delta
nvm it tanks my performance
it tanks performance?
gilded radish
yeah
teal cave
it changes how rs works
Its all boxshadows now, right?
vast delta
probably the box shadow stuff
vast delta
Its all boxshadows now, right?
yep
gilded radish
probably
mortal mantle
https://github.com/SEELE1306/SEELE1306.github.io/blob/main/Modular/modular.theme.css
i feel like this much is enough
teal cave
Should be aight then, especialy with glow being an integrated feature
vast delta
https://github.com/SEELE1306/SEELE1306.github.io/blob/main/Modular/modular.theme...
I sent my advanced variables, look how little main variables there are
https://github.com/coolesding/shiggycord/blob/v2/Shiggycord.theme.css
vast delta
Should be aight then, especialy with glow being an integrated feature
I love the glow haha
I discovered in on accident and immediately went "this is a feature now"
gilded radish
I'm so glad I didn't upload my theme to the BD website
mortal mantle
only upload it to the vencord website
teal cave
I discovered in on accident and immediately went "this is a feature now"
best way to make cool features :D
edgy sentinel
https://github.com/coolesding/shiggycord/blob/v2/Deploy/Radialstatus.css
you should try to eliminate the aria label selectors
teal cave
I'm so glad I didn't upload my theme to the BD website
Oh how so?
vast delta
you should try to eliminate the aria label selectors
I started doing so one time then I forgot to continue hahah
mortal mantle
whar there are aria-label selectors?
mortal mantle
i'm on german and i havent seen any problems with the snippet so far
vast delta
must be broken a little
mortal mantle
still works as intended
vast delta
I tried it on German and idle/dnd didn't work
I fixed chat and memberlist
click on my profile
mortal mantle
idle yeah
vast delta
hm interesting
mortal mantle
i love catppuchin colors
vast delta
oh I checked, there is one place with unfixed aria labels and that's one of the small avatars, no idea where though
might be DM list
vast delta
nope, im checking myself right now
might actually be typing avatars
no idea where i got .avatar-2MSPKk
gilded radish
Oh how so?
I would've had to credit like 30 people for @imports lmao
teal cave
I mean you probably should be crediting people regardless of where you post, if that's what the import authors want lol
gilded radish
yeah I would but the problem is I don't remember which is which and stuff
vast delta
I mean you probably should be crediting people regardless of where you post, if ...
i made a lotta snippets based on the ideas/ some basic code from other snippets
vast delta
yeah I would but the problem is I don't remember which is which and stuff
same
for example would i have to credit the original radialstatus? no line of code is the same (unless coincidental)
gilded radish
yeah true
I'm gonna put it on GitHub and link it here, if anyone sees their snippet they can DM me and tell me to credit them
teal cave
Eh it's still just nice to put a "Thanks to (name) for inspiration", if the whole project has been ship of thesus'd
gilded radish
yeah but I have no idea who are the people that inspired it
mortal mantle
i will credit as many people as i remember tbh
teal cave
oh you talking about a bunch of local imports?
mortal mantle
my theme , in the end, is just a compliation of hundreds of snippets from this server
gilded radish
yeah all these imports
gilded radish
my theme , in the end, is just a compliation of hundreds of snippets from this s...
mostly same here
teal cave
if it's stuff from #🎨-css-snippets then yeah no need to credit, since it's all CC0
mortal mantle
this is my baby when it first started
gilded radish
hey does this make any sense
teal cave
looking crisp 👌
teal cave
hey does this make any sense
I'd change "I will add you to the CSS" to "I will credit you" bc rn it has a you're going to brazil vibe lol
gilded radish
oh cool thanks!
mortal mantle
i love how many theme devs all agree on one thing
separating chat elements is the way to go
gilded radish
wdym by that?
mortal mantle
like separating channel list, member list and chat section in their own bubbles
edgy sentinel
I'd change "I will add you to the CSS" to "I will credit you" bc rn it has a `yo...
that's a good thing
gilded radish
ah
mortal mantle
makes the layout much cleaner imo
edgy sentinel
BRAZIL THEME
gilded radish
yeah true
edgy sentinel
someone make that please
mortal mantle
rini theme
edgy sentinel
please make Brazil theme
mortal mantle
bet
edgy sentinel
@alpine cove will use
gilded radish
BRAZIL THEME
nah nah this is Romania theme
teal cave
like separating channel list, member list and chat section in their own bubbles
I think something wrong with me bc I haven't done this on any of my themes
I'm all about fat borders to separate stuff
gilded radish
uhhh can someone help me make an @import
teal cave
for what porpoise
mortal mantle
link doesnt even work
gilded radish
it brings back the DTM 2016 Profile layout
gilded radish
link doesnt even work
oh yeahhh, I made the repo private
mb
actually I don't even know if this works
mortal mantle
upload it onto github, get the raw file and copy link
gilded radish
nah nvm doesn't even work lmao
mortal mantle
then do @import url(link);
gilded radish
upload it onto github, get the raw file and copy link
@import url(//raw.githubusercontent.com/SeanHarmanis/SeansTheme/main/SeansTheme.theme.css);
would this work?
mortal mantle
remove the : before the bracket
gilded radish
cool
slim pond
hey does this make any sense
it also depends on the licenses that those snippets are incensed under, if that even makes any sense for css (I have no idea about legal sh*t)
slim pond
```css
@import url(//raw.githubusercontent.com/SeanHarmanis/SeansTheme/main/Sean...
not on bd, if you also target that
bd only accepts gh page urls for safety purposes, smh
it also gives me a good enough reason to almost never ask for credits for my snippets
dablulite.github.io, it's free real estate
slim pond
like separating channel list, member list and chat section in their own bubbles
your theme is literally the only one that I like when it comes to that, it just hits perfectly, the sizes, the positions, everything
edgy sentinel
bd only accepts gh page urls for safety purposes, smh
(there is no safety gain from not allowing raw.githubusercontent.com)
slim pond
figured as much, but the question still remains
alpine cove
i love imposing arbitrary limitations on my client
slim pond
that's exactly what this is tbh
edgy sentinel
i love imposing arbitrary limitations on my client
oh it's not a limitation they impose
raw.githubusercontent.com doesn't send the correct content type, it sends text/plain
slim pond
oh right
edgy sentinel
raw.githubusercontent.com doesn't send the correct content type, it sends text/p...
the browser only allows loading stylesheets with proper mime type
edgy sentinel
vencord uses electrons net request interceptor to change the content type to css for stylesheet imports. that makes github raw and other sources not serving the proper content type work
delicate tusk
I remember reading-
i finally won it
rugged echo
bd only accepts gh page urls for safety purposes, smh
how is that not secure? like its literally the same as using github.io lol
gilded cloak
raw.githubusercontent.com doesn't send the correct content type, it sends text/p...
@rugged echo it's actually because they are lazy, look at replied message
rugged echo
oh, well I didn't read too much, so they just don't want to do it
teal cave
I gotta stop making/adopting themes
mortal mantle
I am definitely not sane
mortal mantle
is this explanation enough for the average user to understand?
vast delta
is this explanation enough for the average user to understand?
probably
mortal mantle
glad to hear 
mortal mantle
which one
mortal mantle
#vc-spotify-player [class*=barFill]
unkempt silo
welp thats even better
strong mortar
Howdy.
.timestamp-p1Df1m {
order: 2;
}
.badge-3UWq-U[aria-label="This is a @silent message."] {
order: 1;
}
Trying to make the "Silent message" icon appear before the timestamp. Not working as intended
what am I too weak in my css-fu that I messed up on?
small asthetic I know but it looks weird when I use the snippet that allows the timestamp to hide unless hovered on
Timestamp is hidden in that gap until I hover over
vast delta
Howdy.
```css
.timestamp-p1Df1m {
order: 2;
}
.badge-3UWq-U[aria-label="This...
order only works if the parent is flex I believe
vast delta
you can set the parent object as flex lol
strong mortar
display: flex !important;
bless ur soul lemme try that rq
Yep! that seems to do the trick!
.header-2jRmjb {
display: flex !important;
}
.timestamp-p1Df1m {
order: 2;
}
.badge-3UWq-U[aria-label="This is a @silent message."] {
order: 1;
}
Any better way to clean that up or is that probably ok enough
vast delta
try using something else than aria label
you can also try removing the .badge entirely and just have .timestamp with an order value, I think order defaults to 0
strong mortar
Yep, seems that also does the cake.
.header-2jRmjb {
display: flex !important;
}
.timestamp-p1Df1m {
order: 1;
}
a bit cleaner
open cove
Hey guys! I was wondering how I could edit my theme so that the preview images are bigger because right now they are incredibly small
slim pond
my brain is not braining anymore with this css
mortal mantle
I really like the idea of moving the channel name up to the titlebar
but your snippet is not so compatible with my current layout 
things look kinda sussy once i imported
mortal mantle
@vast delta did you switch up something in your snippet
these two items now sho different colors
vast delta
it shouldn't
looks like you might be missing variables
wait no that's just online color
mortal mantle
Yeah idk why that happened
mortal mantle
I will check later, not on PC atm
vast delta
oh god i just checked, yeah my rs tanks performance hard lol
gilded radish
hey, quick CSS question: is there any way to remove everything but the hour from the timestamp?
vast delta
technically yes but you'd have to hide the old timestamp, make a pseudoelement that looks like the old one and then make a check for each hour to change the content to that hour
i am not helping you any further because its too much work :P
wait it actually works for everything lol
well, ill post this as a snippet for someone to post
write whatever you want with it
glossy aurora
ooh that looks really good actually
mortal mantle
@vast delta I tested out the v3 of radial status and it turned out to be quite bad, the color issue is still not fixed
okay I have figured out the issue, turns out the colors I have placed inside the root file, for some reason override what I have redefined below
weird that it only affects the medium and large status colors, but not the small ones
I switched back to your old version of radialstatus since its more stable
small neat detail to remind me of the work i did in Spotify Wave
vast delta
<@406084422308331522> I tested out the v3 of radial status and it turned out to ...
what exactly didn't work?
do you have everything turned on in platformindicators?
I can't explain myself why something would be broken for you unless something in your theme changes the box shadow and border color on avatars
mortal mantle
I change the colors for the --rs-online variable, but the change only showed for profiles in chat, not for profile panels and modals
these are the only extra settings i have for radial status:
/* 15. [[ RADIAL STATUS ]] */
.contents-2MsGLg .avatar-2e8lTP {
margin-top: -0.625em;
}
.memberInner--L4X2b .avatar-6qzftW,
.scroller-WSmht3 .avatar-1HDIsL {
margin: 0 0.5em 0 0;
}
.avatarHoverTarget-1zzfRL,
.avatar-3QF_VA {
background: var(--profile-body-background-color);
}
.avatarHoverTarget-1zzfRL img {
border-radius: calc(var(--rs-medium-roundness)/2);
}
.avatar-3QF_VA img {
border-radius: calc(var(--rs-large-roundness)/2);
}
rs does the exact same border radius thing for you
and you haven't played with the variables in there
oh you said these are the extra settings
maybe it's selector specificity? but that would be weird
can you check on the avatars that aren't working if the imported variables from rs overwrite yours?
mortal mantle
post your snippet here first then
rugged echo
hey gui z do you like my snippet
* { transform: skew(1deg); }
cinder valley
post your snippet here first then
sure, wait
/* Blurs the tab when not in focus (might become laggy) */
html:not(.app-focused) {
filter: blur(4px);
transition: filter 400ms ease-in, filter 550ms ease-in;
}
html:not(.app-focused) #app-mount::after {
content: "";
z-index: 200;
position: fixed;
background: rgba(0, 0, 0, 0.5);
width: 100%;
height: 100%;
}
html.app-focused {
filter: blur(0);
transition: filter 400ms ease-out, filter 550ms ease-out;
}
jump to present button changed (from one of my old snippets posted here) (now works with any theme)```css
/* Jump To Present Bar Revamp /
[class="jumpToPresentBar"] {
display: contents;
}
[class*="jumpToPresentBar"] > button:first-child {
display: none;
}
[class*="jumpToPresentBar"] > button:last-child {
position: absolute;
z-index: 1;
bottom: 24px;
right: 22px;
padding: 8px !important;
height: auto;
background-color: #2e353b20;
box-shadow: var(--elevation-high);
border-radius: 100px;
display: flex;
font-size: 0px;
color: transparent;
transition: font-size .2s .1s, color .2s, padding .4s .1s;
}
[class*="jumpToPresentBar"] > button svg {
order: -1;
margin: 0px;
height: 24px;
width: 24px;
top: auto;
margin-right: 0px;
margin-left: 0px;
color: #FFFFFF;
transition: margin .6s;
}
[class*="jumpToPresentBar"]:hover > button {
padding: 8px 18px !important;
font-size: 14px;
color: #FFFFFF;
transition: font-size .2s, color .2s .1s, padding .4s;
}
[class*="jumpToPresentBar"]:hover > button svg {
margin-right: 2px;
margin-left: -6px;
}
these are 2 i was wanting to send
vast delta
looks good
mortal mantle
Attach an image of what you are trying to customize so others know whether they should use the snippet or not
cinder valley
Attach an image of what you are trying to customize so others know whether they ...
oh my god the quality sucks
💀
vast delta
oh my god the quality sucks
lmao
cinder valley
i dont know how else to take a gif screenshot
mortal mantle
I don't think shareX 's quality would be that horrible
cinder valley
oh wait i got perms i didnt even notice
slim pond
why is the button transparent?
mortal mantle
sneak peak of whats possible with v1.0.0
i might release the official version within the next days if i'm not busy
slim pond
pseudo tooltips
mortal mantle
Whar
slim pond
these are pure css
mortal mantle
Very nice
slim pond
teal cave
Does Vesktop have quickcss? I can't find it lol
teal cave
Yeah it's not in the VencordDesktop folder
edgy sentinel
inside settings
teal cave
wait I am have stupid, did not see VencordDesktop inside VencordDesktop lol
edgy sentinel
it might not exist if you never used quickcss
lolol
yes it's nested folders
cause the normal one contains so many electron files
so i made a nested folder so it's tidier
edgy sentinel
why do u even use all of these
clearly you should just be using vencord
nah seriously tho
is there any reason
teal cave
I like having my qol tweaks while testing themes on all the mods, that's pretty much it
edgy sentinel
ohhh that makes sense
wouldn't it be better to test themes without any other changes tho
to make sure your quick css doesn't conflict or smth
and so your screenshots are 'pure'
teal cave
it's stuff like reordering the settings menu, shortening context menus, adding a dark/light mode indicator, doesn't really conflict with anything
edgy sentinel
icic
teal cave
and then when I need a clean screenshot I just comment out the @forward lines in main.scss and build
teal cave
nop, bundles into asar instead
edgy sentinel
okay but is there any way for users to install bd themes
teal cave
there's a tool to convert bd themes into asar, but it's not built into replugged and like 3 people on earth know about it
teal cave
the one click installer is nice and if a dev deletes the theme repo it doesn't immediately nuke the theme for people who already have it (which happens for most bd themes that use @import)
edgy sentinel
one click installer?
teal cave
ye on the website, clicking install automatically puts the asar in the right place if you have replugged https://replugged.dev/store/net.saltssaumure.Exponent
though ig you could implement that for .theme.css files as well
mortal mantle
guh radialstatus feels kinda taxing on my machine now, i may leave that as an optional add-on for end users
teal cave
please tell me you get a confirmation in client
I don't know because I've never gotten it to work 
edgy sentinel
lmaoo
teal cave
o wait I think its supposed to https://github.com/replugged-org/replugged/pull/514
vast delta
guh radialstatus feels kinda taxing on my machine now, i may leave that as an op...
that's why I made v3
please send me your entire CSS setup that isn't working with v3 so I can see why that is the case
mortal mantle
also, there happen to be bugs where the radial status inside DM lists don't display properly
group dms show offline color whereas normal users would have 2 borders
mortal mantle
are you trying to place your pfp there
mortal mantle
whar, github desktop keeps refusing to push my commits, meanwhile the git push command still works perfectly
rugged echo
💀
mortal mantle
the full no import file should have around 3500 lines
rugged echo
doesn't that lag your discord or something
mortal mantle
I will definitely take a long deserved break after this lol
glad urchin
is the plugin to replace the default css done
pretty sure with that css file, you are doubling the lag
mortal mantle
I will continue tomorrow, i'm tired now
slim pond
is the plugin to replace the default css done
Thats a thing?
open cove
hmm
ive found it but nothing is happening lol
i tried a different one and all it does is move it around
.imageWrapper-oMkQl4
slim pond
border radius go brr
mortal mantle
Streamline everything to one single border radius like me
slim pond
8px
mortal mantle
8px my love
vast delta
I am goat
mortal mantle
no you are coolesding
glad urchin
Streamline everything to one single border radius like me
0px i love
mortal mantle
nuh uh
vast delta
* {border-radius: 0px!important} is your lifestyle
mortal mantle
shiggy is your lifestyle
glad urchin
\* {border-radius: 0px!important} is your lifestyle
so true
wish it was easier on react native
teal cave
vast delta
oh
I'd like to see this screenshot in better quality please
nevermind it's in pinned lol
that was so informing, a shame I can't wrap my head around it lol
dark dragon
Seems to be just an explanation of how and why selectors are evaluated from right to left
vast delta
yes but I can not understand it enough to do anything with it
dark dragon
There's nothing really to do with it, it seems the point being made was just that it's more efficient to use a single selector rather than a chain of selectors
cinder valley
Streamline everything to one single border radius like me
10px hits hard
mortal mantle
8 is the best
cinder valley
i need to look into that
@slim pond could you provide me the class values for those elements?
cinder valley
see the latest commit in my css snippets repo
fair enough
cinder valley
please don't- uegh
try it
slim pond
it hurts
gilded cloak
I hate px, I stan rem
Only ever use px for stroke widths.
mortal mantle
rugged echo
fuck it, -12px /j
mortal mantle
page somewhat done
vast delta
fuck it, -12px /j
wait, what would a negative border radius look like...
I think, we are about to discover the 4th dimension
cinder valley
@slim pond i noticed just one spot
but the other parts seem to be working fine?
maybe you have some other snippets that were conflicting it
slim pond
what spot
cinder valley
the header of threads
slim pond
huh
cinder valley
huh
i apprently missed the header of the threads popout (pretty sure i got that before tho), but i fixed it
slim pond
bruh
mortal mantle
slim pond
there we go
cinder valley
there we go
right click anywhere
fix that background too
the footer of the pin section
thats also not fixed in your snippet
cinder valley
Keeps disappearing
?
cinder valley
im on mobile rn so idk
disable other snippets when you're working on this 
this footer
slim pond
fixed it
cinder valley
cool
rugged echo
I think, we are about to discover the 4th dimension
it should open or something, i have no idea
glad urchin
dynamic titlebar ?
rugged echo
I like how this catches my attention
very good contrast (wtf is that color)
glad urchin
fire
potential plugin idea
was thinking of making the discord titlebar display the same text as native windows one, though i dont know how to do either of those
rugged echo
I mean the channel topic text color isn't very readable in that screenshot, also the buttons because its kinda light
rugged echo
wtf is discord doing with their css?
is there anyway to revert this? it only happens if I don't have full size of the window (its still a bit noticiable even if I click maximize)
I found some element that said overflow: hidden-scroll or something like that but I am not sure
toxic yew
what is wrong in that screenshot?
rugged echo
the bottom of profiles gets like uhhh... cut off because of the screen size, so before I could see the bottom where you have the border of nitro profiles but there you can't see it
toxic yew
ah
mortal mantle
glossy aurora
on one hand this does not fit my current theme at all
on the other hand i totally need this
mortal mantle
h3[class*=membersGroup-] {
color: var(--text-normal);
background: color-mix(in srgb, var(--modular-accent-color) 50%, transparent);
height: 24px;
margin: 0.5em 0 0.5em 0.5em;
border-radius: calc(var(--modular-border-radius) * 0.75);
padding-top: 4px;
font-size: 14px;
text-align: center;
text-transform: none
}
.container-1oeRFJ {
margin: 0.5em 0 0.25em auto;
padding: 0;
background: var(--background-modifier-accent)
}
.container-1oeRFJ:has(span[data-tag="owner"]) {
background: color-mix( in srgb, var(--owner-color) 33%, transparent);
}
.container-1oeRFJ:has(span[data-tag="admin"]) {
background: color-mix( in srgb, var(--admin-color) 33%, transparent);
}
.container-1oeRFJ:has(span[data-tag="staff"]) {
background: color-mix( in srgb, var(--staff-color) 33%, transparent);
}
.container-1oeRFJ:has(span[data-tag="mod"]) {
background: color-mix( in srgb, var(--mod-color) 33%, transparent);
}
replace all the weird variables with a random color
mortal mantle
i could do something like this
dark dragon
You can just role colour. It looks a bit wacky on darker ones though, so might need some tweaks
.username-3_PJ5r::after {
content: '';
position: absolute;
margin: 0;
inset: 0;
background-color: currentColor;
opacity: .25;
width: 100%;
height: 42px;
z-index: -1;
border-radius:4px;
padding: calc(var(--custom-member-list-item-avatar-decoration-padding)/2) 0px;
}
.member-2gU6Ar {
position:relative;
z-index: 1;
}
This is kind of a fun resource that benchmarks the different types of selectors. In almost all cases the the difference is negligible.
There's no need to overthink your selectors, just don't do stupid things like trying to style only your own messages by looping something like this 50 times
.messageListItem-ZZ7v6g:has(.cozyMessage-1DWF9U.groupStart-3Mlgv1):has(.contents-2MsGLg img[src*="<UID>"]) + .messageListItem-ZZ7v6g:not(:has(.groupStart-3Mlgv1))
( you can style your own messages with https://vencord.dev/plugins/ThemeAttributes )
but yeah generally performance doesn't matter much as it's usually negligible
only optimise once it becomes a problem, not prematurely
also damn the results are very inconsistent
dark dragon
That's just a recent example from someone in the BD server. Someone's tried to make a plugin for adding a class to self messages over there too, but it's hideous
tranquil sluice
ello, i have a theme that i'm customising and i want it to have a fade effect with reply backgrounds like the attached image but can't get it to work. anyone got any ideas on how?
mortal mantle
@vast delta can you test out my theme if you have a strong PC setup
slim pond
whar?
mortal mantle
husking is fun
vast delta
<@406084422308331522> can you test out my theme if you have a strong PC setup
"can you test out my theme" and doesnt link it, idiot
works fine
lags a lot when scrolling through channels, the burger menu overlaps with the help icon
the fuck you mean radialstatusv3 isnt working? its literally perfectly fine lol
vast delta
lags a lot when scrolling through channels, the burger menu overlaps with the he...
you silly use the > div selector with an object in the list that is "a"
this would fix it, though the selectors are bad af
this line doesnt even do anything :P .toolbar-3_r2xA > *:hover svg { color: var(--modular-accent-color); }
mortal mantle
Because I hate that * selector
mortal mantle
"can you test out my theme" and doesnt link it, idiot
Sorry sorry ....
vast delta
:3
vast delta
Because I hate that * selector
well without it it doesnt work at all :P
half crystal
this as grid? (e.g no labels, just icons heading horizontally)
torn zinc
the devtools in question
rugged echo
I couldn't remove the text just for those places and not the channels
edgy sentinel
:is(
li[data-list-item-id^="channels___upcoming-events"],
li[data-list-item-id^="channels___upcoming-events"] + li,
li[data-list-item-id^="channels___upcoming-events"] + li + div > li
) .name-28HaxV
{
display: none;
}
li[data-list-item-id^="channels___upcoming-events"],
li[data-list-item-id^="channels___upcoming-events"] + li,
li[data-list-item-id^="channels___upcoming-events"] + li + div:has(> li),
li[data-list-item-id^="channels___upcoming-events"] + li + div > li
{
display: inline-block;
margin: 0;
padding: 0;
}
li[data-list-item-id^="channels___upcoming-events"] .link-1_kTxV {
margin: 0 0 0 8px;
padding-right: 0;
}
:is(
li[data-list-item-id^="channels___upcoming-events"] + li,
li[data-list-item-id^="channels___upcoming-events"] + li + div > li
) .link-1_kTxV {
padding-right: 0;
}
tweak to ur liking
very cursed but works
balmy torrent
compact :o
slim pond
hmm
balmy torrent
oh, it's because i don't have event perms
edgy sentinel
oh
yeah it relies on events being there
cause thats the only one you can meaningfully select
events, channels & roles, members
oh hold on
slim pond
I could try making a more polished version
but I wouldn't think the same about my brain right now
edgy sentinel
:is(
.containerDefault-YUSmu3[data-list-item-id^="channels___upcoming-events"],
.containerDefault-YUSmu3[role="button"]
) .name-28HaxV
{
display: none;
}
.containerDefault-YUSmu3[data-list-item-id^="channels___upcoming-events"],
.containerDefault-YUSmu3[role="button"],
.containerDefault-YUSmu3[role="button"] + div:has(> .containerDefault-YUSmu3[role="button"])
{
display: inline-block;
margin: 0;
padding: 0;
}
.containerDefault-YUSmu3[data-list-item-id^="channels___upcoming-events"] .link-1_kTxV {
margin: 0 0 0 8px;
padding-right: 0;
}
:is(
.containerDefault-YUSmu3[data-list-item-id^="channels___upcoming-events"],
.containerDefault-YUSmu3[role="button"]
) .link-1_kTxV {
padding-right: 0;
}
try this
rugged echo
weird, but it actually works
edgy sentinel
tweak to ur liking
^
rugged echo
wtf is discord doing with their css?
is there anyway to revert this? it only hap...
ok now it shows the bottom
its not enought for the screensize, but at least I can scroll to the bottom or see the bottom of profiles
just in case someone wants (ngl stolen calc)
.userProfileModalInner-3dx9L9 {
max-height: calc(100vh - 100px);
}
silent wadi
honestly what discord's default ui should look like
half crystal
```css
:is(
.containerDefault-YUSmu3[data-list-item-id^="channels___upcoming...
damn thanks!
slim pond
honestly what discord's default ui should look like
eh
slim pond
collapsed icon
slim pond
edgy sentinel
see this shows how subjective taste in themes is cause I find all your changes a downgrade personally
slim pond
see this shows how subjective taste in themes is cause I find all your changes a...
I mean
don't we all have subjective tastes?
I'm just trying things out, seeing what works and what doesn't
(I also accidentally broke Declutter bar)
pov css where it shouldn't be
dark dragon
Discord couldn't be worse
It's not the best, but it shows at least a basic understanding of UX, unlike a the majority of existing themes
slim pond
And tbh, I can see how some would see this as a downgrade
if you don't know what each button does, then you are basically out of luck
you're clicking buttons blindly
slim pond
bettertitlebar and declutterbar now have macos traffic lights variants
mortal mantle
@vast delta i mirrored the theme repo to a better one: https://github.com/SEELE1306/Modular
slim pond
vast delta
border: thicc
slim pond
not a border
vast delta
it looks like a border
slim pond
now hoverable
mortal mantle
but why
slim pond
why not
mortal mantle
guh somehow my chat bubbles snippet just broke
not gonna fix it today though, i'd rather sleep
slim pond
finally found why this was overextending itself
I had to add this to the topic container
silent wadi
/* hides profile elements from own user pop-out - snippet by @seele1306 */
.accountProfilePopoutWrapper-3GskID {
left: 0;
}
.accountProfilePopoutWrapper-3GskID [class*=userPopout] {
border-radius: calc(8px*1.5);
margin: 0;
width: fit-content;
}
.accountProfilePopoutWrapper-3GskID .section-28YDOf,
.userPopoutInner-nv9Y92:has(#account) > *:not(:has(#account)),
.userPopoutOverlayBackground-3A0Pcz:has(#account) > *:not(#account) {
display: none !important
}
mortal mantle
Don't see anything wrong with that
vast delta
I do, it's called light mode
rugged echo
me when sync profile themes (it still looks ugly anyways, but its not that bright)
modest osprey
body:has(.selected-1Drb7Z[data-list-item-id=guildsnav___1015060230222131221]) [id^=guild-][id*=-leave],
body:has(#guild-context-devmode-copy-id-1015060230222131221) [id^=guild-][id*=-leave] {
display: none;
}
trapped inside the server (you still can leave at the top)
strong mortar
Hey, Anyone's "Apps" submenu in the right-click context menu broken after update?
rugged echo
works fine for me
deft escarp
css?
deft escarp
bettertitlebar and declutterbar now have macos traffic lights variants
css?
stuck plinth
yes, css
mortal mantle
css?
check #🎨-css-snippets
slim pond
stop pinging?
deft escarp
no
sry
bdsettings is not working
can you fix this
@slim pond sry again for pings
mortal mantle
stop pinging?
Yes I will ping you :3
slim pond
I don't have bd (finally), so I can't test that snippet
slim pond
Yes I will ping you :3
noooooooo
slim pond
yes
deft escarp
I don't have bd (finally), so I can't test that snippet
oh
exotic nexus
Did you turn it on in theme settings
exotic nexus
Go to the themes section of settings
deft escarp
Go to the themes section of settings
deft escarp
vast delta
@deft escarp you got spelling mistakes in your CSS
@deft escarp its the red lines you see on the side
exotic nexus
Also your theme is in a folder take the css file out of it and into the themes folder
vast delta
@deft escarp you should try going there in your list and checking what has those scribbly red lines below it
vast delta
Also your theme is in a folder take the css file out of it and into the themes f...
they're using vebcord
the themes aren't stored in a folder
vast delta
i just copy/paste
maybe you haven't copying correctly
exotic nexus
the themes aren't stored in a folder
I forgor
deft escarp
maybe you haven't copying correctly
I have copied correctly
vast delta
I have copied correctly
then they seem to have mistakes in the CSS by default, weird
anyways @deft escarp, if you wanna load themes, just press upload file on the theme page and select the file you want as your theme
deft escarp
anyways <@1107685078206791740>, if you wanna load themes, just press upload file...
Ik
deft escarp
then they seem to have mistakes in the CSS by default, weird
can we paste unlimited css in custom css
vast delta
can we paste unlimited css in custom css
Yes we can
deft escarp
Yes we can
Oh thnx
vast delta
can we paste unlimited css in custom css
of course it's gonna start nagging at your performance
deft escarp
of course it's gonna start nagging at your performance
hm
deft escarp
what is your main client?
means
vast delta
what is your main client?
wurst
deft escarp
Bd, vencord?
vencord web
vast delta
that's what I meant with vebcord
slim pond
where did you try the bd settings snippet?
deft escarp
where did you try the bd settings snippet?
in custom css
slim pond
in custom css
no, what client mod
vast delta
vencord web
don't tell me you silly tried using a betterdiscord snippet on vencord
deft escarp
that's what I meant with vebcord
vast delta
<:catlaugh:1142782209451896884>
unnecessary ping
slim pond
it doesn't make any mod settings look like BD's
it changes bd's settings layout
(Though I could make something simmilar for vc)
deft escarp
don't tell me you silly tried using a betterdiscord snippet on vencord
Ahh! yes 
vast delta
I thought besettings means bigdumbsettings
slim pond
lmfao
vast delta
Ahh! yes <:husk:1026532993923293184>
oh I think I just accidentally didn't ping @deft escarp
slim pond
balmy torrent
what happened to the tabbed layout
balmy torrent
uh i'm actually curious when it went
slim pond
whar?
balmy torrent
vencord used to have tabs at the top in its settings
balmy torrent
could've had one vencord page with tabs
similar to this. would be nice and cosy :3
slim pond
collapsible settings when
balmy torrent
hm?
slim pond
collapsible settings categories
mortal mantle
collapsible settings when
Someone already made it :3
slim pond
mortal mantle
slim pond
.statusItem-38ArJn {
padding: 0;
display: flex;
flex-wrap: wrap;
gap: 0 8px;
transition: .2s ease;
}
.separator-12G2Op {
display: none;
}
.description-1Dd2kv {
height: 0;
overflow: hidden;
transition: .2s ease;
align-items: center;
display: flex;
margin-bottom: 0;
max-height: 5rem;
}
.item-5ApiZt:hover .description-1Dd2kv {
height: fit-content;
}
.item-5ApiZt:hover .statusItem-38ArJn {
gap: 8px;
}
try this
mortal mantle
what is that
vast delta
Desktop Benachrichtigungen
slim pond
(code was adjusted for cyan)
mortal mantle
.colorDefault-2_rLdz[id="account-status-picker--online"]:hover {
background: color-mix(in srgb, var(--rs-online-color) 25%, transparent);
}
.colorDefault-2_rLdz[id="account-status-picker--idle"]:hover {
background: color-mix(in srgb, var(--rs-idle-color) 25%, transparent);
}
.colorDefault-2_rLdz[id="account-status-picker--dnd"]:hover {
background: color-mix(in srgb, var(--rs-dnd-color) 25%, transparent);
}
.colorDefault-2_rLdz[id="account-status-picker--invisible"]:hover {
background: color-mix(in srgb, #636b75 25%, transparent);
}
another goated theme attributes moment
mortal mantle
is it? i have no idea
slim pond
it is
mortal mantle
wonder why discord hasnt done that
slim pond
reduced the original cyan to smithereens
cut almost 2k lines of duplicate/useless code
mortal mantle
Hmmm
alpine cove
the hell is SmartMinify
slim pond
what is this tiny resolution
safe python
missing font jumpscare
slim pond
because you have bloated it with crap that don't work properly with it
slim pond
this I have fixed, along with some other issues
dire plank
how did you get that bug hunter badge thing
balmy torrent
enable isStaff in experiments
balmy torrent
yes, it's in plugin settings
dire plank
obviously it is...
balmy torrent
this is discord's own ui though
dire plank
what does isStaff even do tbh
vast delta
you immediately get a monthly salary of insert discord monthly pay and you have to implement stupid features no one wants
deft escarp
you immediately get a monthly salary of `insert discord monthly pay` and you hav...
Bruh!
deft escarp
this I have fixed, along with some other issues
can you fix this glitch in remaster.css
deft escarp
@slim pond also this in import.css
gilded cloak
<@582170007505731594> also this in import.css
You need to add a background to the settings or maybe a backdrop-filter: blur(8px)
It could also be that they do have a backdrop-filter, but your machine doesn't support it.
mortal mantle
use Inspector tool and hover over the error elements to see why
deft escarp
use Inspector tool and hover over the error elements to see why
how to use inspector tool
mortal mantle
Ctrl Shift I to turn on devtools, click on the mouse icon at the top
And hover it over to the element
deft escarp
oh
slim pond
remaster looks fine
even when zoomed
please:
do not ping me
do not ask me for support on something that isn't being caused by the theme itself
rugged echo
you immediately get a monthly salary of `insert discord monthly pay` and you hav...
discord premium
mortal mantle
v1.0.2 soon maybe
slim pond
restructuring colors for more readability
mortal mantle
remove support for BD
slim pond
theme previews (for basic themes) are back
(they were broken since 5.5)
also fixed the nitro themes a bit
slim pond
looks just fine
mortal mantle
maybe my eyes have a problem
but the buttons dont seem to be in a straight line
maybe push them towards the screen corner a bit more
vast delta
remove support for BD <:trolley:1024751352028602449>
I removed BD support from everything I made a long time ago
I'm gonna add a check that does * {display: none} if the client had betterdiscord
edgy sentinel
horror
balmy torrent
nah don't do that lmao
slim pond
cyan rewrite is only compatible with vesktop, since it uses color mix, but normal cyan no, I don't want to make it incompatible with any client
vast delta
I'm gonna make all of you a snippet to add if you wanna unsupport BD :3
mortal mantle
i have never thought of BD support in the first place
mortal mantle
/* Username */
.username-h_Y3Us,
.base-3bcbY3 .text-3S7XCz strong,
.name-3DDHNY {
background: color-mix(in srgb, currentColor 25%, rgba(0, 0, 0, 0.25));
text-shadow: 0 0 5px color-mix(in srgb, currentColor 25%, rgb(0, 0, 0));
filter: brightness(1.25);
margin-right: 4px;
padding: 0 4px;
border-radius: 4px;
}
.username-h_Y3Us::after {
position: relative;
margin: 0 0 0 8px;
color: inherit;
text-shadow: 0 0 5px black;
}
.contents-2MsGLg .username-h_Y3Us::after {
content: "wrote:"
}
.hasReply-2Cr4KE .contents-2MsGLg .username-h_Y3Us::after {
content: "replied:"
}
.mentioned-Tre-dv .contents-2MsGLg .username-h_Y3Us::after {
content: "mentioned:";
}
wait that would mean I'd have to install betterdiscord
mortal mantle
:devilbro:
slim pond
i have never thought of BD support in the first place
bd support = discord support
(for css)
also, my hands are kinda tied when it comes to bd support
mortal mantle
don't update it anymore
slim pond
it updates itself (main import)
summer crater
I'm gonna add a check that does * {display: none} if the client had betterdiscor...
Worst community developer spotted
slim pond
(I am being recorded and my family is being held hostage until I make an actually good theme)
(I will not)
mortal mantle
i'm no longer sane
slim pond
(I will not)
(I cannot, I can only release low effort css snippets that break the moment you use any theme with them)
slim pond
i'm no longer sane
version 1.0.2, rookie number (It is perfectly fine, I am insane, v17.1)
mortal mantle
HORROR
slim pond
mortal mantle
spotify color
slim pond
they are all colored
mortal mantle
nice
slim pond
mortal mantle
change the text below all those statuses to "basically Online, but wants to be edgy"
slim pond
lol
slim pond
this is getting big
vast delta
LMAO I JUST CHANGED THE SELECTOR
it makes the click window of the emote bounce up and down as well
(yes it doesnt look like hypershiggy but shhh, i am not feeling like manually finding out the timings and pixels)
slim pond
NO
grand surge
glossy aurora
you should greay out the message bar too
grand surge
good idea
was going to style it like that
vencord logo top left
Vencord prime
and then blur everything behind it
rugged echo
you need to buy vencord premium to send more than 100 messages a day
glacial barn
hey, are those type of selectors bad?
[class*=scrollableContainer-]