Commit graph

1580 commits

Author SHA1 Message Date
jenkins-bot 4235ff0efd Merge "Wrap tables with JS" 2024-05-24 22:46:24 +00:00
bwang e42b235669 Wrap tables with JS
Depends-on: Ia271a57776e6f38384c5855727ab82fd7af83241
Bug: T330527
Change-Id: I756f8e1bcd86867bee52962a0d1c2dbb34ca75eb
2024-05-24 15:49:54 -05:00
Jon Robson 48b0eeac2f Icons should not repeat at larger font sizes
Bug: T365731
Change-Id: I539f906e06bb2dc133885092dbacb851fd774c23
2024-05-24 20:32:46 +00:00
ksarabia 17a71f3c82 Adds invert exception for dropdown
* Adds a filter invert rule for toggle

Bug: T365035
Change-Id: Id04e3937ff1ef3982563003346fda07348ae26ea
2024-05-24 11:55:20 -05:00
Jdrewniak 607e6b39c5 Revert "Add exclusion behaviour for "width" option in Appearance menu"
This reverts commit ff5a61e9c6.

Reason for revert: The behaviour introduced in this patch needs some more consideration.

Bug: T364015
Change-Id: Ieab4ca4084df4f1b5c942fe81c7fb99b058e0623
2024-05-23 23:51:46 +00:00
Moh'd Khier Abualruz 4d97e0a4fb fix(vector): Set popup notification color to inverted
Updates `CSSCustomProperties.less` to include `.oo-ui-popupWidget-popup` in
`@OOUIOverrideSelectors` for inverted color inheritance.

Bug: T364798
Change-Id: I6c3ac79d24f6af71a9171153e346494fb97acd3f
2024-05-22 16:53:26 +02:00
Jon Robson 70fbd6f0c2 Small font size is not applying to excluded pages
Bug: T364887
Change-Id: Ib24beb3a383599dcc3ad64e01992ead908e3bef3
2024-05-21 23:41:35 +00:00
Jon Robson f4befc068d [Visual change] Limits two row header to mobile devices
I accidentally enabled this on tablet breakpoint.

Follow up to e3d2ab5031
The Pixel UI report should only surface changes on mobile - all
of these are improvements as it means the whole UI is visible in
the viewport.

Bug: T361573
Change-Id: I8aa5699a8fe959c1595d74c03f19c14856f6470f
2024-05-21 11:52:10 -07:00
jenkins-bot 0f9ad1ba67 Merge "Support Vector 2022 at > 320px" 2024-05-21 14:23:09 +00:00
jenkins-bot 685a02f8a6 Merge "watchstar: use mw.util.isInfinity() instead of comparing to 'infinity'" 2024-05-20 23:48:09 +00:00
MusikAnimal c06d62a531 watchstar: use mw.util.isInfinity() instead of comparing to 'infinity'
Bug: T353389
Bug: T353483
Change-Id: I580deb0ba47e4c13643524ddd4d57f1a8e0a35ae
2024-05-20 16:27:42 -07:00
Ed Sanders 54b750af14 vector-popup-notification: Use 14px font size instead of 16px
Vector still uses 14px almost everywhere, so use it here
as well.

Bug: T360335
Change-Id: Icf4891375a62480ffbb4808a357935aa6d6fdc58
2024-05-20 13:59:31 -07:00
Jon Robson e3d2ab5031 Support Vector 2022 at > 320px
In preparation for enabling responsive Vector on Wikifunctions,
we lower the support threshold to 320px for Vector.

Minor adjustments are made to the header to make it use two
lines at lower resolutions.

Fixes to tables to make them responsive will be made shortly as
part of T330527 which will complete the responsive behaviour.

Bug: T361573
Change-Id: Idbac393ab6ee60100ba0fd6df4b224cc45949bfd
2024-05-17 23:31:37 +00:00
jenkins-bot b33513e20b Merge "Override default sublist styles" 2024-05-17 21:08:51 +00:00
jenkins-bot c570ec099d Merge "Optimize styles" 2024-05-17 18:30:33 +00:00
Jan Drewniak ff5a61e9c6 Add exclusion behaviour for "width" option in Appearance menu
- Adds the notice "This page is always wide" and disables
  the inputs for the "width" options in the Appearance menu
  when pages are excluded via configuration ( `$wgVectorMaxWidthOptions`).
- Changes layout behaviour so that pages in the
  $wgVectorMaxWidthOptions['exlcude'] configuration
  stretch the entire viewport width.
- Stops the width settings in the Appearance menu from
  being hidden on smaller resolutions.

Bug: T364015
Change-Id: Idee294adf3b309e03834276ea75e4ae43b0cffcb
2024-05-17 17:58:19 +00:00
Jon Robson 1d17b4624f Optimize styles
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
2024-05-17 16:26:16 +00:00
bwang ff894e3682 Override default sublist styles
Bug: T364865
Change-Id: I179c059992b2ae614b984b8023774306764ccb57
2024-05-17 15:46:41 +00:00
bwang f13bc5ed80 Remove list-style-image used by ul elements
Bug: T364865
Change-Id: Id365e946e8c71f4812cbb9e4b00618fb73572554
2024-05-15 15:01:40 +00:00
Jan Drewniak 0d1de4773d [Follow-up] Override VE overlays in night-mode
Follow-up to 26d39ec, change VE overlay selector
from `.ve-ui-overlay-global` to `.ve-ui-overlay`.

Bug: T363861
Change-Id: Ie531ce6d03d81fbce374f7e17c785d4bb076bfda
2024-05-14 14:30:56 -04:00
Jan Drewniak 26d39ecafa Override VE overlays in night-mode
Creates a Less variable `@OOUIOverrideSelectors` which can serve
as a list of selectors that we want to treat the same as the `.notheme`
class (as an alternative to adding the `.notheme` class across repos).

Adds only one selector to this variable, `.ve-ui-overlay-global`
in order to force VE overlays to appear in light-mode while night-mode is
enabled.

This is a temporary measure until T363849 is resolved.

Bug: T363861
Change-Id: I3e3a209f1a9bd9130fc61915b9b2ff7134405e59
2024-05-13 21:58:20 +00:00
jenkins-bot 277135ef58 Merge "Fix red link color in dark mode" 2024-05-08 14:53:37 +00:00
bwang 337d608a56 Fix red link color in dark mode
Bug: T363778
Change-Id: Iae4fe2d793b8efbb10b54144ce4093c3e2112da2
2024-05-08 14:31:43 +00:00
Jon Robson 55e6dfd81c Fixes: exclusion logic for anonymous users
Bug: T364159
Change-Id: I7c7e9cff7b99f8e37f3f1ffb93464fd3f31c799b
2024-05-06 12:20:40 -04:00
Jon Robson ca0d404e50 Enable night theme in Vector
- New night theme added via Codex `.cdx-mode-dark();` mixin.
- CSS custom properties separated from skin.less.
- Font-size rem conversion removed since Codex now uses rems.
- bundlesize increased by 1kb ( followup from
Icfcb5c7418061a5727580f0685054356ba4edb72 ).
- Icons that use background-images are inverted for night-theme.
- Linter error fixed for long-lines in clientPreferences.js

Co-Author: <Bernard Wang> bwang@wikimedia.org
Bug: T354889
Depends-On: I1f54bf4f144eaec6ed317c04bd0c851c2f01b42c
Change-Id: I3a8a147b6be67bc830f0d3b816a4b85c26f99cf1
2024-05-02 13:22:59 -05:00
jenkins-bot c3987d472b Merge "Rename client preference menu to appearance menu" 2024-04-29 20:41:19 +00:00
bwang 0109218ab9 Rename client preference menu to appearance menu
Bug: T362808
Change-Id: Id6800d38eebf433cf0c9e3f179dd83df2eefd1fb
2024-04-29 15:38:20 +00:00
Jon Robson e84ec101f7 Prepare variables for night mode
* Drop all hexcodes
* Drop unused background-color-secondary - only applies in legacy
skin and replaced by background-color-secondary--modern
* Drop unused  border-color-content and border-color-content--tabs-inactive -
only apply to legacy Vector skin

Bug: T354889
Change-Id: Ie0accaaac2ac3717b6f034c5832f8c372b91c343
2024-04-25 21:29:23 +00:00
Eric Gardner cb8c7a17fd styles: Remove references to the legacy Codex build
Since Codex switched over to rem units, all differences between the
"legacy" and non-legacy builds of the library have disappeared.

This change removes references to the legacy version of the library
in preparation for the removal of these artifacts from Codex.

Bug: T360806
Change-Id: I158519eddc1738a5daeedb94eb7d2f692e74b84a
2024-04-22 18:41:05 +00:00
libraryupgrader d22fd0d7ab build: Updating npm dependencies
* eslint-config-wikimedia: 0.26.0 → 0.27.0
* @wikimedia/codex: 1.3.5 → 1.4.0
* @wikimedia/codex-icons: 1.3.5 → 1.4.0

Change-Id: I3dbc33dde89f03b188918e29f89434aafc3690a9
2024-04-21 21:57:17 +00:00
Jan Drewniak c3c7462951 [VISUAL CHANGE] Make spacing in UserLinks menus more consistent
Changes spacing around icons in the user-links menus
so that the spacing is more consistently 8px.

Bug: T353987
Change-Id: I860ab858363f0535fd80e3a823cf90f91c2e9a86
2024-04-18 23:49:07 +00:00
jenkins-bot f6c0071bd7 Merge "Add exclusion notice for night mode feature" 2024-04-17 16:44:03 +00:00
Jan Drewniak a3801497b9 Add exclusion notice for night mode feature
If night-mode is disabled on a certain page via the
exclude list in skin.json, then the following class:
".skin-theme-clientpref-excluded" will be added to the HTML element.

In this scenario, the related client-preferences
menu options are visible, but disabled, and a notice
is rendered below the options informing users of this state.

Bug: T361158
Change-Id: I46d335d079a2d27c7a4122e23ac7e479c286b886
2024-04-16 22:38:35 -04:00
jenkins-bot f0673ac58a Merge "Use client preferences for appearances menu" 2024-04-16 18:02:38 +00:00
Jon Robson c8442ba32e Drop background base declaration
This has been confusing a few editors and breaks support with
Extension:DarkMode so let's remove for now.

Change-Id: I84a58b49f8f3d5af8765531bc14c43b42fe39a1d
2024-04-15 16:06:41 -07:00
bwang c69a53a16c Use client preferences for appearances menu
Bug: T361586
Change-Id: I636a557e724f23ea18da135bac59cb304ba81091
2024-04-15 22:36:48 +00:00
jenkins-bot de06d9e104 Merge "Add h1 headings to fix for applying font-sizes" 2024-04-05 07:04:34 +00:00
Arlo Breault ff2e6a48ec Add h1 headings to fix for applying font-sizes
h1 headings can be created in wikitext but are discouraged.  They
nevertheless appear in the corpus.

https://www.mediawiki.org/wiki/Help_talk:Formatting#Level_1

Bug: T359881
Follows-Up: I15eaf43c6750c76363ec804eda9b8ca6ec4709c2
Change-Id: I1caa6809e1be14f87c791faac852610a522d1c5e
2024-04-04 13:19:17 -04:00
Jon Harald Søby 8416fd3796 Add transparent bottom border to .mw-list-item.vector-tab-noicon
Add a 2px transparent bottom border to .mw-list-item.vector-tab-noicon
in order to prevent visible "jumps" when no item in the list is selected
and one is hovering items (thus giving them a 2px bottom border).

Bug: T361841
Change-Id: I5b6ccd6fc68bab399647c270cf5ef573034bb622
2024-04-04 16:17:25 +02:00
Jon Robson 3f7f355a2e Support legacy message box styles markup in JavaScript
Log a console warning to assist developers in migrating to the new
markup.

Bug: T360633
Change-Id: Iaa1a3fc3b910c5fe491459fc82c61bc329f3408d
2024-03-21 18:19:52 +00:00
Moh'd Khier Abualruz b3ab84f9e5 Vector - Rename the skin night mode classes to more readable classes
The classes:
- skin-night-mode-clientpref-0
- skin-night-mode-clientpref-1
- skin-night-mode-clientpref-2
is being replaced with
- skin-theme-clientpref-day
- skin-theme-clientpref-night
- skin-theme-clientpref-os

Other Changes:
- Change vector-night-mode preference to vector-theme
- Add skin-theme-os-label and other messages to skins.vector.clientPreferences
- Remove skin-night-mode-* messages from skins.vector.clientPreferences

Bug: T359983
Change-Id: I31eb086e623a97df9fbd004425559e05b0cae170
2024-03-20 23:54:47 +00:00
Ed Sanders 84c2e0ae05 Remove unbalanced padding from trailing paragraphs in popups
Bug: T360143
Change-Id: Ieed96c8be61ee4883daaa17d82d1d1214ef85869
2024-03-14 11:42:49 -07:00
Steph Toyofuku 1492669009 Reorder client preferences (color above width)
In accordance with the original design, reorder the client prefs so that
night mode is above limited width

Visual change for users who have access to night mode

Bug: T357707
Change-Id: I21a976655734a2accc57d541bacba391961070a8
2024-03-13 16:29:11 -07:00
jenkins-bot c38e0677c3 Merge "Migrate uses of codex-search in Vector to use CodexModule" 2024-03-13 16:27:55 +00:00
Moh'd Khier Abualruz 182bb7519b Migrate uses of codex-search in Vector to use CodexModule
- 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
2024-03-13 15:58:26 +00:00
bwang 0531fbd117 Increase line height for medium and large font settings
Bug: T359030
Change-Id: I5be2e06c01c1959241d8d5347cb4f37c62c7cee2
2024-03-12 14:25:19 -05:00
Reedy 3ce9fd814f Fix casing of MediaWiki
Change-Id: I1fd944ea6bdd8231d00feb7e5c5b48fbf808d729
2024-03-12 15:44:13 +00:00
Jon Robson 9048285310 Address FIXME relating to use of !important
The !important is no longer needed now that T354975 is done.

Change-Id: I62d9dfd03064167851a34e25751919b73734d1e2
2024-03-08 16:40:39 -08:00
Moh'd Khier Abualruz fb734a46f6 Interaction to Next Paint (INP) Core Web Vital Improvement
According to a Google contact, given we set viewport to 1000px
for mobile devices viewing Vector get a tap delay.

The solution was suggested in https://developer.chrome.com/blog/300ms-tap-delay-gone-away?hl=en
and Peter has confirmed helps improve performance.

A supports query is added to limit this rule to only browsers where
it applies.

Bug: T358380
Change-Id: Ifd7d8951e06e3ba0faaed354492d23e6e0bc8f69
2024-03-07 16:53:06 -08:00
bwang 230c837052 Remove language notice
Bug: T353619
Change-Id: I75430c8b1e66158f798fbe27eec4942a089f3931
2024-02-29 17:04:16 -06:00