1) Icon optimizations
* Load styles for expand icon in
JavaScript since it relates to table of contents and that is only
enabled with JavaScript
* Drop vector-icon--x-small class since it only applies to this icon
* Remove some FIXMEs to an issue that has already been fixed
upstream
2) Move styles that do not need to be render blocking to skins.vector.js
* Move sticky header to skins.vector.js since it doesn't work without
JavaScript
* Move popupNotification to skins.vector.js since this is never server
side rendered.
Change-Id: I98e6c0826b514aaefcf88f66275bba37125129b1
- Loaded new skins.vector.search.codex.scripts module in skin.json, with only the CdxTypeaheadSearch component with codexScriptOnly flag set to true.
- Included skins.vector.search.codex.scripts in the script loading configuration for Vector22 within skin.json.
- Turned off the "interface-message-box" feature within Vector22's skins.vector.styles configuration in skin.json, as Codex now supplies these styles.
- Fix the style selector to add `.cdx-button` to `.vector-limited-width-toggle` in BottomDock.less since using the codex style
- Substituted "codex-search-styles" with "skins.vector.search.codex.styles" in the existing configuration.
- Ensured the availability of skins.vector.search.codex.scripts module for use, marking it in the list of modules in skin.js.
- Modified App.vue to utilize skins.vector.search.codex.scripts instead of @wikimedia/codex-search.
- Update App.test.js.snap to the latest output form
- Update bundlesize.config.json with newest values
Bug: T356677
Change-Id: I7fc223db01171efe6656792530d4b625be4c8edc
- Add appearance.svg file and classes
- Update the icon name in php
- Update icon name in test data and Snapshot
To test: change return value of
isClientPreferencesPinned() from SkinVector22
PHP Class to false
Bug: T351142
Change-Id: If61f3019430be3cb9c926b09bc397e27d8e636f2
Vector 2022:
mw.util.addPortlet('p-twinkle', 'TW', '#p-cactions');
mw.util.addPortletLink('p-twinkle','#', 'Hello world');
Or if preferred it can be added to the pinned menu
mw.util.addPortlet('p-twinkle-pinnable', 'TW', '#p-tb');
mw.util.addPortletLink('p-twinkle-pinnable','#', 'Hello world');
Bug: T342815
Change-Id: Id58515e72bfbd5f700aa573a122529c6efdfea9d
Vector:
mw.util.addPortlet('p-twinkle', 'TW', '#p-cactions');
mw.util.addPortletLink('p-twinkle','#', 'Hello world');
Additional changes:
* Add aria labels to gadget created menus
Additional changes to template
* Remove self closing tag on input[checkbox] in template
* Rearrange vector-menu and vector-menu-dropdown classes
for consistency between two approaches
Bug: T342815
Change-Id: I938928c3625099ad49bec8aafb11f91190a9f494
- 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
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
Currently the A/B test enrollment code is limited to the
sticky header experiment. Instead of doing that, always check it
inside skin.js and run it if necessary.
Now it's possible for this to run twice, keep track of whether
the init function has been called and make sure it doesn't get called
more than once.
Bug: T335309
Change-Id: Icfef13b019319d07686a06e06846789faf790ed6
Follow up to 87dd101a
* bump coverage to reflect improved test state
* remove ts-ignore statements
* Drop eslint-disable-next-line compat/compat rules in ES6 code
* Drop TypeScript checking on Jest files
* Identifies an existing usage of ES7 includes method in place
where ES6 browsers need to be supported.
* Update App.vue booleans to default to false. Note this doesn't
impact our usage of the search app as we always pass these values
in.
* Drop unused eslintEs6.json configuration file
Change-Id: Ib6f1ef77bf4e27ecdcc54b5fb963818437f8195c
* Upgrade @wikimedia/types-wikimedia to allow us to drop several
@ts-ignores
* Merges eslint rules now that ES6 is default everywhere
* Runs autofix command
* Fixes various prefer-const errors
Change-Id: Iee5bcb93f10a76d80dbeec813f6387c13438263e
With T178356 ES6 is the default, so these can now be
managed in the same module. Keeping them in the same module
will hopefully allow us to make more optimizations on the long
term.
Change-Id: I3fe9e50143b85b4cdc3d9171a60c3720a7c26b4b
- 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
Per T325086, the TOC should expand and activate the section that corresponds to
the window's hash fragment.
Additional changes:
* Moves logic that runs on page load to determine the
intersection from section observer to main.js, since the hash fragment can
take precedence over the scroll position (e.g. when scrolled all the way to the
bottom).
* Make section observer's pause() cancel any pending intersection calculations
so that it doesn't interfere with other async logic.
* Moves onHeadingClick and onToggleClick logic to activate and expand a section
to tableOfContents.js to facilitate unit testing this behavior with clicks and
hash fragment changes.
Bug: T325086
Change-Id: I8a2cf0e6a96467fae97608450b321c181155e424
This introduces a general scroll-padding-top value of 50px
for Vector 2022's HTML element.
This changes makes it so that when navigating sections via the
TOC, the section headings are 50px lower on the screen.
This change has been synced with the ToC active sections as well,
so that active sections become active at the same offset.
Bug: T314419
Change-Id: I99e5fe2047f5ad1e61ef51b6ba7e76a6cac36fc5
Follow up to Ib42d532d4e900c01061e1c5e39c03b17f0619c46
Hoist hook binding into main.js and update tests
main.js now only tests hook wire up.
tableOfContents calls reloadTableOfContents directly.
Bug: T316025
Change-Id: Ia06feab7cfb47a64ac3519bd7bd0428dc661045a
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
- Prevents the addPortletLinkHandler function from looping
over the same links multiple times by indexing
the HTMLElement instead of just the ID, which is an
optional parameter.
- Conditionally adds the icon class if the ID parameter
exists.
- Refactors the function to calculate the width of the
vector toolbar.
- Adds Jest tests to account for the dual icon scenario
and updates existing Jest tests.
Bug: T327369
Change-Id: I2a0934405efebd0e95919bc523d711866236a7e6
- Update naming convention to use dropdown instead of menu
Follow-up: Iac0586893fec26a8a6c2c904ce08fbf1e19b339c
Change-Id: Ie51f7fc280eeef8470613c07850dad83e4435ee8
