MediaWiki talk:Common.css: Difference between revisions

m
Text replacement - "Bfdifan2006" to "C.Ezra.M"
m (Text replacement - "Bfdifan2006" to "C.Ezra.M")
 
(6 intermediate revisions by 3 users not shown)
Line 19: Line 19:


:I am confused which class should I use. Roundtable makes cells white, what I would prefer but it also adds unnecessery padding at the bottom.--'''[[User:Team Rocket Grunt|<span style="color:#CC0000">Rocket</span> <span style="color:#666666">Grunt</span>]] ([[User talk:Team Rocket Grunt|<span style="color:#CCCCCC">Report To Me</span>]])''' 16:36, 8 March 2020 (UTC)
:I am confused which class should I use. Roundtable makes cells white, what I would prefer but it also adds unnecessery padding at the bottom.--'''[[User:Team Rocket Grunt|<span style="color:#CC0000">Rocket</span> <span style="color:#666666">Grunt</span>]] ([[User talk:Team Rocket Grunt|<span style="color:#CCCCCC">Report To Me</span>]])''' 16:36, 8 March 2020 (UTC)
::The purpose of the padding is to allow the bottom of the table to be rounded, without rounding the bottom cells themselves (which is particularly important if the table is sortable, for example). Rather than having different styles depending on whether or not the table is sortable, as a single universal approach was chosen.
::Making the cells white is because historically tables would define <code>style="background: #FFF"</code> on every row, but this class makes that unnecessary. Since a rounded table with colored headers is the standard table design used on Bulbapedia, it's ideal to have these behaviors defined in a single class. --[[User:SnorlaxMonster|<span style="color:#A70000">'''Snorlax'''</span>]][[User talk:SnorlaxMonster|<span style="color:#0000A7">'''Monster'''</span>]] 01:14, 9 March 2020 (UTC)
:::When table is sortable I would just use footer that doesn't sort (with ! instead of |) and round it. Classes could do that too.--'''[[User:Team Rocket Grunt|<span style="color:#CC0000">Rocket</span> <span style="color:#666666">Grunt</span>]] ([[User talk:Team Rocket Grunt|<span style="color:#CCCCCC">Report To Me</span>]])''' 13:54, 9 March 2020 (UTC)
== <code>overflow-ms</code> class ==
The property <code>pointer-events: none;</code> should not be there because I found out it prevents linking to the article about the Pokémon via its icon. --'''''[[User:C.Ezra.M|<font color="turquoise">C.Ezra.M</font>]]'''''<sub>[[User talk:C.Ezra.M|<font color="lime">something to say?</font>]]</sub> 20:09, 18 May 2021 (UTC)
:The motivation behind including that property is that otherwise the blank space around the icon would also include the link, which may be unexpeceted. --[[User:SnorlaxMonster|<span style="color:#A70000">'''Snorlax'''</span>]][[User talk:SnorlaxMonster|<span style="color:#0000A7">'''Monster'''</span>]] 13:48, 21 May 2021 (UTC)
== Staff member highlighting ==
Is there any actual reason to use the <code>!important</code> keyword for the <code>padding-left</code> property? If there is no such reason, it might be good to remove that keyword from the property.
The reason I'm asking is because I want to have, just for me, [[User:C.Ezra.M/common.css|a custom way to highlight staff members's usernames]], which is to apply everywhere inside the <code>div#content</code> block, not just in [[Special:recentchanges|the Recent Changes]]. I am honestly making too many edits to the CSS in an attempt to circumvent the left padding by using a more specific selector, and <code>!important</code>. To showcase these:
* <div style="background-color: #c80; margin: 0 5px; padding: 0px 5px; {{roundy|5px}}; color: #ccc; display: inline-block">'''JuAd'''</div> - for the {{bp|Junior Administrators}}.
* <div style="background-color: #888; margin: 0 5px; padding: 0px 5px; {{roundy|5px}}; color: #ccc; display: inline-block">'''Admn'''</div> - for the {{bp|Administrators}}.
* <div style="background-color: #fc4; margin: 0 5px; padding: 0px 5px; {{roundy|5px}}; color: #444; display: inline-block">'''SrAd'''</div> - for the {{bp|Senior Administrators}}.
* <div style="background-color: #4cc; margin: 0 5px; padding: 0px 5px; {{roundy|5px}}; color: #444; display: inline-block">'''Brct'''</div> - for the {{bp|Bureaucrats}}.
* <div style="background-color: #8c8; margin: 0 5px; padding: 0px 5px; {{roundy|5px}}; color: #444; display: inline-block">'''EdiB'''</div> - for the {{bp|Editorial Board}}.
* <div style="background-color: #44c; margin: 0 5px; padding: 0px 5px; {{roundy|5px}}; color: #ccc; display: inline-block; background-image: linear-gradient(to right, #c44, #4c4, #44c, #c44);">'''ExSt'''</div> - for the {{bp|Bulbagarden Executive Staff|Executive Staff}}.
* <div style="background-color: #444; margin: 0 5px; padding: 0px 5px; {{roundy|5px}}; color: #ccc; display: inline-block">'''Inac'''</div> - for the {{bp|Inactive Staff}}.
--'''''[[User:C.Ezra.M|<font color="turquoise">C.Ezra.M!</font>]]''''' <sub>[[User talk:C.Ezra.M|<font color="lime">Or is he actually</font>]] [[Special:Contributions/C.Ezra.M|<font color="orange">Keyacom?</font>]]</sub> 11:02, 27 February 2022 (UTC)
:It appears I fixed the issue myself, but the question remains to be answered. --'''''[[User:C.Ezra.M|<font color="turquoise">C.Ezra.M!</font>]]''''' <sub>[[User talk:C.Ezra.M|<font color="lime">Or is he actually</font>]] [[Special:Contributions/C.Ezra.M|<font color="orange">Keyacom?</font>]]</sub> 11:26, 27 February 2022 (UTC)