- 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
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
Rather than try to build individually build login, logout, and create account menu items, we handle them the same as all other user links menu items in Hooks.php. While Hooks isnt ideal, there currently isnt a good path for moving that code to SkinComponents until core provides menu data. In the meantime, this patch reduces code complexity and prevents bugs like T324638.
This approach also allows us to move user links logic from SkinVector22 to VectorComponentUserLinks.php, and ensures the user links dropdown contains multiple menus, which allows us to reuse styles from page tools dropdowns.
Expected 11 visual changes:
* minor visual change where the user links dropdown has an
additional 4px vertical padding.
This padding was originally added to the page tools dropdowns
per Alex's request, but Alex also said that dropdowns should share
the same spacing. This change makes the styles all consistent
* Order of talk and contribution links have been swapped
Bug: T289212
Bug: T319356
Bug: T328954
Change-Id: Iac0586893fec26a8a6c2c904ce08fbf1e19b339c
- Remove all TOC components from markup when TOC isnt available
- Ensure TOC components have a consistent naming convention
Follow-up: Icd871e1bdf4ab0c7aa5b906b913416f4b1747750
Change-Id: I63519b5e5392b9eb546876e7eea060b9a6c147dc
Extra:
- Reactivated active list element, This still does not work if the current active gets edited.
- Removed pinning event reattach as we do not replace teh full element anymore.
Known Issues:
- Collapse/Expand not working
Bug: T326839
Change-Id: I2ce251f5312659b827ac2941d789248473bb0ef5
At resolutions below 1000px, we want pinned elements
such as the Page Tools menu and Main Menu to collapse.
This behaviour is temporary and when the browser is resized,
the pinned elements should revert to their previous pinned state.
We also want to remove the ability to pin these menus at
low resolutions, so the "hide/move" button is hidden.
A new matchMedia event handler is added to PinnableElement.js
to handle this behaviour.
CSS is also added to hide the pinned menus at low resolution.
This is to account for the situation where the page is loaded
at narrow widths, with pinned elements,
and the JS hasn't loaded yet.
features.js is refactors so that class toggling can happen
independently of saving the state to user preferences
(since we want to toggle the classes but not save the state
at lower resolutions).
Bug: T326364
Change-Id: I3113ab83deb15843e04ed63ec767a85c522517b5
complete the migration to components.
Changes:
* shouldHideLanguages only used inside SkinVector22 so abstract method
and legacy implementation removed.
* Move isLanguagesInContent method to SkinVector22, updating one usage
in SkinVectorLegacy which is always falsey (languages are always portals
in legacy Vector)
* Remove unused isLanguagesInContentAt method from SkinVectorLegacy
and move getLanguagesCached, isULSExtensionEnabled,
canHaveLanguages, isLanguagesInContentAt to SkinVector22
* runOnSkinTemplateNavigationHooks copied to both Vector skins
* isResponsive moved to Vector22. In Legacy Vector it has no
real use since legacy Vector has no responsive styles.
* SkinVector class now (empty), is removed.
Bug: T319355
Change-Id: Ib5df956cecb841b7c97264975d137af32e5da4ab
Simplify the user links component
Introduce MenuListItem and IconLink components.
HTML changes:
* Logout, login and account links are now wrapped in a ul and li tag
instead of a DIV for consistent with other menus (this occurs due
to use of MenuContents). Code reviewer can see tests
for an understanding of how the template data and markup has changed.
VISUAL CHANGE:
* Increased margins in user links menu relating to change from DIV to
UL / LI tags.
Bug: T320927
Change-Id: Ia24be48105e1ff85da227883abb5dddb3d54388d