View source for MediaWiki talk:Common.css

{{skip to TOC}}
{{/header}}
{{User:MiszaBot/config
|archiveheader = {{talkarchivenav}}
|maxarchivesize = 200K
|counter = 19
|minthreadsleft = 4
|algo = old(90d)
|archive = MediaWiki talk:Common.css/Archive %(counter)d
}}
{{talk header|search=yes}}
{{to do|small=yes|inner=
* [[MediaWiki talk:Common.css/to do|TemplateStyles]]
}}

== Edit request 16 August 2024 ==

I would appreciate the ability to use the {{code|.texhtml}} class with the semantic {{tag|var|open}} tag. Either of the following two changes would do the trick:
{{textdiff|span.texhtml {
	font-family: "Nimbus Roman No9 L", "Times New Roman", Times, serif;
	font-size: 118%;
	line-height: 1;
	white-space: nowrap;
	/* Force tabular and lining display for texhtml */
	font-variant-numeric: lining-nums tabular-nums;
	font-kerning: none;
}

span.texhtml span.texhtml {
	font-size: 100%;
}|.texhtml {
	font-family: "Nimbus Roman No9 L", "Times New Roman", Times, serif;
	font-size: 118%;
	line-height: 1;
	white-space: nowrap;
	/* Force tabular and lining display for texhtml */
	font-variant-numeric: lining-nums tabular-nums;
	font-kerning: none;
}

.texhtml .texhtml {
	font-size: 100%;
}
}}
{{textdiff|span.texhtml {
	font-family: "Nimbus Roman No9 L", "Times New Roman", Times, serif;
	font-size: 118%;
	line-height: 1;
	white-space: nowrap;
	/* Force tabular and lining display for texhtml */
	font-variant-numeric: lining-nums tabular-nums;
	font-kerning: none;
}

span.texhtml span.texhtml {
	font-size: 100%;
}|span.texhtml, var.texhtml {
	font-family: "Nimbus Roman No9 L", "Times New Roman", Times, serif;
	font-size: 118%;
	line-height: 1;
	white-space: nowrap;
	/* Force tabular and lining display for texhtml */
	font-variant-numeric: lining-nums tabular-nums;
	font-kerning: none;
}

span.texhtml span.texhtml, var.texhtml var.texhtml {
	font-size: 100%;
}
}} <span style="border-radius:2px;padding:3px;background:#1E816F">[[User:Remsense|<span style="color:#fff">'''Remsense'''</span>]]<span style="color:#fff">&nbsp;‥&nbsp;</span>[[User talk:Remsense|<span lang="zh" style="color:#fff">'''诉'''</span>]]</span> 11:01, 16 August 2024 (UTC)

:texhtml will at some point be TemplateStyled, so I'd honestly appreciate not spreading it around to arbitrary elements. :) [[User:Izno|Izno]] ([[User talk:Izno|talk]]) 14:18, 16 August 2024 (UTC)
::Good to know! I would like that too, so I'm happy to be patient. <span style="border-radius:2px;padding:3px;background:#1E816F">[[User:Remsense|<span style="color:#fff">'''Remsense'''</span>]]<span style="color:#fff">&nbsp;‥&nbsp;</span>[[User talk:Remsense|<span lang="zh" style="color:#fff">'''诉'''</span>]]</span> 14:19, 16 August 2024 (UTC)
:::It would already be so if not for [[phab:T200704]]. I made a really sad workaround at [[Template:Math-link]] but haven't spent the time rolling it out because of just how hackish it needs to be. [[User:Izno|Izno]] ([[User talk:Izno|talk]]) 19:20, 16 August 2024 (UTC)

== Turning Mobile CSS/JS off permanently and supporting Common CSS/JS on mobile ==

I've been [[MediaWiki talk:Common.css/to do#Turn mobile.css/js totally off|working on]] getting ready to stop loading [[MediaWiki:Mobile.css]] and [[MediaWiki:Mobile.js]] on English Wikipedia, and make [[MediaWiki:Common.css]] and [[MediaWiki:Common.js]] load on mobile. There have been a few edits to [[MediaWiki:Common.css]] and [[MediaWiki:Print.css]] to ready that, but now I'm going to be making a few changes which might get someone discussing sternly at me, so I'm leaving a section here preemptively in case we need to discuss certain cutoffs and such. I'll leave other implementation notes at the working page. [[User:Izno|Izno]] ([[User talk:Izno|talk]]) 18:21, 6 September 2024 (UTC)

:What's the motivation for this? Asking purely out of curiosity :) –[[User:Novem Linguae|<span style="color:blue">'''Novem Linguae'''</span>]] <small>([[User talk:Novem Linguae|talk]])</small> 19:18, 6 September 2024 (UTC)
::[[phab:T248416#9678769]] makes the external motivation clear I think (i.e. at some point we won't have a choice because Mobile.css/js are technical debt), but for my part I've just been annoyed at the duplication that was present at [[MediaWiki:Mobile.css]] and which is now at [[MediaWiki:Minerva.css]] and the fact that the Minerva skin isn't consistent with every other skin. [[User:Izno|Izno]] ([[User talk:Izno|talk]]) 20:14, 6 September 2024 (UTC)

== Mobile skin and block quotations ==

Page watchers may be interested in {{slink|Wikipedia talk:Manual of Style|Mobile skin and block quotations}}. Please feel free to participate there. [[User:Izno|Izno]] ([[User talk:Izno|talk]]) 04:07, 7 September 2024 (UTC)

== Edit summaries and "three classes to match specificity" ==

I'm not quite sure what {{u|Izno}}'s edit summary "and here" means in [[Special:Diff/1257001458]]. It doesn't seem to be related to [[Special:Diff/1247508975|{{their|Izno}} previous edit]] on the same page over a month ago, but it might be related to the edit summary "no reason for that" in [[Special:Diff/1257000611]] over at [[Module:Infobox/styles.css]]. I don't know how readers of the edit summary "and here" are supposed to understand it, because it takes investigating [https://en.wikipedia.org/wiki/Special:Contributions/Izno?limit=8&offset=20241112181143001 Izno's edits today before and after] to get just a guess at what's meant.

However, what I am sure about is that removing <code>.content</code> from this CSS rule made its comment outdated: {{tq|Use three classes to match specificity of MobileFrontend/Minerva selectors}}. It's no longer three classes, but two in each selector. —⁠[[User:Andrybak|andrybak]] ([[User talk:Andrybak|talk]]) 21:42, 12 November 2024 (UTC)

:I'm sure the note was necessary to note before. Some upstream changes (that we shouldn't be subject to anyway, but that's an aside) have adjusted the expectations for what we need to do locally I think. So now I'm pretty sure the note isn't necessary. [[User:Izno|Izno]] ([[User talk:Izno|talk]]) 22:03, 12 November 2024 (UTC)

== Edit request to make new template work <nowiki>{{</nowiki>[[Template:lightdark|lightdark]]<nowiki>}}</nowiki> ==
{{atop|result={{resolved}}

Update 1: Appears that I duplicated functionality in an existing template, so I did a quick and dirty merge. [[User:Awesome Aasim|Awesome]] [[User_talk:Awesome Aasim|Aasim]] 21:47, 18 November 2024 (UTC)
}}
{{edit protected|answered=yes}}

I recently created a template that changes what content is displayed depending on whether dark or light mode is used. However, it requires a bit of CSS to make working. Please add the following tested CSS into the common.css to make the behavior work as intended.

<syntaxhighlight lang="css">
.lightdark-islightmode {
	display: inline;
}

.lightdark-isdarkmode {
	display: none;
}

@media screen {
	html.skin-theme-clientpref-night .lightdark-islightmode {
		display: none;
	}

	html.skin-theme-clientpref-night .lightdark-isdarkmode {
		display: inline;
	}
}


@media screen and (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os .lightdark-islightmode {
		display: none;
	}

	html.skin-theme-clientpref-os .lightdark-isdarkmode {
		display: inline;
	}
}
</syntaxhighlight>

The added lines will make the template work. Since as far as I am aware there isn't CSS that will change this theme, the only way to do this is to have some CSS to make this template work like a switch, similar to all the CSS hiding and showing elements for different user groups.

If it is technically feasible, you can condense the <code><nowiki>.lightdark-islightmode</nowiki></code> and <code><nowiki>.lightdark-isdarkmode</nowiki></code> down to <code><nowiki>.lightmode</nowiki></code>/<code><nowiki>.islightmode</nowiki></code> and <code><nowiki>.darkmode</nowiki></code>/<code><nowiki>.isdarkmode</nowiki></code> to make this CSS work outside of the template I created. [[User:Awesome Aasim|Awesome]] [[User_talk:Awesome Aasim|Aasim]] 01:51, 17 November 2024 (UTC)
:{{not done}} not going to add this to the site wide script for all readers just for this one template that doesn't have any current usability, and is unlikely to be used in places all readers would need it, such as in articles. — [[User:Xaosflux|<span style="color:#FF9933; font-weight:bold; font-family:monotype;">xaosflux</span>]] <sup>[[User talk:Xaosflux|<span style="color:#009933;">Talk</span>]]</sup> 02:24, 17 November 2024 (UTC)
::I see the primary use case being templates where icons may need to shift colors depending on background. For example changing a black icon to white where readability is concerned. But I am not going to further debate the merits of such a change yet as I do agree it may need more time to determine its prospective use on pages across Wikipedia. [[User:Awesome Aasim|Awesome]] [[User_talk:Awesome Aasim|Aasim]] 04:21, 17 November 2024 (UTC)
:::This doesn't need Common.css anyway. It can be done solely in TemplateStyles. [[User:Izno|Izno]] ([[User talk:Izno|talk]]) 07:06, 17 November 2024 (UTC)
::::You're right. I thought it would, apparently not! [[User:Awesome Aasim|Awesome]] [[User_talk:Awesome Aasim|Aasim]] 16:42, 17 November 2024 (UTC)
Sorry to pile on here after the close, but please see the template's talk page, where I asked if this template was redundant to {{tl|if dark}}. – [[User:Jonesey95|Jonesey95]] ([[User talk:Jonesey95|talk]]) 04:35, 18 November 2024 (UTC)
{{abot}}