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.
- 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
Mock 1 - language button
QA Results - Beta
|6||⬜||T260738#6829417 no verification needed|
QA Results - Prod