Prototype: https://gerrit.wikimedia.org/r/c/mediawiki/skins/Vector/+/635080
We will move the language switcher to the top right in three phases. These phases will be 1) moving the language switcher and providing non-JS fallback 2) Progressive enhancement via Vue.js or existing code (pending further discussion and 3) moving the language cog (for selecting interface language). This task concerns phase 1.
present | proposed |
acceptance criteria
- The language button is feature flagged and disabled by default
- A new language menu dropdown is added to the top right of the page. This sidesteps T104660
- The language dropdown is limited in height with vertical scrolling for long lists.
- The dropdown uses the existing Vector MenuDropdown component
- When clicking the menu with JS disabled the list of menus reveals itself.
- Minimize any styling changes here, but revise/remove any of the styles in the existing drop down styles that don't apply to this new component.
- The list of languages are removed from the sidebar. There is no settings cog in modern Vector with feature flag enabled.
- Vector legacy is not impacted.
- The label will need to be changed from Languages to "<num> languages", which is a fork from the data given by SkinMustache and will require modification in Vector either via hook or
Note: The settings cog will be later reconfigured as it is on Wikimedia Commons so is inside ULS like this:
Sign off steps
- A task is created to style the menu as a button
- A task is created to wire up ULS
additional material
Mocks
Mock 1 - language button
QA Results - Beta
AC | Status | Details |
---|---|---|
1 | ✅ | T260738#6829417 |
2 | ✅ | T260738#6829417 |
3 | ✅ | T260738#6831842 |
4 | ✅ | T260738#6829417 |
5 | ✅ | T260738#6829417 |
6 | ⬜ | T260738#6829417 no verification needed |
7 | ✅ | T260738#6829417 |
8 | ✅ | T260738#6829417 |
9 | ✅ | T260738#6829417 |
QA Results - Prod
AC | Status | Details |
---|---|---|
1-9 | ⬜ | T260738#6842555 |