Commit graph

32 commits

Author SHA1 Message Date
Volker E 7f6f792a3a styles: Replace 'mediawiki.ui/variables' call with skin variables
Replacing 'mediawiki.ui/variables.less' `@import`
with new skin-aware 'mediawiki.skin.variables.less' standard.
Also replacing and removing scattered WikimediaUI Base v0.15.0 variables
with new skin variables.

Also
- replacing several static values with new Codex design tokens featuring
  skin variables for following properties:
  - background-color
  - color
  - border-width, border-style, border-color and border shorthand
  - border-radius
  - box-shadow colors
  - outline-width, outline-style, outline-color and outline shorthand
  - opacity
- replacing equal-value Echo variables with new skin variables
- replacing `opacity: 0` with `opacity: 1px solid transparent`, which
  improves accessibility in Windows High Contrast mode

Bump required MediaWiki core version to >= v1.41.0.

Bug: T332541
Co-Authored-by: Volker E. <volker.e@wikimedia.org>
Depends-On: I04f9e48a1cf9dee915cf51e1e12b17ff0a595a06
Change-Id: If3863f07d7c3a8b58808fb03401c1060a92bc2ab
2023-04-04 01:26:11 -07:00
jenkins-bot 1d7657f130 Merge "Improve focus styles" 2023-02-06 23:41:39 +00:00
Bartosz Dziewoński ed76ff596f Avoid hardcoded width for the popup's footer buttons
Hardcoded width interferes with OOUI's attempts to make the popup
narrower on narrow screens.

Minerva low resolution styles are now applied to all skins at
mobile/tablet breakpoints

Bug: T287132
Change-Id: Ifffe8c6330385356d35b7950ce9803f3a9f01b6f
2023-02-03 11:58:35 -08:00
Ed Sanders 6b0268a758 Improve focus styles
Ensure there is always a 2px outline, and have that
outline cover the outer border where possible.

Change-Id: I3667d01e112f40663bc370ecd5bd6c3bb71ed219
2023-02-02 16:56:25 +00:00
Volker E fe766f04ea Replace deprecated Less .box-sizing() mixin with standard CSS
Also remove 'mediawiki.mixins' includes where unused.

Bug: T306488
Change-Id: Ia9a5a1ce1e47c1de2c2197885237f9355f9cc4f2
2022-04-20 17:14:37 +00:00
Ed Sanders 7170698d68 Remove padding from popup heading
Fixes regression from OOUI update.

Change-Id: I0f2cca3417a2217f350032b8aed2f517e8ed35b7
2020-12-08 22:05:08 +00:00
Thiemo Kreuz a5d35141f4 Fix notification popup header always showing a scrollbar
This issue was introduced in patch I41ad96b (T190397). The head
element is set to 44px height. However, the box-sizing is set
to border-box, which means these 44px include the 1px border at
the bottom. This leaves only 43px inside the head. The label is
meant to fit in there. Since the previous 44px don't fit, there
was always a scrollbar.

This could as well be fixed by changing the head to 45px.
However, this would make it different from the footer. I
believe both should have the same size for consistency.

Bug: T190397
Change-Id: Id0946d872a99fb8a1fbb33e6365fd78cd22eddd3
2020-08-10 14:59:06 +00:00
Ed Sanders 3ead305c27 Remove padding reset from markAllReadButton
Buttons should be positioned with margin, not padding,
as changing padding breaks hover and focus states.

In this case the position is already fine without
additional adjustment.

Change-Id: I8a7726b2e0988117084a1d0b060b4f649ba4cc75
2020-07-24 23:31:00 +00:00
Volker E 415b7b9851 hygiene: Make LESS imports non-ambigious
Some LESS parsers will get confused with the lack of file extension.
It's better to be explicit and in alignment with recent change in core
I379334d7729e587a2a00.
It was already weirdly mixed in this repo with some imports featuring
extension and some not.

Change-Id: Ib208607c850fa2492b13cd3d449c04ebc2c21a01
2019-10-25 13:53:39 -07:00
Volker E 77021e370c Align Notifications popup header/footer with OOUI's default size
Bug: T190397
Change-Id: I41ad96bbc7d3922772ecb026cb251476882601c7
2018-03-26 20:13:08 -07:00
Ed Sanders 15a3443384 Use updated bell/tray icons from OOUI 0.26
As these are smaller canvases, fix positioning
hacks accordingly.

Change-Id: I472f8cdd5887243c3fd86ab1431532a99dba1ce9
2018-03-24 15:06:47 +00:00
jenkins-bot 010bb75603 Merge "Move the popups to the overlay" 2017-12-21 18:14:50 +00:00
Moriel Schottlender 77acb5b3ee Move the popups to the overlay
This will solve multiple issues with the design having to overcome
the theme-based design for the #p-tools.

Bug: T156080
Change-Id: Ibfcdfeea649e566059fd88485e146fbad2201016
2017-12-20 15:44:27 -08:00
Volker E 4b3782a46a Replace subtle greys with WikimediaUI color palette ones
Bug: T177723
Change-Id: Iceafe2f3e702667e0ee68b79ddcb6aa4d8fd0010
2017-10-08 10:26:43 -07:00
Kaldari 4381dbbe8a Fix gap between notification pop-up header and notifications
Change-Id: I12261ad8033af7286d426933df19611b8163d9c9
2017-09-26 18:44:56 -07:00
Roan Kattouw 0bf4861d92 Fix layout regression in notification popup footer
Caused by a new margin rule in OOUI.

Bug: T171302
Change-Id: I5746d9e6a2daa2b0d18e76a99e67c8fdaa1464d6
2017-07-21 13:04:51 -07:00
Roan Kattouw 4cf17a6712 Fix alignment of the "Mark all read" button
Bug: T169019
Change-Id: Ie63e74bef594e9c21c8a9bb615454c4a526276c2
2017-06-27 14:46:19 -07:00
Roan Kattouw dd2bdd64af Follow-up 739847c20: don't adjust the popup anchor position
We used to need to center the anchor, but I375a76a49337d3b on oojs-ui
makes popup anchors center themselves, so this is now harmful.

Bug: T163993
Change-Id: I345727ae4175fd9d3cea024f43df802bcd401838
2017-05-02 10:55:02 -07:00
Roan Kattouw 739847c20f Fix RTL popup alignment for OOjs UI 0.19.5
Popup alignment corrections are now done with margins on the anchor,
not directly on the popup. Setting "left" also didn't have any effect,
because it was being overridden by inline styles set by the new
PopupWidget/FloatableElement code.

Bug: T159999
Change-Id: I7738edee7ae096fcc116a79e71a591a2287ea34f
2017-03-08 15:39:50 -08:00
jenkins-bot 14f261a2fc Merge "Revert "Remove FloatableElement hack, no longer needed"" 2017-03-08 01:48:27 +00:00
Catrope 8b396ec675 Revert "Remove FloatableElement hack, no longer needed"
We still need overflow-x set to a non-visible value, so that
the overflow-y: visible rule doesn't take effect. If it does
take effect, it breaks clipping.

This reverts commit 97bde4d21a.

Bug: T159888
Change-Id: Id834d9cf9615a8d2dad27faf2eb89743ad95da9d
2017-03-08 01:23:09 +00:00
jenkins-bot 4ef0594a30 Merge "Remove FloatableElement hack, no longer needed" 2017-03-02 06:46:12 +00:00
Roan Kattouw 3e8f028ffe NotificationBadgeWidget: Fix appearance of bottom buttons for OOUI changes
This time we actually get to *remove* a hack that overrides OOUI,
which is always nice. Also add our new dependency on future-magic
forthcoming MediaWiki version.

Change-Id: Icef086e6b19dffb34eefe7b5658b57e020c5de8b
2017-03-01 22:04:05 -08:00
Roan Kattouw 97bde4d21a Remove FloatableElement hack, no longer needed
T130153 is now fixed in oojs-ui. However, we can't set
overflow-x to visible because that breaks clipping.

Partially reverts 02252d0531. Depends on I22f2ca72cf7c2f in oojs-ui.

Change-Id: I726aada60238d17227e4475637bd3d9befa1b4c3
2017-01-24 13:12:04 +11:00
Volker E 6d2e560c1e Introduce stylelint
Introducing stylelint with configuration rules compliant to
Wikimedia CSS Coding Standards 'stylelint-config-wikimedia', nullifying
some for now and making majority pass.

Change-Id: I2c4acee41c9b56d9b00e2a2c5b7ab0ab5de454ce
2016-10-04 18:15:02 -07:00
Volker E 819545ed7e Add box-sizing mixin
Replacing standard `box-sizing` with MediaWiki's Less mixin, which also
features prefixed properties for older browsers like Firefox 28 and below.

Change-Id: Iafb88b192045fb7df6bbe6954a166a198d04c5cf
2016-10-03 13:21:54 -07:00
Moriel Schottlender b5c0b2458d Align popup to center of the new badges
Bug: T141677
Change-Id: I24c1a12f325ca6a432d6fe9cc5635fbde10b1685
2016-08-01 13:57:40 -07:00
Ed Sanders 1e4ed9cafe Remove extra 1px top border and margin from popup list
Bug: T140354
Change-Id: I06bfc014f485b9cd460dfda0a9c7f982de4f9bf6
2016-07-14 13:30:03 +01:00
Ed Sanders 1f002745a7 Wrap table-cell buttons in table-row
Removes unwanted 2px bottom margin from footer buttons.

Change-Id: I67c1d5f21d7c62a436010932e3d7b6257e4b73ff
2016-06-21 20:24:20 +01:00
Roan Kattouw 65c6b8cbaf NotificationBadgeWidget: Fix header getting larger when "Mark all as read" present
The "Mark all as read" button had margins that made it just a little
bit taller than the header would otherwise be. This pushed the
bottom border of the header and the top border of the first notification
away from each other.

We only need top and right margins on this button, so drop the
bottom and left margins.

Bug: T137778
Change-Id: I8d47d84c79cbdad707b8cbaa8d43187c054755b3
2016-06-14 11:12:54 +01:00
Moriel Schottlender 070656731d Adjust styling for Special:Notification items
The items should resemble the popup items, but the styles clashed
with the popup's cross-wiki notification item, so the image size
was smaller and the border was incomplete.

Bug: T136572
Change-Id: I3c3f825d469ccee1e711da21f627eeb9491e9480
2016-05-31 11:30:35 -07:00
Moriel Schottlender 8e76bc4126 Refactoring Echo's front end for MVC
Changing the way Echo's front-end architecture works to work with
model-view-controller methodology.

Change-Id: I97862402c41bc04dd41cd08d79f19ff677340249
2016-05-18 12:28:45 -07:00
Renamed from modules/ooui/styles/mw.echo.ui.NotificationBadgeWidget.less (Browse further)