Change #1036773 merged by jenkins-bot:

[mediawiki/extensions/WikimediaMessages@master] styles: Replace deprecated breakpoint tokens with Codex defined ones

https://gerrit.wikimedia.org/r/1036773

In T349793#9840599, @Volker_E wrote:

The scope is these three, core, MN and Vector, as they are blocking the removal of the legacy breakpoint and also impact the possible addition of Grid.
I'm not sure what you refer to with 'For core, none…'? For the extensions I will care about the replacement as I already did for all of the scoped ones.

I just need Web team to review and make sure this is QA'd and you're aware in case any edge case might get flagged afterwards.

To be more explicit:

• https://gerrit.wikimedia.org/r/c/mediawiki/core/+/945931 has various styles that the web team doesn't maintain or is familiar with. The only change there that seems in scope for our team is the comment addition to Skin.php For example Growth team maintains RCFilters according to https://www.mediawiki.org/wiki/Developers/Maintainers and search platform maintains the search CSS. We are not setup to QA any of these these pages.
• Vector doesn't seem to use legacy tokens (unless the URL in description is incorrect? If you need changes there - happy to review them I just don't understand what changes are needed!)

In T349793#9840622, @Jdlrobson wrote:

In T349793#9840599, @Volker_E wrote:

The scope is these three, core, MN and Vector, as they are blocking the removal of the legacy breakpoint and also impact the possible addition of Grid.
I'm not sure what you refer to with 'For core, none…'? For the extensions I will care about the replacement as I already did for all of the scoped ones.

I just need Web team to review and make sure this is QA'd and you're aware in case any edge case might get flagged afterwards.

To be more explicit:

• https://gerrit.wikimedia.org/r/c/mediawiki/core/+/945931 has various styles that the web team doesn't maintain or is familiar with. The only change there that seems in scope for our team is the comment addition to Skin.php For example Growth team maintains RCFilters according to https://www.mediawiki.org/wiki/Developers/Maintainers and search platform maintains the search CSS. We are not setup to QA any of these these pages.

Fair. My understanding of our environment: if something is off after the change for volunteers, Web team would be the first to get it flagged.
I'm more than willing to take on any conversations about the change and even come up with single fine-tailored changes if everything else is not working. But a +1 by Web team is needed on the pieces that are Web related and awareness about all changes will help possible communication. One example is the change in page.ready.js in the core patch, the code was introduced by you.

• Vector doesn't seem to use legacy tokens (unless the URL in description is incorrect? If you need changes there - happy to review them I just don't understand what changes are needed!)

Right, we've replaced them earlier on with the local variables, that are now part of this task. The local variables have to go though in order to make future amendments of breakpoints visible to DST instead of introducing more local variables mixed into the standard ones.

And none of any of those changes would be mergeable with the sanctus (minimally +1) by Web team.

Change #1037150 had a related patch set uploaded (by VolkerE; author: VolkerE):

[mediawiki/extensions/FlaggedRevs@master] styles: Replace deprecated breakpoint tokens with Codex defined ones

https://gerrit.wikimedia.org/r/1037150

From conversations with both, @Jdlrobson and DST peer engineers, my understanding on how to move this over the finish line:

1. We (DST) are responsible for reviewing and merging the core and the FlaggedRevs patch, former is the predecessor for Vector and MinervaNeue ones, latter is dependent on the Vector one
2. Web team is responsible for reviewing & merging Vector and MF/MinervaNeue and RelatedArticles ones. Latter is dependent on the MinervaNeue one
3. All four should be merged on the same day, preferably a few hours after a Tuesday's cut

Does that sound good for you @Jdlrobson?

Change #1037181 had a related patch set uploaded (by VolkerE; author: VolkerE):

[mediawiki/extensions/RelatedArticles@master] styles: Replace deprecated breakpoint tokens with Codex defined ones

https://gerrit.wikimedia.org/r/1037181

Change #1037184 had a related patch set uploaded (by VolkerE; author: VolkerE):

[mediawiki/extensions/MobileFrontend@master] styles: Replace deprecated breakpoint tokens with Codex defined ones

https://gerrit.wikimedia.org/r/1037184

Sounds like a plan!

Just for clarification, both mentioned skins, MediaWiki-skins-Mirage and Femiwikiskin have their own @width- variables defined, they are not in scope here.
It's better practice to orient on @min- and @max- like Codex latest does, but it's not necessary.

On a related note, could these breakpoint values be offered as CSS variables, just like we already have CSS variables for colors (e.g. --background-color-base)?

Use case: on frwiki there are some fine-tuned layout tweaks, for example using white-space: nowrap on large screens but not on small screens, and for consistency the same breakpoints as Codex are used, but currently the values have to be hardcoded, as there are no variables offered.

I was thinking the same thing, as I have always used the 720px breakpoint when making templates on dewiki responsive. Would be good to keep it variable based on skins.

I would suggest waiting for container queries to be well supported so that we get basically-skin-agnostic break points, for the content use case. (See also T331227.) WMF will still need their current set but we basically won't once we have those. (We can hardcode the like 2 gadgets that actually play with the full layout e.g. the experimental Timeless and Vector responsive gadgets en.wp has.)

Change #972327 had a related patch set uploaded (by VolkerE; author: VolkerE):

[mediawiki/skins/MinervaNeue@master] styles: Replace deprecated breakpoints

https://gerrit.wikimedia.org/r/972327

Change #945931 merged by jenkins-bot:

[mediawiki/core@master] styles: Replace deprecated breakpoints

https://gerrit.wikimedia.org/r/945931

Change #972331 merged by jenkins-bot:

[mediawiki/skins/Vector@master] styles: Replace deprecated breakpoints

https://gerrit.wikimedia.org/r/972331

Change #1037150 merged by jenkins-bot:

[mediawiki/extensions/FlaggedRevs@master] styles: Replace deprecated breakpoint tokens with Codex defined ones

https://gerrit.wikimedia.org/r/1037150

Change #1037181 merged by jenkins-bot:

[mediawiki/extensions/RelatedArticles@master] styles: Replace deprecated breakpoint tokens with Codex defined ones

https://gerrit.wikimedia.org/r/1037181

Change #972327 merged by jenkins-bot:

[mediawiki/skins/MinervaNeue@master] styles: Replace deprecated breakpoints

https://gerrit.wikimedia.org/r/972327

Thanks for your help on this @Volker_E and for flagging that it needed review from the web team - although at first glance these looked trivial you were right to flag this as more risky than most token changes!

It looks like this work uncovered some problems with the Minerva code, that we wouldn't have known about without doing this. I'm happy we managed to decouple those things and bring skins more in line with the design system team - that's going to reduce a lot of bugs on the long run. There are six visual changes with the above patch but all are improvements so it is an indication we are heading in the right direction. Thanks for the fruitful collaboration.

We will look at the last patch for Vector on Monday 💪

Change #1040301 had a related patch set uploaded (by VolkerE; author: VolkerE):

[design/codex@main] tokens: Remove remaining deprecated `width-*` breakpoint tokens

https://gerrit.wikimedia.org/r/1040301

Related, noticed that Echo defines custom breakpoint ‘@specialpage-hd-width: 982px;’

After T337954 we might now be able to replace that as well

In T349793#9873038, @TheDJ wrote:

Related, noticed that Echo defines custom breakpoint ‘@specialpage-hd-width: 982px;’

After T337954 we might now be able to replace that as well

Nice catch! I think it's better to tackle those in a different task. Researching also uncovered a few more similar, but slightly different breakpoints that would benefit from unification: https://codesearch-beta.wmcloud.org/search/?q=%5C%40media+all+and+%5C%28+min-width&files=&excludeFiles=&repos=#Extension:FlaggedRevs

Change #1040085 had a related patch set uploaded (by Jdlrobson; author: VolkerE):

[mediawiki/skins/Vector@master] Reapply "styles: Replace deprecated breakpoints"

https://gerrit.wikimedia.org/r/1040085

Just for completion, an issue in the original implementation of Codex carrying MediaWiki skin variables was uncovered by the work here: T367103: Media queries using max width breakpoints are not working in Monobook and Fallback skin

Change #1040085 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Reapply "styles: Replace deprecated breakpoints"

https://gerrit.wikimedia.org/r/1040085

Change #1043218 had a related patch set uploaded (by VolkerE; author: VolkerE):

[mediawiki/core@master] mediawiki.diff: Replace deprecated breakpoint token

https://gerrit.wikimedia.org/r/1043218

Change #1043218 merged by jenkins-bot:

[mediawiki/core@master] mediawiki.diff: Replace deprecated breakpoint token

https://gerrit.wikimedia.org/r/1043218

Change #1043269 had a related patch set uploaded (by VolkerE; author: VolkerE):

[mediawiki/core@master] rcfilters: Replace deprecated breakpoint token

https://gerrit.wikimedia.org/r/1043269

Change #1040301 merged by jenkins-bot:

[design/codex@main] tokens: Remove remaining deprecated `width-*` breakpoint tokens

https://gerrit.wikimedia.org/r/1040301

Change #1043269 merged by jenkins-bot:

[mediawiki/core@master] rcfilters: Replace deprecated breakpoint token

https://gerrit.wikimedia.org/r/1043269

How can one change the viewport back to 1000px?

Change #1049640 had a related patch set uploaded (by Eric Gardner; author: Eric Gardner):

[mediawiki/core@master] Update Codex from 1.7.0 to 1.8.0

https://gerrit.wikimedia.org/r/1049640

Test wiki created on Patch demo by EGardner (WMF) using patch(es) linked to this task:
https://patchdemo.wmflabs.org/wikis/f74be9bc8e/w

Change #1049640 merged by jenkins-bot:

[mediawiki/core@master] Update Codex from 1.7.0 to 1.8.0

https://gerrit.wikimedia.org/r/1049640

Change #1049955 had a related patch set uploaded (by VolkerE; author: VolkerE):

[mediawiki/core@master] mediawiki.less: Remove deprecated `@width-breakpoint-*` Less variables

https://gerrit.wikimedia.org/r/1049955

Change #1049955 merged by jenkins-bot:

[mediawiki/core@master] mediawiki.less: Remove deprecated `@width-breakpoint-*` Less variables

https://gerrit.wikimedia.org/r/1049955

Change #1075916 had a related patch set uploaded (by VolkerE; author: VolkerE):

[mediawiki/services/chromium-render@master] docs: Replace outdated skin Less variable with current one

https://gerrit.wikimedia.org/r/1075916

Change #1075916 merged by jenkins-bot:

[mediawiki/services/chromium-render@master] docs: Replace outdated skin Less variable with current one

https://gerrit.wikimedia.org/r/1075916

Hi! :) Just to clarify, is this task not subject to breakpoint changes? Or does the menu appear according to new breakpoints?
T330532: [Design] Re-evaluate breakpoint for hiding page tools/toc to keep content width more consistent

Change #1077052 had a related patch set uploaded (by VolkerE; author: VolkerE):

[mediawiki/core@master] docs: Amend to valid skin variable name for width breakpoint

https://gerrit.wikimedia.org/r/1077052

In T349793#10181974, @Iniquity wrote:

Hi! :) Just to clarify, is this task not subject to breakpoint changes? Or does the menu appear according to new breakpoints?
T330532: [Design] Re-evaluate breakpoint for hiding page tools/toc to keep content width more consistent

Hi, no it's probably not. The task linked could point at either a wrong breakpoint choice or a gap in our current breakpoints or none of all of them. Will provide the current tokens breakpoints there.

Change #1077052 merged by jenkins-bot:

[mediawiki/core@master] docs: Amend to valid skin variable name for width breakpoint

https://gerrit.wikimedia.org/r/1077052

In T349793#10192449, @Volker_E wrote:

In T349793#10181974, @Iniquity wrote:

Hi! :) Just to clarify, is this task not subject to breakpoint changes? Or does the menu appear according to new breakpoints?
T330532: [Design] Re-evaluate breakpoint for hiding page tools/toc to keep content width more consistent

Hi, no it's probably not. The task linked could point at either a wrong breakpoint choice or a gap in our current breakpoints or none of all of them. Will provide the current tokens breakpoints there.

Thanks for the answer :)

There are a few legacy breakpoints remaining, but not many: Code search.

Notably, addressing these in mediawiki-services-mobileapps would nicely complement fixing https://phabricator.wikimedia.org/T172078#8533594.