Commit graph

339 commits

Author SHA1 Message Date
jenkins-bot e5c670f25b Merge "Move color-scheme property from :root to .skin-night-mode-clientpref-2" 2024-03-01 22:02:22 +00:00
jenkins-bot 351cfebce9 Merge "Invert all icons in UI that use background-image" 2024-03-01 21:42:28 +00:00
Jon Robson 89c99df5ef Invert all icons in UI that use background-image
Bug: T356822
Change-Id: I02e89837310009135d084ba31ab76fe2be5907af
2024-03-01 15:09:35 -06:00
Jan Drewniak 0efbd88259 Move color-scheme property from :root to .skin-night-mode-clientpref-2
The color-scheme property allows certain elements
to change their appearance based on the system
light/dark mode settings.

Therefore, this property should only be applied if "auto"
night mode is enabled.

Bug: T358814
Change-Id: Ic2b836d9696706ab2c628e78cc2592716963e9a5
2024-03-01 14:00:37 -05:00
bwang 9f541aafcc Set background/color to inherit for common templates
Bug: T358164
Change-Id: Idb1c4ee6ff28ae576a144a8f661d772f9312535b
2024-02-29 23:24:52 +00:00
Jon Robson f7124fdc6c Separate image inversion from widget inversion
For images only the filter is needed, not the entire
widget

Bug: T356822
Change-Id: Id0ace19d4071a987d132224612724259ed40aa1b
2024-02-27 11:29:06 -07:00
anterdc99 0e068128a6
Assign a default background color for tables using "wikitable" class
Bug: T358449
Change-Id: Ia43683fe51aaffb08d08e40f5fe670d663749daa
2024-02-26 03:17:04 +08:00
Jon Robson c94c90d93d Adds color-emphasize to palette
Needed by the language overlay

Bug: T356825
Change-Id: I1d9551f1b42dec5be715e889069279f97f64749e
2024-02-23 20:21:02 +00:00
bwang dd32e6731d Add icon background styles to codex CSS icons
Bug: T358160
Change-Id: I6b7ec3c4e3837a68da98bd9f58dbade5fb4fa1ed
2024-02-23 20:20:26 +00:00
Jon Robson 9cec6a2230 Skin invert shouldn't apply in day mode.
Bug: T356425
Change-Id: Ic5c754734f7df093629d1121d61e89cd1f3225fc
2024-02-23 18:28:47 +00:00
Jon Robson d32a682aad Allow things to be mark themselves as invert-able
When content is inverted via CSS filter, this sometimes inverts
CSS variables which have already been themselves inverted. Allowing
markup to explicitly mark itself as invertable would be helpful.

For now, usage is intended only for extensions integrating with
the skin. Since we're not sure this can be considered a stable
interface by editors we intentionally use the `skin-` prefix rather
than `mw-` interface given the note about confusion about what is
stable in [[mw:Stable_interface_policy/Frontend#Writing_code]]

Bug: T356425
Change-Id: I0cd0e36a6abe0bba9e98d1b319e636bef2952301
2024-02-21 15:49:26 -08:00
Jan Drewniak 7f1e394e9e Follow-up to a30b575271 Map color-based skin variables to CSS variables
Add an @import for Codex variables, i.e.
@import 'mediawiki.skin.codex-design-tokens/theme-wikimedia-ui.less';
that adds overrides to the variables from
'mediawiki.skin.defaults.less' to CSSCustomProperties.less.

Bug: T356427
Change-Id: I7c2c3a07899b4de735f7e7fd24e003ab69d449bb
2024-02-21 10:17:39 -05:00
Jon Robson a30b575271 Map color-based skin variables to CSS variables
Additional changes:
* Separate CSSCustomProperties.less from skin.less so that
we can obtain the unmodified original values for the colors

Depends-On: I363a97d33d85a9033da753f2a8fe730d80206639
Depends-On: I148eaca747352ffdc9d1423f20d34bd5a1d0e447
Bug: T356427
Change-Id: I916450c276cabb0c7c871525c50f95fb87f498ad
2024-02-21 00:36:13 +00:00
jenkins-bot 7926101f48 Merge "Remove the rest of the reset" 2024-02-20 21:22:11 +00:00
Volker E d84216b0db styles: restore bold for captions in tables
This fixes the regression introduced in I6331d88e5b73.
Also un-nesting selector to necessary level.

Bug: T357849
Change-Id: I58ed32e63ad4c37aefd79edac5f1376ce4313ee3
2024-02-20 01:34:27 +01:00
jenkins-bot 9f2a7a829b Merge "Add --color-link--visited to night mode palette" 2024-02-16 18:49:52 +00:00
Jon Robson 003d9fea5b dd elements should have no margin
In 1.42.0-wmf.17 these had margin 0 in Minerva.
I incorrectly assumed we had defined an explicit margin in content
and for talk pages but apparently none exists, so I have restored
this rule to the list.less file.

Follow up to I6331d88e5b7301fd13249414350a539738cfae53

Bug: T357742
Change-Id: Ib3062bfbffe35415f479bae46ecf02e8a094958b
2024-02-16 16:56:26 +00:00
Steph Toyofuku c98508facb Add --color-link--visited to night mode palette
Right now visited links in night mode are showing the day mode style for
@color-visited, because --color-link--visited is defined, but never set
to a corresponding night mode style.  This defines the night mode
variant in the stylesheet, and sets it to the same value as
--color-visited

Visual change only in night mode, which is behind a feature flag

I also added /coverage/ to the eslintignore, as I was getting failures
on the pre-commit hook due to us linting the coverage report 🙃

Bug: T356825
Change-Id: I96695fe4c094b79385e36aef9e29b8d392c06302
2024-02-16 09:35:19 -05:00
Jon Robson 70e68aedd8 Remove the rest of the reset
VISUAL CHANGE:
* Improves top margin on User common.js for code

Bug: T205341
Change-Id: Ia402fd069341da14532d332fab7c109d34c7208d
2024-02-15 19:56:46 +00:00
David Lynch 57d1b2ab5b Add border-collapse to wikitable
Follow-up to 7c9304cbf4 which removed it
from all tables.

Bug: T357589
Change-Id: I1d62a9b2c0f571389f5cbebdc56b24ff4c325283
2024-02-15 18:28:33 +00:00
Jon Robson 145db70286 Reset: Drop p and div inside overlays
Required for proper presentation of page issues overlay
and multimedia viewer.

The div rules were unnecessary.

Bug: T205341
Change-Id: I6fea0f2013a11e5248b71619b795d794c8ed18ad
2024-02-14 22:20:43 +00:00
jenkins-bot 50a55bce7d Merge "Invert logos" 2024-02-14 22:00:47 +00:00
bwang 1e9de11ccf Invert logos
Bug: T356823
Change-Id: I5ccaa865197dd70afb524b3d47515ebc8e9db214
2024-02-14 21:35:27 +00:00
Steph Toyofuku 91c9e68afb Fix borders in night mode palette
Following a discussion in the ticket, update the places where `#eaecf0`
has been hardcoded to reflect whether it is intended to be a border or
background style and replace with CSS variables where applicable.  Add
`--border-color-muted` as a CSS custom property, and update the night
mode palette to use it.  Lastly, add `--color-error`, to be used in a
subsequent patch

Visual changes, but again gated behind night mode feature flag

Bug: T356825
Change-Id: Icb5741190f3e80a20dcedf9b13d6a34fe619b467
2024-02-14 16:18:21 -05:00
jenkins-bot cab803db1b Merge "Reset: Further simplify the reset" 2024-02-14 11:58:13 +00:00
Jon Robson ea6c55f925 Reset: Further simplify the reset
* Move pre to content/text.less
* Move heading styles to text.less
* Move search input styles to ui.less

Bug: T205341
Change-Id: I333918089af1c20e9467ad57596dd9dd6925869a
2024-02-13 18:23:28 -08:00
bwang 3d95788553 Flip page issue background color
Bug: T357179
Change-Id: Idd59beb17744ce247be66446dc11214e27328fd3
2024-02-13 21:21:25 +00:00
jenkins-bot ad02a53e8a Merge "Restore link active color" 2024-02-13 17:18:55 +00:00
Jon Robson 138769f60f Restore link active color
Bug: T357381
Change-Id: Idee0532800127285618d3c709eb39d1bf32f83a8
2024-02-13 08:32:40 -08:00
Steph Toyofuku 54d577d9b4 New night mode color palette
Update the `night-mode-palette` styles to reflect the updated design

There is definitionally a visual change, but should only be for night
mode (which is currently gated behind a feature flag)

Bug: T356825
Change-Id: Iebe3b91cdf9e5e5effb2bc3ab4ff75859024056f
2024-02-13 10:22:11 -05:00
Jon Robson 3224b026e4 Font size for search input and overlay search should be consistent
Follow up to: I6331d88e5b7301fd13249414350a539738cfae53

Bug: T205341
Change-Id: I344be341bff06212e911a6935cca4b7551bcf227
2024-02-09 00:01:11 +00:00
jenkins-bot 4121d8c699 Merge "Fixes: Notification icon displayed with bullet point" 2024-02-08 00:55:09 +00:00
Jon Robson aea4156fe7 color-link-visited was not defined
Follow-up to 59fd0cd

Bug: T356928
Change-Id: I079f3de333fd59162f4e2b87d896bb273b3e9b3c
2024-02-07 15:55:43 -08:00
Jon Robson 56e0d84bdc Fixes: Notification icon displayed with bullet point
Follow up to: I6331d88e5b7301fd13249414350a539738cfae53

Bug: T205341
Change-Id: I60b7919d53cf101e4026950331fff93fbef76ac5
2024-02-07 23:05:09 +00:00
jenkins-bot ec453ac037 Merge "Replace reset with SkinModule normalize" 2024-02-07 14:38:30 +00:00
Jon Robson e5fa425a84 Set text color on infoboxes
When defining background we should also define color to avoid mixing
styles provided by editor, and us.

This fixes the black on black in infoboxes on the Paris article
for example in night mode.

Bug: T356074
Change-Id: I5a73f5eaf269cb8f771663a9181a67f9af723b13
2024-02-06 13:22:49 -08:00
Jon Robson 7c9304cbf4 Replace reset with SkinModule normalize
Retain the existing font,
margin and padding values as without
these we would trigger a visual regression.

Visual change: Four minor visual regression with this change
relating to the button in the AMC CTA Drawer and suggested
edits overlay heading. All are acceptable.

Bug: T205341
Change-Id: I6331d88e5b7301fd13249414350a539738cfae53
2024-02-02 18:00:45 +00:00
Jan Drewniak 59fd0cd5dc Convert all color related Less variables to CSS custom properties
All colors used in Minerva are converted from Less variables
into CSS custom properties. A new file called CSSCustomProperties.less
is created in the skins.minerva.base.styles module to store
these custom properties and an ADR is provided on the rationale for
dropping support for browsers that don't support custom properties.

The new CSS custom properties follow Codex design token conventions
where possible (and noted when not).

Link colors are unique because their styles are defined in core,
so in that case the Less variables values are set to custom properties.
Those values are then fed back into MediaWiki core for core link
styling.

Also adds a temporary night-mode color palette under the
.skin-nightmode-1 class on the <html> element.

Bug: T356074
Change-Id: Ida1f14138f12bd3c600c264bde7b5100f9dbf4ff
2024-02-02 17:57:27 +00:00
Jan Drewniak be0b43042e Convert Less variable names from camelCase to snake-case
Converts all Less variable names from CamelCase to snake-case
per the MediaWiki coding conventions.

Removes the following unused Less variables, mostly
related to icons, since those were converted to Codex:
- @icon-touch-area-sm
- @icon-touch-area-md
- @min-size-icon (replaced with @size-icon-medium)
- @icon-glyph-size-sm
- @icon-size-sm
- @icon-padding-sm
- @icon-glyph-size-md
- @icon-size-md
- @margin-icon-md-labelled

Bug: T350581
Change-Id: I1b16e77942d9bea20dcc5636a63d64aa2325a173
2024-01-31 15:24:31 -08:00
Derk-Jan Hartman 33797c9a02 Replace page-list with mw-mf-page-list
This class was renamed in Ia33d199b84c978bf26bbaa1645515ae186bd26be

Bug: T337741
Change-Id: I508d8947b6091c216fab13fa608090b894929dad
2024-01-27 23:38:53 +01:00
Ed Sanders 8ef144f936 build: Update linters
Change-Id: I5aa3ab891890b52057a5fc855315e5b1b2203037
2024-01-24 22:02:12 +00:00
jenkins-bot 56a4b8686a Merge "Fix alignment for nearby and settings items in menu, and correctly hide when JS is disabled" 2023-12-14 22:34:13 +00:00
Steph Toyofuku 5e35d585cf Fix alignment for nearby and settings items in menu, and correctly hide when JS is disabled
Removes a `display: inherit` that was causing issues with the alignment of these two items in the menu.  In addition, correctly sets display to none for jsonly-specified list items when client js is disabled and rename the class to make it more specific to the menu items

Note: this will have a visual impact as it is fixing what is currently a visual bug.  The jsonly hiding will also not work with cached content, but since it's currently broken we figured this was acceptable

Bug: T346670
Change-Id: I56d2c4fcba09d199a0fd6aad2f1621509bbfaba5
2023-12-14 21:58:39 +00:00
jsn c5bced40fb show article footer on diff pages
Bug: T350637
Change-Id: Ib1b75956a2595b4fc51bfe2acfd83b251dcec079
2023-12-14 14:13:19 -06:00
Bartosz Dziewoński 97aed1ad86 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: Ib97d034ab533124f06441e788c8608fb274dccf0
2023-11-27 20:03:16 +00:00
Bartosz Dziewoński 6294ca7196 Reduce CSS size & specificity for headings
Nesting these rules inside `h1, h2, h3, h4, h5, h6 { … }` generated
some enormously long selectors (as the whole selector had to be
repeated 6 times). It's not needed, as these elements do not occur
anywhere else.

Change-Id: I1647e37ff9a0c975d9320e4c34857f210a1858c2
2023-11-27 18:31:54 +00:00
Bartosz Dziewoński d3c5b8a6b2 Restore section edit link styles
The 'edit-page' class is no longer applied to section edit links.
Follow-up to I9f768706c0a0f14f14ee4b3812288218bef36018.

Remove a rule that seems no longer needed.

Bug: T351853
Change-Id: I0891332d613d152374c37f232ed596292d89b583
2023-11-27 19:29:31 +01:00
Bartosz Dziewoński 5f17c89649 Remove unused CSS for cached HTML
Searched for /fixme.*remove/.

Follow-up to:
* I55a25dfb8aba3d1b589a36ba4cba3bba0fe710a1
* I98443b0dcb88911a5314092216809387b4fb80dc
* I3c9d59f49f1b939981a7b2b450448db6736d5958
* Ie24c0215d07d5e4605d8479ed9e950a3d9c9b086

Change-Id: Id52487f6f5e4802ea2700c51e87e63565f340f5d
2023-11-17 18:52:27 +01:00
Jdlrobson ca28efc9c7 Drop mw.mobileFrontend references
This restores the previously reverted patchset
If5b76245bf60bfa9cf977cdbf37ee0d6bb65f9d9

Changes since original:
* Added Depends-On to MobileFrontend
* Uses OOUI classes for page issues rather than es6 classes - ES6
classes do not support modifications to class prior to running
super so MobileFrontend's View class is not compatible without
significant refactors.

Depends-On: I24ad75adf8519102ca356d64d99d765ab69180cc
Bug: T348807
Change-Id: I4ff82af0251254c846f2caee330af5af738f6029
2023-11-10 01:30:52 +00:00
Jdlrobson 2ee3e27406 Revert "Drop mw.mobileFrontend references"
This reverts commit 19ea6328b0.

Reason for revert: Breaks page issues and image overlay. I
will break this up into smaller less risky patches.

Change-Id: If5b76245bf60bfa9cf977cdbf37ee0d6bb65f9d9
2023-11-03 19:26:16 +00:00