Use the Codex experimental design token build to
providing CSS custom property version of design tokens
for night mode.
The build also provides Less variables which are
references to the CSS custom properties. These are
pulled into the mediawiki.skin.variables.less file
and propagated across core and extensions.
Bug: T358059
Change-Id: I78558f6cc1de91d62fb9f8cbf571f73b51eae8ca
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 reverts commit d33a0423b1.
Reason for revert: CSS variables are currently not compatible
with fill colors
Bug: T356540
Change-Id: I29c92bb2407a5b8ed38e09a0f48ec834c671c912
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
I04f9e48a1cf9dee915cf51e1e12b17ff0a595a06 provides neutral values for
the Codex tokens in mediawiki.skin.defaults.less in MW core, and expects
skins to import the appropriate Codex themes in their
mediawiki.skin.variables.less.
For MinervaNeue, import the Codex tokens for the “WikimediaUI” theme.
Remove variable assignments that are now redundant because their
values are the same as the Codex tokens.
After importing the Codex tokens, override some of their values where
necessary so that all variables' values stay the same(*). We should
consider whether to remove some of these overrides in a follow-up patch,
but keeping everything the same for now makes this change less
disruptive.
(*) As in the core change, one variable's value does change:
- @max-width-breakpoint-tablet from calc(719px) to 719px
This has no visual impact.
Bug: T325237
Depends-On: I3a8c89d8558022077be1f32c6a6f4733b6302948
Change-Id: Iafb3c60df0de87f7ba234b5972e75d85c046c4f9
MinervaNeue sets its own variable definitions of all link color
variables. Note that this is currently a copy of Vector 2022's
definition and pointing back to Wikimedia Design Style Guide and
Design System.
In the long term both skins should be updated to use the same tokens
package.
Also with this change comes an update visited link color from the latest
design agreements in alignment with Vector 2022.
Change-Id: Ibda474f9e37ce7f510364bf15c6be661b6e0304b
Making Minerva use the `elements` feature is not
practical at the current time. In lieu of that, we
update the link colors to use the core definition.
The red links and external link colors
can come from the "content-links" module.
This also adds support for the underlining user link preference
and better plain link support.
Bug: T274717
Change-Id: I600257e6f4430f166331c4ea4f3a72d87aa377d8
For now, only define:
- @font-family-sans (unused in MinervaNeue, but for possible future use)
- @border-radius-base
With current implementation before this patch, MinervaNeue is relying on core's default
`@border-radius` which is set to `0` to be close to HTML default.
MinervaNeue is currently not applying correct skin's `border-radius`.
Bug: T263270
Change-Id: I9a149eefd15efede27416ada4db07072e53628ec
