@ovasileva this issue is getting better rather than worse (e.g. more pages are getting broken in print mode). There are now 1,028 templates with this issue, compared with 800ish last time I checked. Presumably as people are copying across rules to their own projects. We should look to nip this in the bud sooner rather than later!

The following script could be used with a puppetteer script that runs on the edit page for each entry:

(function ()  {
    let text = $('#wpTextbox1').val();
    // find first html.skin-theme-clientpref-night
    const firstIndex = text.indexOf( 'html.skin-theme-clientpref-night' );
    let lastIndex = text.lastIndexOf( 'html.skin-theme-clientpref-night' );
    while ( text.charAt(lastIndex) !== '}' ) {
        lastIndex++;
    }
    lastIndex++;

    const nightStyles = text.slice( firstIndex, lastIndex );
    text = text.replace(
        nightStyles,
        `
@media screen {
    ${nightStyles.replace(/\n/g, '\n\t')}
}
` );
    text = text.replace(/(@media +)\(( *prefers-color-scheme)/g, '@media screen and ( $2')
    $('#wpTextbox1').val(text);
    $('#wpTextbox1').trigger('input');
    $('#wpSummary').val('Fixes [[phab:T369874]] via automated script. Please see talk page and do not revert without discussion.')
    $('#wpDiff').trigger('click')
}())

I ran this script (with a manual check afterwards on the main culprits of copy / pasta - which were on English Wikipedia) to see if these trickle down to other templates (e.g. someone is monitoring and syncing them). There are currently 433 templates.

I have to ask to post the message in https://ru.wikipedia.org/wiki/Обсуждение_шаблона:Заглавная once at a community forum and not 436 times on every single page that gets affected. There is no benefit to posting it to every single page, but there is a huge signal-to-noise ratio thing if you continue to post it everywhere.

You can try to get the scope of the issue via search like insource:"prefers-color-scheme" -insource:"media screen" prefix:all: or insource:"skin-theme-colourpref-night" -insource:"media screen" prefix:all:

Hey @stjn, I was planning on just automatically fixing this, but given feedback from @MSGJ and this revert by @Trappist_the_monk (https://en.wikipedia.org/w/index.php?title=Module%3ACitation%2FCS1%2Fstyles.css&oldid=prev&diff=1237881967) I've changed approach to post on talk pages first for high profile templates. This feels a bit redundant, but I want to respect wiki processes for going via the talk page, but I also want to balance that with addressing a time sensitive bug before it gets worse.

It would be good if we had better guidelines about how to fix problematic code in templates at scale that all projects agreed on, as this really doesn't scale and it feels like we have no good processes and shared understanding around how to do this sort of change.

Note: there may be some misunderstandings with how templates can be tested in other ways outside the sandbox that is contributing to this misalignment between editors.

The problem is, you are going around fixing the code that was suggested by you guys, so it is redundant to post about it on every single page when for example in Russian Wikipedia we don't really care if it is going to be one way or another. If English Wikipedia has weird issues they need to sort out, spam their talk pages, not ours.

Community: Go left, no RIIIGHT, no middle !!!

there is no winning.

In T369874#10039340, @Jdlrobson wrote:

...

In general, I would encourage edits of this sort even if reverted. You can revisit reverts if you think they're unfair for whatever reason. It's much better than notifying a lot of talk pages. Despite casting this as an English Wikipedia problem, these changes are low-risk and the reversion on the specific page that was made should not have been made.

In T369874#10039732, @TheDJ wrote:

Community: Go left, no RIIIGHT, no middle !!!

there is no winning.

No winning but I'll keep trying my best to adapt :)

I've now updated all the incorrect CSS. I manually verified all the diffs to the best of my ability.. sorry if I missed any. I'm sure I will get more feedback and any constructive feedback would be appreciated on how to do this sort of thing better in future. I found a few bugs in the syntax checking - so I'll file those shortly as part of sign off.

In T369874#10039835, @Izno wrote:

In T369874#10039340, @Jdlrobson wrote:

...

In general, I would encourage edits of this sort even if reverted. You can revisit reverts if you think they're unfair for whatever reason. It's much better than notifying a lot of talk pages. Despite casting this as an English Wikipedia problem, these changes are low-risk and the reversion on the specific page that was made should not have been made.

Ack.

One thing I would find useful (definitely on English Wikipedia) is to set some kind of policy under what circumstances such edits are appreciated from staff. I have been around a while so am obviously a little more hardened and prepared for pushback but it can be scary for newer staff who mean well and this sort of thing happens a lot. Despite my experience it's hard to satisfy everyone's needs and I do agree with @stjn this does feel on reflection an English Wikipedia problem.

The dark mode roll out was a good example of where we try to balance template editors time but also keeping the site usable for our readers. A lot of low risk changes got blindly reverted there by people who presumably didnt bother to read the associated edit summary for context.

I think modifications to CSS for example ahould be considered pretty low risk given the amount of safeguards we have in place (e.g. invalid CSS will be rejected). Fixes to Special:LintErrrors (e.g. https://en.m.wikipedia.org/wiki/Special:LintErrors/night-mode-unaware-background-color) where the problem is well defined and verifiable also seem fair game.

A typo here if you are not done yet:

    text = text.replace(/(@media +)\(( *prefers-color-scheme)/g, '@media screen and ( $2')
// should be
    text = text.replace(/(@media +)\(( *prefers-color-scheme)/g, '@media screen and ($2')
// or to be less confusing ;)
    text = text.replace(/(@media +)(\( *prefers-color-scheme)/g, '@media screen and $2')

Edit and maybe one more whitespace thingy would be to add trim like so:

 text = text.replace(
        nightStyles,
        `
@media screen {
    ${nightStyles.replace(/\n/g, '\n\t')}
}
` .trim());