#vector-2022 styling guide?

27 messages · Page 1 of 1 (latest)

languid cave
#

does anyone have a link or source where i can find a styling tutorial for the vector-2022 skin? i've only managed to change the background of the body, but when i tried to edit everything else in the common.css, nothing changed after purging the cache and had refreshing the page. i feel like i am doing something wrong. i don't want to see this grey box background that completely covers the body's background except for the footer. i can't seem to change anything except for body (and #content, though i reset everything by erasing the css because i got frustrated)

light bone
#

if you find one I'm interested as it should be signal boosted

#

one thing I will say is you will get much more responsive results by doing changes in your personal common.css or vector css, the latter is preferable because it will apply overrides to the skin rather than doing stuff to every skin which could be messy

#

you can reach the latter via Special:Preferences, then make changes with the help of the trusty element inspector to see what you need to select which will actually work, which is pretty much the norm in absence of documentation on most skins

#

petra no doubt has a more proper suggestion, I am a barbarian in styling

bronze spruce
light bone
#

duh, didn't even realize it wasn't the skin

languid cave
#

omg i didnt even realize

light bone
#

knew petra would have a much better suggestion when I saw him typing

languid cave
#

see i thought i was using vector because this was in my styling settings

light bone
#

yeah that'll be the default for the wiki, at some point you must have chosen timeless as a user preference

languid cave
#

ohh i believe that was it

#

i see why my css wasn't applying now 😭

light bone
#

that'll do it lol

languid cave
#

and thank you raidarr as well

#

i appreciate it

light bone
#

best of luck

#

still in the market for dedicated skin style guides tho

#

they can be messy to wrangle through by hand

languid cave
#

if i figure it out i can probably make a guide. i have a popular neocities and have shared information on there so it would be easier for me to make a guide

light bone
#

what works for vector won't necessarily for timeless which is another reason why your changes wouldn't have worked despite going through common.css, which applies to all skins

#

if you do come up with that guide feel free to refer to it in see also at [[Help:CSS]]

upper ruinBOT
zenith plaza
sacred flare
# zenith plaza If you write one I'd love to collab! I've been working on one for Citizen as wel...

One tip I would give is that if you are aiming to reuse CSS (e.g. colors), always put them in CSS variables.

Some skins like Vector 2022 and Citizen come with CSS variables. But if you are not using those skins or you need to support multiple skins, define your own so that you can also use them in templates.

Take Tolkien Gateway as an example, the --tg- CSS variables are used across the site:

serene pike