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)
#vector-2022 styling guide?
27 messages · Page 1 of 1 (latest)
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
You are using Timeless instead Vector 2022 btw. There's https://dev.miraheze.org/wiki/Template:Background?useskin=timeless and https://softcell.miraheze.org/ is an often used example for a customized Timeless.
duh, didn't even realize it wasn't the skin
omg i didnt even realize
knew petra would have a much better suggestion when I saw him typing
see i thought i was using vector because this was in my styling settings
yeah that'll be the default for the wiki, at some point you must have chosen timeless as a user preference
that'll do it lol
thank you so much
and thank you raidarr as well
i appreciate it
best of luck
still in the market for dedicated skin style guides tho
they can be messy to wrangle through by hand
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
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]]
If you write one I'd love to collab! I've been working on one for Citizen as well. Could be really useful to (eventually) cover all skins
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:
- Shared CSS variables on MediaWiki:Common.css
- Citizen-specific styles on MediaWiki:Citizen.css
- Timeless-specific styles on MediaWiki:Timeless.css
— or you can copy those variables and paste them onto your common.css