Commit graph

1259 commits

Author SHA1 Message Date
jenkins-bot 399116cabe Merge "popupNotification Javascript tests" 2023-04-21 17:19:53 +00:00
Jan Drewniak bd05ff4ae5 Add initial Zebra design update for page layout
Implements the zebra design update via the
skins.vector.zebra.styles module.

Refactors:
- Moves common variable and mixin imports from
individual files to skin.less file.
- Applies font-sizes to menu containers instead
of individual menu links.
- Adds mixins for dropdown and content-box styles.
- Unifies padding for pinned and unpinned menu states
  (including TOC).

Bug: T332600
Change-Id: I3d49095d84fa205cb5dcc889574133f42f1fd4ea
2023-04-21 11:02:56 -05:00
Moh'd Khier Abualruz ecdf2ced2c popupNotification Javascript tests
Bug: T333345
Change-Id: If65a86b2d6a8345f127a0803fd64cfa9f13a8630
2023-04-20 14:09:33 -07:00
Nicholas Ray 630d47792a Fix InvalidCharacterError: Failed to execute 'add' on 'DOMTokenList'
Bug: T335149
Change-Id: I9dad78af21ca7ee272a3661f5869e6337909dc05
2023-04-20 13:44:36 -06:00
Nicholas Ray c61d57c72a Fix TypeError: trigger.attr is not a function
Code was assuming jQuery.Object when it is now an Element.

Bug: T335148
Change-Id: I4755607f991889468294e022015a6a7e4becbb6c
2023-04-20 13:05:21 -06:00
Jan Drewniak 3cea6d4132 Scope styles related to zebra feature flag
This change scopes the styles related to the Zebra
update by wrapping the imports in a top-level feature
flag selector,
i.e

.vector-feature-zebra-design-enabled {
    @import "./screen.less"
}

To account for this extra selector, ampersands are
added wherever the html element is targeted in the
affected files. This applies to both zebra enabled
and disabled files.

getDefaultModules() is used in SkinVector22.php to
conditionally load the new skins.vector.zebra.styles
module when the feature is enabled.

Bug: T332600
Change-Id: I5e673df383ff31f296010f982e4188c82f095590
2023-04-19 23:09:08 -04:00
Jan Drewniak 5852e320a3 Create skins.vector.zebra.styles module
Creates a new skins.vector.zebra.styles module that
will hold style modifications for the Vector Zebra update.

Affected files are copied from skins.vector.styles
without modification (at this point) to improve
revision history in git.

The new module should compile without error and existing
styles should not be affected.

Bug: T332600
Change-Id: I9b367ca0a0afea32b49915b40bc03c05910d4227
2023-04-19 15:12:53 -04:00
Jan Drewniak da92ecf7cc [Refactor] Prepare existing styles for zebra module
This refactor seeks to make it easier to separate
feature flagged styles by wrapping the imports in
a top-level feature-flag selector, e.g:

    .vector-feature-zebra-design-disabled {
        @import './layouts/preZebra.less';
    }

This change does the following:
- Moves all file @imports to skin.less
- Removes unnecessary @import from MainMenu.less
- Moves .mixin-page-container() to mixins.less
- Moves @min-width-supported variable to variables.less
- Scopes existing Zebra styles at the skin.less file @import level
- Removes selectors ending with ampersands

The last changes makes it easer to reason about changes
specifically when wrapping entire file imports in a selector
since the ampersand ends up inheriting its value
from the skin.less file.

No visual differences are expected with this change.

Bug: T332600
Change-Id: Ife05e28ff38f9c5077e2d9eac653df656566e443
2023-04-19 18:53:11 +00:00
jenkins-bot 9e5bea1ff2 Merge "Add custom limited width popup" 2023-04-17 23:18:29 +00:00
jenkins-bot 81ffde7668 Merge "Forbid jQuery usage in Vector 2022" 2023-04-17 23:13:04 +00:00
bwang 4f76994970 Add custom limited width popup
Bug: T333601
Change-Id: I663d6a391aeeb05c27f2f2b8829c22325b528b39
2023-04-17 22:35:52 +00:00
jenkins-bot 5899cf25d6 Merge "Clean up leftover Sidebar CSS" 2023-04-17 21:27:57 +00:00
bwang 4698583307 Clean up leftover Sidebar CSS
- Delete unused CSS variables
- Move CSS variables to legacy
- Consolidate Sidebar.less into LegacySidebar.less

Change-Id: Idc47fda1c20fe3bbf3b9f1c1fcb889fe5b297aa4
2023-04-17 21:02:58 +00:00
Moh'd Khier Abualruz 592b33cc23 Page tools have long labels in certain languages
Bug: T332085
Change-Id: Ibdae716abc706267d63ffe25460b48fe44daf46b
2023-04-17 20:55:49 +00:00
Jon Robson 97a640945f Forbid jQuery usage in Vector 2022
Change-Id: I9d07acffa6f8133ec3e44ceba3d1fa5b27b81258
2023-04-17 17:20:59 +00:00
Jon Robson 080b6958e8 Use modern ES6 methods
* Prefer dispatchEvent to $.trigger
* Prefer Object.assign to $.extend
* Prefer URLSearchParams to $.params
* Prefer getAttribute / properties to $.attr
* Prefer document.querySelectorAll over $.find

Change-Id: I5f4464e5bfa11b401e663f0b8761fc6092380627
2023-04-14 13:38:38 -07:00
Jon Robson 2622472983 Point out the limited width control
The limited control will be pointed to on page load
When wgVectorPageLoadIndicator is set to true (defaults
to false)

Clicking the button should show the indicator.

Additional change:
* Update config.json to reflect new state
(Follow up to 28ada2dc)

Bug: T333601
Change-Id: I188ed7226b9a1530e54b1aaa80caa0830bf73633
2023-04-14 17:15:56 +00:00
Jon Robson 10033b294e Drop ES5 compatible code
Drop usages of $.closest in favor of ES6 closest

We also no longer need to check for whether closest is available
now that we do not need to worry about ES5 code.

Change-Id: I2442a4f69f8181dd761ca7ac418839cfca26a36f
2023-04-13 00:27:22 +00:00
Jon Robson 2499e834bb Remove Eslint disable and TypeScript ignore rules, bump coverage
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
2023-04-13 00:20:44 +00:00
Jon Robson d4a7fb6479 Rearrange setupIntersectionObservers
Update setupIntersectionObservers so it only contains code
that uses observers. Other code is moved to the skin.js entry point
along with other features.

Change-Id: Ia11b4e07f899426687c616ce2054e0df9d36ab7c
2023-04-12 17:39:36 +00:00
Jon Robson 87dd101a69 Consolidate and fix eslint errors, dropping ts-ignores
* 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
2023-04-11 16:56:31 -07:00
Jon Robson c3e57e0ecd Merge skins.vector.es6 into skins.vector.js
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
2023-04-11 23:18:46 +00:00
Jon Robson 28ada2dc78 Refactor: Separate A/B test configuration from site configuration
Making it easier to add configuration variables to JavaScript
in future. This will be used for the pointer indicator.

Change-Id: I65396a3867e7e92d7385ebaa573fb48105ecb9fd
2023-04-11 22:40:45 +00:00
Jan Drewniak 40130dbf5f Follow-up to 6e8a98ca removing checkbox.js
Removes checkbox.js and related styles as well
as rules for #mw-sidebar-checkbox which was removed
in a previous patch.

Bug: T332090
Change-Id: I168c1161a1d3365e79c2ff6b1c2ab5455f7c4c00
2023-04-06 01:01:21 -04:00
bwang 2bc51bef44 Clean up cached grid CSS from moving the Header
Can be merged after 04/07
Follow-up: I038fc17cbb88a29dbe8d7841b824761a91d38405

Bug: T332449
Change-Id: I8bfee300fe9d164143dbf1acac26015e9ca4df89
2023-04-05 23:29:05 +00:00
jenkins-bot 16dc80fdd1 Merge "Remove custom checkbox-hack implementations" 2023-04-05 22:52:40 +00:00
bwang ac73b57465 Follow-up: add border to zebra header
Bug: T332449
Change-Id: I93704a647b6c3d1dfd1741f223379019816a60e6
2023-04-05 16:25:15 +00:00
bwang 628804871e Implement new zebra design for the header under the flag
Bug: T332449
Depends-On: Ia21c14f72631e607e0d626408557eacb83529a03
Change-Id: I9a7d6fac7c44be1983281a44766d34a16f515b40
2023-04-04 21:27:31 +00:00
jenkins-bot 4994a6df8e Merge "Adjust table of collapsing auto-collapse algorithm for articles with few top level sections" 2023-04-04 16:19:00 +00:00
Jan Drewniak 6e8a98ca8b Remove custom checkbox-hack implementations
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
2023-04-04 10:01:09 -04:00
jenkins-bot 5d4115fdcd Merge "build: Updating npm dependencies" 2023-04-04 13:33:32 +00:00
Moh'd Khier Abualruz 098811f200 Adjust table of collapsing auto-collapse algorithm for articles with few top level sections
Bug: T333021
Change-Id: I9eef0fc0715f5f1917c205b7b7987b0ed76f31a2
2023-04-04 10:35:12 +02:00
Umherirrender d2b8ce8a3e build: Updating npm dependencies
* eslint-config-wikimedia: 0.22.1 → 0.24.0
* grunt-banana-checker: 0.9.0 → 0.10.0
* @wikimedia/codex: 0.7.0 → 0.8.0
* @wikimedia/codex-icons: 0.7.0 → 0.8.0
* @wikimedia/codex-search: 0.7.0 → 0.8.0
* @wikimedia/mw-code-qunit: 6.4.1 → 7.0.0

Change-Id: I3982576a6e8e932efa0ae00be58af343b29ef59c
2023-04-03 23:44:22 +02:00
bwang 2121a05012 Fix sticky header search
Follow up to fix bug introduced in: I038fc17cbb88a29dbe8d7841b824761a91d38405

Bug: T332449
Change-Id: I5cc6cabb766a744e103d48abc380dda509edc936
2023-04-03 19:23:13 +00:00
jenkins-bot 6a2204682a Merge "icons: Remove unnecessary code from SVG files" 2023-04-01 12:42:23 +00:00
thiemowmde f32daab81a icons: Remove unnecessary code from SVG files
The extra complexity provided by these SVG source code constructs is
apparently not needed. They look the same as before.

Change-Id: Iff2ef6b8549d182655b6eb1f3f93d0389e1b4c6b
2023-04-01 12:23:11 +00:00
jenkins-bot 206138f241 Merge "Remove custom sidebar config" 2023-03-31 23:28:01 +00:00
jenkins-bot edc75c5d8f Merge "Setup header and sticky header to be able to be full width" 2023-03-31 18:50:54 +00:00
Jan Drewniak 15be8a0340 Remove custom sidebar config
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
2023-03-31 13:09:04 -04:00
Jan Drewniak 3aaf8666cd Remove CSS selectors for Page Tools feature flag
This removes CSS selectors associated with the Page tools
feature flag, i.e. `vector-feature-page-tools-disabled` as
well as `vector-feature-page-tools-enabled` by removing
the 'disabled' styles and integrating the 'enabled' styles
into the default page tools code.

Bug: T332090
Change-Id: I382e12ca7ce741a3071582ffa84da03c2ba9e343
2023-03-31 11:34:37 -05:00
bwang 8d9b148cf7 Setup header and sticky header to be able to be full width
- 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
2023-03-30 16:37:15 -05:00
jenkins-bot ff7735edde Merge "styles: Increase line-heading-heading slightly to follow Codex" 2023-03-29 00:38:08 +00:00
jenkins-bot 9fc1dee7a3 Merge "build: Updating npm dependencies" 2023-03-28 21:54:43 +00:00
Jan Drewniak 2cf705bf79 Refactor languageButton.js using mw.util.addPortletLink
Per comment in related patch d05f251

Change-Id: If49dfe55e8450f1a7ed6968f4907ae458072560a
2023-03-28 20:53:23 +00:00
Volker E ee03c15c4a styles: Increase line-heading-heading slightly to follow Codex
[EXPECTED VISUAL CHANGE]
Following Codex typography definitions. This minor change results in a
2px higher heading.

Bug: T332171
Change-Id: I5ac39492d8efc5c24e4340983e2b6973b7252c8f
2023-03-28 20:52:21 +00:00
Umherirrender f3dfc9df1e build: Updating npm dependencies
* stylelint-config-wikimedia: 0.13.0 → 0.14.0

Run stylelint fix to fix the new stylelint rule

Change-Id: I3f9e528ca9f8292a9e3630356f0e8bf5df5f6609
2023-03-28 22:22:36 +02:00
Volker E 6fa5e1758c build: Update SVGO to v3.0.2 & re-crush icons
svgo         ^2.8.0  →   ^3.0.2

Amending to new `cleanupIds` plugin name.
Re-crushing SVGs while at it.

Bug: T333158
Change-Id: I29e74ec1240142af3440004b68ac985558836410
2023-03-27 06:10:37 -07:00
Moh'd Khier Abualruz 25f5f4975a Add indicator that appears when TOC & page tools menu have been hidden
Show a popup to the user to point them to the new location of the element

Bug: T311160
Change-Id: I967d027b23931d99767b31bd7a6af5f6410c8f5d
2023-03-23 21:46:51 +00:00
Moh'd Khier Abualruz bd7be711df Linting: run npm -s run lint:js -- --fix
reduce the number of warnings on precommit hook

Change-Id: Iad9fa273f9a661614fa3e40e1af6e9aa7697ea42
2023-03-22 20:22:33 +00:00
jenkins-bot 6d2e4d5d37 Merge "Import Codex tokens into mediawiki.skin.variables.less" 2023-03-17 21:34:24 +00:00