Confirmedusers, editor
2,831
edits
(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) |