Template talk:Keypress: Difference between revisions

From Vintage Story Wiki
added proposal to make this make sense
(Created page with "== A full, cursed list of all the different key IDs and classes == I hate everything about this. Taken from our [https://wiki.vintagestory.at/load.php?lang=en&modules=site.styles&only=styles&skin=timeless custom CSS], can't be changed unless you can change the CSS. You will best follow my rant if you understand the difference between a [https://www.w3schools.com/cssref/sel_class.php CSS class] and a [https://www.w3schools.com/cssref/sel_id.php CSS ID]. Present in the C...")
 
(added proposal to make this make sense)
Line 18: Line 18:


Someone with CSS edit permissions, please make it make sense. -- [[User:Veerserif|Veerserif]] ([[User_talk:Veerserif|talk here]] or on Discord) 18:38, 31 July 2023 (UTC)
Someone with CSS edit permissions, please make it make sense. -- [[User:Veerserif|Veerserif]] ([[User_talk:Veerserif|talk here]] or on Discord) 18:38, 31 July 2023 (UTC)
=== Proposal to make the CSS make sense for this===
Use only CSS '''classes''' in line with [https://stackoverflow.com/questions/298607/css-best-practice-about-id-and-class best practices], since these will be called multiple times potentially on the same page, and there is no inherent reason for them to be unique (which is what IDs are for).
'''Best solution''': a single base class {{ic|keyboard-key}} for '''all''' keys, which uses padding to automatically adjust width as necessary. See English Wikipedia's [https://en.wikipedia.org/wiki/Template:Key_press/styles.css key press CSS], used in their [https://en.wikipedia.org/wiki/Template:Key_press Key press template].
Compromise solution: group the classes under classes of keys based on formatting needs.
* base class {{ic|keyboard-key}} for all regular-width keys, A-Z 0-9 and all punctuation, including arrow keys. Pick one unified font family, style, size, color, and key background.
* {{ic|key.modifier}} Covers Shift (left and right), Control (CTRL), Alt, Command (CMD), Caps, Tab, Backspace (BKSPC) and Delete (DEL) keys. This should be slightly wider than the base class and fit 5-6 characters.
* {{ic|key.function}} Covers F1-12 and ESC, as well as Insert (INS), Home, End, Page Up (PGUP) and Page Down (PGDN). Wider than {{ic|key}} but not as much as {{ic|key.modifier}}.
* {{ic|key.space}} Covers the spacebar. Probably doesn't need to be a full 226px wide.
-- [[User:Veerserif|Veerserif]] ([[User_talk:Veerserif|talk here]] or on Discord) 19:01, 31 July 2023 (UTC)
Confirmedusers, editor
2,831

edits