Commit graph

1473 commits

Author SHA1 Message Date
jenkins-bot a9f7b251fd Merge "[Zebra] Update to 483c6bb Align sidebar TOC with main menu" 2023-12-05 17:00:16 +00:00
bwang 300028a42e [Zebra] Update to 483c6bb Align sidebar TOC with main menu
- Vertically aligns the sidebar TOC
and main-menu text, update after sticky-pinned
container was split into separate elements.
- Consolidate position: sticky and contain: paint styles onto sticky-pinned-container elements

47 expectecd visual changes to desktop-dev

Bug: T351697
Change-Id: I76b3e875f5793d3442e84215447a0ab9fa818300
2023-12-05 16:39:49 +00:00
Moh'd Khier Abualruz 2384a32323 [Zebra] Make .vector-column-start cache compatible
preparing html and css to avoid caching issues
caused by differences between zebra and non-zebra HTML.

Bug: T347712
Bug: T351830
Change-Id: I6f8ae635ba38937729b77ea8517ef2eae0ae12f7
2023-12-04 14:29:06 -06:00
Jon Robson 65908e0c7d Put font size control before limited width control
Bug: T351867
Change-Id: Ieab31c875ab87d3ffc103805e3012089ab118a28
2023-12-01 09:19:51 -08:00
Jan Drewniak 531cbcbd25 Increase "large" font-size option for client-preferences
Increases "large" font-size option from
@font-size-large (18px equivalent) to
@font-size-x-large (20px equivalent)

Bug: T351693
Change-Id: I9e3dd8346b1d6f6a9efd04bb1e43fee9bfd79154
2023-11-30 12:57:37 -05:00
jenkins-bot 35a616368b Merge "Add styles for new heading HTML" 2023-11-28 22:42:11 +00:00
Jon Robson 15250424b3 Fixes: Duplicate events for radio buttons
Bug: T352075
Change-Id: I9cec0b23618162ba74ccd9cd2e27e9171cdc8d6e
2023-11-28 10:09:06 -08:00
jenkins-bot 991419e877 Merge "Adjust .vector-body paragraph margins" 2023-11-27 23:04:03 +00:00
jenkins-bot f647138f9a Merge "i18n: Update copy" 2023-11-27 20:07:00 +00:00
Jan Drewniak 522d655007 Adjust .vector-body paragraph margins
Adds bigger bottom margin (1em) while keeping
the smaller top margin (0.5em) as was previously define.

This keeps the headings close to the paragraphs
while seperating paragraphs from each other.

Bug: T351754
Change-Id: I833372002654ea30deb110af44fb412722bc0ccd
2023-11-27 14:50:03 -05:00
Jon Robson 1c2dff5690 i18n: Update copy
* Switch from "has been" to "has"
* Reorder limited width options
* Change headings
* Change options
* Change copy of beta feature

Bug: T351998
Bug: T351867
Change-Id: I65494a3cc75b661339e48df1bea0e09a365c0657
2023-11-27 11:21:55 -08:00
jenkins-bot e55034f3ad Merge "Fix misc client pref bugs" 2023-11-27 18:07:10 +00:00
jenkins-bot e75b2cda57 Merge "Fix sticky styles for pinnable elements by moving sticky styles into separate vector-sticky-pinned-container element" 2023-11-27 17:56:07 +00:00
bwang a304223f04 Fix misc client pref bugs
- fixes unpinned popup message not showing
- fixes radio button spacing in client pref dropdown in Zebra

Bug: T351141
Change-Id: Ieeb5caaa6ccbd83d28dae41d3ca30791c355fcc6
2023-11-27 11:40:53 -06:00
bwang b23f6f6722 Fix sticky styles for pinnable elements by moving sticky styles into separate vector-sticky-pinned-container element
Cached HTML change

Bug: T351141
Change-Id: I7d2b4417db15aad7ea788ac7adf131de2c702d27
2023-11-27 17:09:26 +00:00
Jan Drewniak edfdf05f12 Implement new font-sizes for custom front-size preference
Adds different font-sizes and line-heights for the custom
font-size UI. The custom font-size preference options are now:

1. Compact - 14px font-size & 22px line-height
2. Standard - 16px font-size & 24px line-height
3. Open - 20px font-size & 26px line-height

This removes the "xl" font-size option
(`vector-feature-custom-font-size-3`) and it's related i18n messages,
and changes the remaining message to match the new options.

The default font-size, when the custom font-size feature is disabled,
is "compact".

Bug: T351693
Change-Id: I5975a78ce7327f314fd55de55c222ac08d801fbd
2023-11-24 15:23:56 +00:00
Moh'd Khier Abualruz e480bfa2b5 Update theme icon for client preferences in user links
- 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
2023-11-24 15:01:35 +00:00
jenkins-bot 9062e6f96e Merge "Follow-up to 7a8059d76 - Vector increase paragraph spacing to 1em" 2023-11-23 23:35:02 +00:00
jenkins-bot f26a8a0556 Merge "Revert "Vector increase paragraph spacing to 1em"" 2023-11-23 23:27:37 +00:00
Jan Drewniak 78f1f1c671 Follow-up to 7a8059d76 - Vector increase paragraph spacing to 1em
This patch changes the paragraph spacing for Vector 2022
instead of legacy Vector.

Bug: T351754
Change-Id: If205abd17236f9e325cb477b589fa35da246d623
2023-11-23 18:16:00 -05:00
Jdrewniak c3b10b4cac Revert "Vector increase paragraph spacing to 1em"
This reverts commit 7a8059d767.

Reason for revert: Didn't realize this changes the paragraph spacing in the legacy styles module instead of the Vector 2022 module.

Change-Id: I08f2a6b1f43fc088e6552fb6a9011b41ebb698a2
2023-11-23 23:09:03 +00:00
jenkins-bot a4ed8727cb Merge "Vector increase paragraph spacing to 1em" 2023-11-23 16:47:20 +00:00
jenkins-bot 37c2a0016f Merge "Make client prefs fully pinnable" 2023-11-23 16:34:33 +00:00
Moh'd Khier Abualruz 7a8059d767 Vector increase paragraph spacing to 1em
.vector-body p now should have top and bottom margins as 1em instead of 0.5em which translate now to 14px instead of 7px

Bug: T351754
Change-Id: Ifd405d7754f9062d9a84237560495a36d1dab8e9
2023-11-23 11:28:06 +01:00
bwang d2b413a721 Make client prefs fully pinnable
Bug: T351141
Change-Id: Ic4a166fb3234b27dbf3d37891abfdf15781c8867
2023-11-22 14:39:28 -06:00
jenkins-bot 84ce8cdd41 Merge "Fix the toc header underline" 2023-11-22 18:44:26 +00:00
Jan Drewniak 791b9bb0d5 [Zebra] Vertically align sidebar menus
Removes padding from the top and bottom of the
.mw-body element so that the border of the sidebar
menus align with border of the tab area.

Also removes the bottom margin on the sidebar menus
so that the bottom of the menus align with the bottom
of the content. (This was an artifact from the gray
background design).

**Visual Changes**
- The content will move up by 8px with this change.
- The bottom of the TOC will also move down by 24px
  to align with the content.

Bug: T351432
Change-Id: If0a8189b228ffb6fb63dfd8be40955653caa0b34
2023-11-21 18:59:15 +00:00
bwang b74b45d65d Fix the toc header underline
Bug: T340481
Change-Id: Iefbaae291c091b51910180c619993843895c9a20
2023-11-21 17:35:40 +00:00
Jan Drewniak 483c6bb51f [Zebra] Align sidebar TOC with main menu
Aligns the text of the sidebar TOC with the
main menu using negative margins. This only
affects the TOC in the sidebar position.

Bug: T351697
Change-Id: Ie4e78379e8682636ebf72913e995b69e922b4983
2023-11-21 16:02:10 +00:00
Jon Robson 845a0ab71d Make the limited width and font size controls work for logged in users
For time being manage classes inside Vector. Document with FIXME and a
test.

Bug: T351447
Change-Id: Icc084a59a0141ec2b7c772cf92e8cc58c11f15b1
2023-11-21 02:16:52 +00:00
Bartosz Dziewoński 3c2602b682 Add styles for new heading HTML
Add CSS to support new HTML markup for headings with section edit
links, which will soon be used by Parsoid page views (T269630)
and by the old parser (T13555). Keep the old rules to provide
temporary support for cached page HTML and emergency opt-outs,
as well as permanent support for plain headings on special pages
and in Parsoid edit mode HTML.

See documentation page for further explanation:
https://www.mediawiki.org/wiki/Heading_HTML_changes

Depends-On: I44587461582d648b56ef0c9c7ae0c322895c69c2
Bug: T13555
Bug: T269630
Change-Id: I62d7e8ad7d8f25d145ec1f33230d6043982aec1e
2023-11-17 20:36:56 +00:00
ksarabia 45332cfcb6 Fix alignment issue in Zebra
Addresses misalignment of client pref in zebra

Bug: T350417
Change-Id: Ib4b80b13dc67d00362abf168853c3ae58ae808b3
2023-11-16 13:53:41 -06:00
ksarabia 1a15dbd4d0 Fix sidebar component order
* This moves down the client pref menu
* For now when page tools is collapsed the client preference menu
is hidden. This will be revisited when we implement pinning
in the next sprint.

Bug: T350417
Change-Id: Ic94d6fd2c4ccb667b0ae602d03c564f88a14b8ec
2023-11-16 00:30:28 +00:00
Jon Robson 5a0678c77d Allow client side preferences to render in a dropdown
Known problems:

- For now, this can only be rendered by manually updating
the isClientPreferencesPinned local variable in SkinVector22
This will be addressed in T351141
- The icon is not correct. This will be addressed in
https://phabricator.wikimedia.org/T351142

Bug: T350195
Change-Id: I0b1ec445c4d292bbf417a39dbc5d2032b563f525
2023-11-15 12:50:54 +01:00
Moh'd Khier Abualruz 412c1f2d83 Create a sidebar for user preferences
* Adds mustache for sidebar
* Adds file to render sidebar

Bug: T350417
Change-Id: I691c8a0487e158e96027109c223569224f03a102
2023-11-14 14:33:01 -08:00
jenkins-bot 8664294709 Merge "Remove Zebra A/B test code" 2023-11-13 22:17:52 +00:00
Jon Robson 0a33ffffac Remove Zebra A/B test code
Additional change:
* Remove duplicate A/B test requirement for language in header

Bug: T339957
Change-Id: I0258e71ac0e270682ec1f3bcb0f10198892f058d
2023-11-13 21:56:34 +00:00
Jan Drewniak 6fcecec64e [Zebra] Remove underline from pages with blank title
Removes the underline below the page title if it's blank.

Bug: T351119
Change-Id: Ie177aecc92bd7f18175e1dc875e5f8471b38c7bb
2023-11-13 21:39:29 +00:00
Jon Robson 07a26a9448 Refactor VectorComponentUserLinks to not use hooks
Bug: T350195
Change-Id: I6cbf45587475f0477657a7ce9309b2cd42da33c1
2023-11-09 17:32:10 -08:00
Jon Robson 44d9f74c8f Client preferences: Support different render locations, use Codex
* Refactor client preferences to support different render locations
such as the sidebar or user menu.
* Make use of Codex markup.

Bug: T350195
Bug: T350417
Change-Id: I13eeb9cafc888faba4a5bf0390c1b6db1e3f0259
2023-11-09 19:04:03 +00:00
ksarabia 5e6d6124d0 Remove TOC state from logic
* This makes the function hyper-specific and only looks for main menu
  and page tools pinned states to return true.
* Renames function

Bug: T349924
Change-Id: I8e3a90b71c7f9acc5c217d76ed3a004342c503cd
2023-11-07 13:39:29 -06:00
Moh'd Khier Abualruz 9428bd2a0c Add images to Vector 2022 beta feature
- Add images to resource/images
- Use images in the config of onGetBetaFeaturePreferences for vector-2022

Bug: T349321
Change-Id: Ib359d49719dd5854c3f060f3484c098d93c35c06
2023-11-07 18:47:38 +01:00
Jon Robson 4cf50596bb Avoid nullish coalescing operators
Bug: T350519
Change-Id: If9a8a68aa9c6766b8cf9fb84ed526317d4d723ca
2023-11-06 11:10:44 -08:00
Jan Drewniak cedf6d9438 Change Zebra module to match current Vector styles
Changes the skins.vector.zebra.styles module to match
the current Vector 2022 styles.

**Visual changes**
(All pertaining to zebra.vector.zebra.styles)
- There are no grey backgrounds
- Context boxes with white backgrounds and drop-shadows
  are removed
- Page-tools sidebar width is the same as TOC sidebar width
- Content container is narrowed from 960px to 948px to prevent
  shifting content when pinning TOC or main menu.

Bug: T347638
Change-Id: If6e1ef21f076f6a9f0f8cafb2d745a7c13afb471
2023-11-02 18:15:02 +00:00
Moh'd Khier Abualruz 2690b5559e Remove trident-hack font-size from Vector
- The Less variable @font-size-base--trident-hack is removed
-  All instances of font-size: @font-size-base--trident-hack; usage is removed from Vector 2022

Bug: T349010
Change-Id: Ie131b8f0dbb4d8050d33df969c1c49963ddc95e2
2023-10-27 14:03:14 +00:00
jenkins-bot 1db7b69286 Merge "Trigger window.resize when toggeling pinnableElement" 2023-10-26 16:47:14 +00:00
Volker E b55d95c70c styles: Replace legacy Vector breakpoint tokens where applicable
Replacing the legacy Vector breakpoint tokens with the Codex
standard ones. All names have been unified, only some legacy values
remain for backwards compatibility.
Also
- replacing a wrongly applied min-width with the correct max-width
  token,
- replacing a width with an equal value min-width one and
- removing the now equal value mobile min-width one.

Note that we can't do some reference magic here alike
`@max-width-breakpoint-mobile: @min-width-breakpoint-tablet - 1px;` as
this would take the Codex value from skin variables and not the legacy
value.
Also note, that we could move all those Vector legacy definitions into
Vector's 'mediawiki.skin.variables.less' file(s), but that would mean
that extensions don't rely on the Codex default values, but on Vector's
and we want latter to move to the standard, also in foresight of
further standardization to build for all feature teams like a
shared Grid.

Bug: T331403
Change-Id: Ifb968b1977001edb1a79e20df387c61f27043542
2023-10-25 22:03:46 +00:00
jenkins-bot 0eb580f4f7 Merge "Update pinnableHeader class when moving pinnableElement." 2023-10-25 18:36:00 +00:00
Jan Drewniak f59ceb4390 Update pinnableHeader class when moving pinnableElement.
Adds functionality to update the pinnable header class
(pinned or unpinned) after is has been moved via
movePinnableElement().

Bug: T348039
Change-Id: I23552bdbb3390222c2c8efbd5f9122a4d5021a00
2023-10-25 17:44:12 +00:00
Jon Robson 329d91c99c Vector 2022: Support dropdown creation via addPortlet
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
2023-10-25 15:44:45 +00:00