MediaWiki talk:Vector.css

CSS scaled background

Hi, I've done a pixelated background like this on another wiki. I tested it in my user CSS, and it seems to work here too. If you replace the "body" rule in MediaWiki:Vector.css with the one here, you should get the same visual result, but with an image filesize 82% smaller. Or someone with shell access can copy the gif into the skins/Vector/stardewimages/ directory. Either way, it could be a significant bandwidth savings. Rigel Kent (talk) 12:41, 8 July 2017 (BST)

Sorry, just noticed the gif is lossy. I've uploaded a lossless png, larger than the gif, but still a 68% filesize savings from the current png. New "body" rule is here. Rigel Kent (talk) 13:02, 8 July 2017 (BST)

New rules to fix potential inheritance problems. Rigel Kent (talk) 13:40, 8 July 2017 (BST)

Never mind! On closer inspection, this is not a blown-up pixel image - the sky has a smooth gradient, and foreground pixels aren't aligned with background ones. I uploaded a slightly optimized png of the same size. It's only −15% smaller filesize, but better than nothing. Rigel Kent (talk) 13:56, 8 July 2017 (BST)

Edit: Unlinked file for deletion to clear WantedPages. Rigel Kent (talk) 17:59, 11 July 2017 (BST)

Rule to keep images pixelated

Here's a CSS rule I suggest for wikis with a lot of pixel art. The rule keeps pixel edges sharp when zoomed. This covers server side zooming, i.e. [[File:Pixel-art.png|1000px|class=pixels]], and also client side zooming, whether with Ctrl-+, or with hardware pixel ratios — nearly all phones, and many tablets. Rigel Kent (talk) 04:29, 15 July 2017 (BST)

Good suggestion - added to stylesheet. Katzeus (talk) 14:21, 17 July 2017 (BST)

Incorrect use of id instead of class.

Currently, the calendar table uses ids to specify that it is a calendar. The same id is also used for the collections. This also applies to many other features like "roundedborder", "cellcenter" and "cellstretch". This results in pages where the same id is repeated, which is invalid HTML.

Only elements which are not meant to be repeated on a page (like a table of contents or a header or footer) should be given ids. Elements which are just a class of something, like a calendar or a rounded table, should be described and styled using classes.

I believe these definitions should be changed to class instead (which also has the benefit of allowing more meaningful ids if they are desired, such as springcalendar, which could be used with user scripts if users desire), and am willing to help out, but I am unable to change the css.

A good intermediate step would be to duplicate these id definitions as class definitions, then pages which use them can be edited to use the class definition instead, with those changes occurring over some time. Then once no more pages use the id, it can be removed. JackBlack69 (talk) 22:12, 2 May 2020 (UTC)

I'm in support of this. Ids are meant to be unique while classes are repeatable. I started noticing this when I looked into the Name template, which uses #nametemplate, and its discussion.--Spaceeinstein (talk) 10:08, 7 January 2021 (UTC)