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
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
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
This fixes the regression introduced in I6331d88e5b73.
Also un-nesting selector to necessary level.
Bug: T357849
Change-Id: I58ed32e63ad4c37aefd79edac5f1376ce4313ee3
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
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
Required for proper presentation of page issues overlay
and multimedia viewer.
The div rules were unnecessary.
Bug: T205341
Change-Id: I6fea0f2013a11e5248b71619b795d794c8ed18ad
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
Add a skin-night-mode-page-disabled class to the HTML element when
a page was disabled by the new MinervaNightModeOptions configuration
flag.
Bug: T356653
Change-Id: I7a6582ef8f66e78cc6f07da06bc4d2a3277cfcf0
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
This reverts commit d33a0423b1.
Reason for revert: CSS variables are currently not compatible
with fill colors
Bug: T356540
Change-Id: I29c92bb2407a5b8ed38e09a0f48ec834c671c912
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
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
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
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
The latest update of 'svgo' dependency includes three optimizations on
converting path commands, which
- improves closing paths and how we determine if to use absolute or
relative commands.
- round arc or convert to lines based on the geometric sagitta
- convert cubic Bézier curves to quadratic Bézier curves where possible
Also unifiying npm command to qua standard notation `minify:svg`.
Bug: T354875
Change-Id: Ibf59b3435b82602c5355b6f1c9b03920ea2e8eab
Once the cache has cleared out and all tab links are nested in li
elements (983960), follow up on the fixmes introduced and update the
stylesheet to reflect the single way we will be styling `minerva__tab`s
going forward. This should not be merged until after the break to
ensure the cache has had time to clear
No visual changes on this one as it _should_ effectively be a noop
Bug: T340728
Change-Id: I36be5ab3cacfb5e0c0f056264055509d2ee22271
Currently `mw.util.addPortletLink` cannot properly add a portlet link to
the associated pages tabs, as there is no `p-associated-pages` id on
mobile. This change pulls the id from the page data, and adds the
necessary class for the tab to be styled correctly - since tabs do not
have corresponding icons while most portlet links do, we also branch on
this class (effectively on whether we are in the tab container) to
ensure an icon is not inserted
Finally, I added a few comments and spacing in the sections of code that
I touched to make them more readable and resolve some of the linter
warnings, but happy to hear if these are not helpful!
Bug: T340728
Change-Id: I33fc12611a6238552a3eb47f6ca37f087903a92a
