Notes:
* This is functional but intentionally not designed until the design
has been finalized.
* A feature flag is added that swaps out the limited width toggle with
a settings cog
* The preferences module is kept in a separate ResourceLoader module
(skins.vector.clientPreferences) to make it more portable for
when we eventually want to add it to Minerva as well.
* Intentionally have not focused on non-jS version given we will
likely revise this again in a future version/upstream to core.
Bug: T345363
Change-Id: I0c793b73e0676e32f031c6168c292f63908c72e3
- VectorComponentMenuVariants.php is renamed to VectorComponentVariants.php, and returns menu and dropdown data
- Remove TabsMenuContents.mustache in favor of MenuContents.mustache
- Fix the variants dropdown to use the full Menu template
Follow-up: Idf05c1664c026f58487ba34af5ede8a11e695baf
Change-Id: I0e9b1ab3306b04ee0d226048c6885beab4f310c6
- Hooking into mw.util.addPortlet
- merged in tests from: I3258388d74c103515e3f0680304f9a376e439a35
possible follow-ups:
- tooltips support
- custom attributes support
- Adapting portlets of types dropdown, tab to vector skin. Check patch set 10 for a starting point
Depends-on: I79bad8661e34e653d41e6cb1cd4462ac5c6bc3b1
Bug: T303488
Change-Id: I35a51df6ece2e48e086e722337d4c6bba427eeb4
New menu items can be added via
```
var node = mw.util.addPortletLink('p-dock-bottom', '#', 'hello' )
if (node) {
node.querySelector('a').classList.add( 'mw-ui-icon', 'mw-ui-icon-element', 'mw-ui-button' )
}
```
Bug: T336431
Change-Id: I8c5c5414cda9d268631ba0fade90e1a44c104ff1
The languages alert is misleading when there are no languages and the user has JS disabled.
This change adds a class to the alert if there are 0 languages, and then adds "display: none" to the alert if the client-nojs class is present. This is the same approach being used for the language switcher button.
Bug: T326185
Change-Id: Iee292d661ed1f47700f588053712f5f547022b17
- Update SearchBox.mustache markup to use codex styles
- Scope old SearchBox markup to LegacySearchBox.mustache
- Add handling for thumbnail and autoexpand search variants
- Adds a 'Search' button to SearchBox.mustache matching the initial non vue search box with the Codex design
- Refactor SearchBox CSS so styles are scoped better
Visual changes:
A "Search" button now appears on page load when it previously only appeared after loading in Vue
Bug: T337966
Change-Id: Ibcffe00292ab4f9f5f9919982d578793cf8594de
Changes:
- mw-ui-button to cdx-button
- mw-ui-quiet to cdx-button--weight-quiet
- mw-ui-icon-element to cdx-button--icon-only
- mw-ui-icon to vector-icon
- mw-ui-icon-flush-right/left to vector-button-flush-right/left
- Removes $isSmallIcon param in Hooks.php
85 Visual Changes
- ~36 changes from minor pixel changes from the new button classes in the main menu, language button
- 22 from standardizing the padding of the TOC in page title
- ~10 changes from addition of .cdx-button to the TOC toggle buttons
PERFORMANCE:
This will result in an overall increase of 2.7kb of render blocking
CSS, 1kb will be reclaimed when
I6c1ed1523df8cc9e2f2ca09506f12a595b8b013d is merged.
Co-author: Bernard Wang <bwang@wikimedia.org>
Bug: T336526
Change-Id: Ibd558238a41a0d3edb981e441638f9564f43d226
The ConfigRegistry was removed as unused but somehow reintroduced
mistakenly in the commit 80b60c15.
The fallback to anchor for old parser cache should be good to drop.
Change-Id: I0b6effd0fd4c535298fa280da734b13d26a5d968
Removes several styles that were used for
expanding/collapsing the table of contents at narrow
widths for non-js users as well as the main menu
for no-js users.
Existing `.vector-menu-checkbox` styles address this
use-case with the addition of a display:none rule for the
two affected checkboxes.
Related to the Page Tools clean-up since these styles
were once scoped to the .vector-page-tools-disabled
class.
Bug: T332090
Change-Id: I13efd4a87bacecb0e9f5a5e44d5e15861d632c62
Removes configuration for
1. Custom sidebar pinning
2. Default sidebar visibility for logged in & anons
The first config is no longer necessary because
the main menu now uses the pinnable header for
showing/hiding and persisting it's state.
The second config is no longer necessary since
the Page Tools menu moves many sidebar items into
a different location.
Bug: T332090
Change-Id: Iaf25237757dc1e43e096b8c5991e9dd31ad25c2d
- Move the header and skip link out of .mw-page-container-inner and the grid
- Wrap the header and sticky header with a .vector-header-container element, allowing us to easily update header styles in the future
- Update sticky header to use a <div> to fix a11y error. Update searchToggle.js to use .vector-header-container rather than <header>
Bug: T332449
Bug: T330438
Change-Id: I038fc17cbb88a29dbe8d7841b824761a91d38405
Removes the config option for Page Tool menu,
its associated logic, along with the associated HTML from
the mustache templates.
Hardcodes the `vector-feature-page-tools-enabled` class
into the HTML element to prevent breakage.
Bug: T332090
Change-Id: I6466d80c6970bcc8e28d897b6bdff911a90e3655
* Ensure 8px spacing between all icons and buttons
* Move buttons to separate container, so they aren't
grouped with -icons.
* Reducing horizontal padding of quiet labelled buttons
to 5px to match spec.
Bug: T326571
Change-Id: I71c3aee82152f048c347f80747972d526039a8f0
This patch removes the old style rules for .vector-toc-pinned after one
week of cache.
Also removes 'data-name' which was no longer used
Bug: T325032
Change-Id: I7c8d8e51a61646151706b71a1733b1daac5dbd45
- Template changes to use data driven links
- Template changes to use data driven list items
- Update unit tests
- Stop the hook from clearing data
Bug: T329794
Depends-On: Ide47c7ca7acabc21a94991d803f3683240a85f67
Change-Id: I523d7555b603b5382aa59eb25091338c7cc050ec
Follow up to I3484a790ce8ebadf21054ac1d222d5632b2dc5a4
__Template__
The template is not particularly useful - it is only ever
used once in this context and features a static ID which means
it can never be reused. It is also tied to the #vector-toc-collapsed-checkbox
element. In current form it doesn't make sense to have this template.
Maybe in future, I could see an argument for a PinnableTableOfContents component
that wrapped the checkbox and nav element, and generalized the IDs but
currently there's no pressing need or value for that.
__Layouts__
The existing Pinned and Unpinned stylesheets are concerned with how the table
of contents is layed out holistically with regards to other components and
features enabled on the page. I think these should therefore be organized as such.
The way I reason with this, is these styles would be irrelevant in a component
library if the component was rendered in isolation.
Bug: T328719
Change-Id: I9ff0e0eeb35f215a8cae5950d08dc1277b662a71
Now that there is a Link.mustache, I think other components like Button, Link should use the Icon template, and not include icon in the name, as its possible to have a link or button that doesnt use an icon as well.
Change-Id: I6d8a17dd956f09bb3df7a2503f55d255599874f8
- We had to add nav element to wrap TOC in all places
- Make sure proper nav is only displayed so landmark do not get confused
- Remove Eslint block on rules compat/compat for no support IE 11, this was blocking commit
- Run lint:fix:js and lint:fix:styles
- Fix maxSize in bundlesize.config.json
Bug: T324505
Change-Id: I36d26240b87de33318ff1edf97a410872a438103
- Fixes TOC button being transparent (https://jmp.sh/jbuivqlM). FYI the fixed width toggle button has the same issue.
- Add replace `html-vector-heading-icon` with Icon.mustache
Bug: T320453
Depends-on: I9a990ea8de63fb336391bea11b4503d447fb9d4f
Change-Id: I39397f8e98f79a2fdde9a8d785690133ea5a2619
