Remove direct usage of CSS variables in Minerva, and replace them with
codex design tokens again. Document this decision in the original ADR
Note: there are still a small number of CSS variables in use, including
most notably the --color-link-red fix, which broke when I removed it,
but this change takes care of all the ones that could be easily replaced
Bug: T363743
Change-Id: I7d3a9dceb908167078987de1733774c8bd4bea2f
Currently we are using the --color-inverted token, which is double
inverted in night mode, yielding insufficient color contrast with the
blue (progressive) background when the page has been recently modified.
Instead, use the @color-inverted-fixed token, which stays white in night
mode for backgrounds which are darker regardless of mode (additionally,
switch back to using LESS variables as this is the new recommendation)
Visual change due to bugfix
Bug: T364123
Change-Id: Ib284abffd6907272e580986fb08c2b8dee5a1a47
Since `initMediaViewer()` can be invoked via
`mw.hook( 'wikipage.content' ).fire($container)` it's better
to validate that $container is in fact an HTMLElement and not
an empty jQuery collection.
Bug: T360781
Change-Id: Ib43327dd70c35918e3079c7b6b23a161383654b5
In order to prevent spikes in JS errors, ensure that the $container
element exists before initializing the mobile media viewer.
Bug: T360781
Change-Id: I48a57e8008e7bd90e9fcfc783f3720f6f75520a7
This reverts commit bca9223bb1.
Reason for revert: This is now longer needed following the work
in Ia253de68f94236e7fe2219b736dd6084c64ce838.
Bug: T359983
Change-Id: Ibd3013169f26531a0cd879c143692e7030709808
The classes:
- skin-night-mode-clientpref-0
- skin-night-mode-clientpref-1
- skin-night-mode-clientpref-2
is being replaced with
- skin-theme-clientpref-day
- skin-theme-clientpref-night
- skin-theme-clientpref-os
- Moved $forceNightMode to be a text parameter (dat|night|os)
- Keep adding the old classes to the html element, to give the ability of gradual deployment
The preference is renamed from minerva-night-mode to minerva-theme (a follow up to consider
migrating existing values will follow).
The query string minervanightmode continues to behave the same but now
accepts other values such as day, night and os.
Bug: T359983
Change-Id: Ia253de68f94236e7fe2219b736dd6084c64ce838
The current white text on a green background is not an accessible level
of color contrast. We were instead recommended to use
@background-color-progressive, so let's do that
In addition, remove the previous definition of
@background-color-last-modified-bar-active as it's no longer being used
Visual change for pages on mobile that have been updated recently
Bug: T358736
Change-Id: If5b97b785e95df75645be62847cef396f6be68b6
This patch promotes a consistent design decision across projects in
MediaWiki core, extensions, and skins. The darker red color meets the
W3C Web Content Accessibility Guidelines (WCAG) at Level AA that text
or images of text must have a contrast ratio of at least 4.5:1 (or 3:1
for large text).
Bug: T343239
Change-Id: I771fec3f567ea7ce5a25f8c63d88c956a27121ef
Required for proper presentation of page issues overlay
and multimedia viewer.
The div rules were unnecessary.
Bug: T205341
Change-Id: I6fea0f2013a11e5248b71619b795d794c8ed18ad
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
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
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
The fragment in a URL like http://example.com/foo#bar#baz doesn't end
when there is another # somewhere. That # is part of the fragment.
I'm not sure since when this issue exists. It's already in the first
version of this codebase from 2017, see Iff1f7e6.
Bug: T332007
Change-Id: I3b0726380d2f385475f5ba53aeab16932d7ccaa7
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
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
When $wgReadOnly = true; in LocalSettings.php the edit icons
appear locked and when clicked should show a warning.
This also addresses deprecation warnings in the code and
tidies up the ES6 code.
Note to reviewer: Please use git diff HEAD^ -w
when reviewing this diff. Mostly whitespace changes.
Change-Id: I3fa83cc1dc4da62260fd0ef50ac14805c3e1282b
Partial revert of I192c6d4235c57f69cf48dcd67aa6c4810df62dfa
The deprecation notice seems incomplete. The two functions are not
equivalent and we have various usages elsewhere in the codebase.
Bug: T346685
Change-Id: I063daa217708c3bebac97af7be9eedab01f5217b
Most of these are captured in other bugs
The anon talk message style doesn't do anything.
Bug: T344022
Change-Id: Iba1fce98ea05931fe07b2b20f07c62d198039d1b
Fixes "[1.40] Use of PageGateway is a NOOP and deprecated. Please remove this call."
Fixes Use of "navigate" is deprecated. use navigateTo instead
Change-Id: I192c6d4235c57f69cf48dcd67aa6c4810df62dfa
- Removes 'mw-ui-icon-with-label-desktop' as that is now the default behavior for icon only buttons in Minerva
- Removes icon flushing classes, use codex mixins instead
80 Visual changes relating to minor icon/button subpixel changes in the heading, edit section links, and page actions
Bug: T319260
Change-Id: I503b643d33e43196483af4b5f9dd312237322ac8
In I1ccda3878a658d4251429ae65ebee04c09d81243, core decided
to technically allow temp. users to have watchlist access,
but have it disabled on permission level
(viewmywatchlist / editmywatchlist) instead of by isNamed() checks.
Minerva expects the watchlist permissions to be assigned to everyone,
but actual watchlist access to be available only to named user.
This is an incorrect assumption. Make a clear difference between
"page is watchable" concept (watch icon should show) and "user has
permission to watch" (if not, CTA to log in should show).
There is one additional step to fix, which is ensure
temp users receive the T330518 drawer. That is not a bug
in MinervaNeue, but in core -- mediawiki.page.watch.ajax.js uses
e.stopPropagating(), which means Minerva's CtaDrawer doesn't get
a say. Ideally, mediawiki.page.watch.ajax.js would know whether
the user has permissions to edit their watchlist. Alternatively,
it could have an interface to allow extensions to add their own
error handling. See T344925 for details.
Bug: T344870
Change-Id: Id1757fb4fb433fe39cf4d5c6e1e9c65ab5abae14
Legacy icons shouldn't have the minerva-icon class as this is meant
to be reserved for Icon template (Codex icons)
Bug: T342908
Change-Id: I63556fe42c8650bc5f0d6e5a0c5328b3f29d75f3
Use the Button.mustache partial in the
PageActionsMenu.mustache template.
This converts the page actions menu to use the Button
template in a way that doesn't change the existing HTML.
The mw-ui-icon-element and mw-ui-icon-with-label-desktop
classes are placed onto the Button.mustache markup.
Bug: T342908
Change-Id: Ib5dadd929eea2e72a24e061c4174348615890617
Changes
* Update FIXME in userMenu.less to merge selectors
* We replace minerva-user-notifications class with minerva-notifications
to short-circuit Echo's code so that it no longer replaces the Minerva
notification badge with its own.
* We update resources/skins.minerva.scripts/initMobile.js to introduce
our own wire up code - this is responsible for opening Echo overlay
and reseting the counter. The code in Echo will be removed in a follow
up (see <I2f923e509d24524a2375ffbe6b3ef336487574bb>)
* We update skinStyles/ext.echo.styles.badge.less with styles from Vector 2022
so that Minerva desktop remains consistent with desktop Vector 2022 experience.
* We clearly mark technical debt relating to the special mobile version.
Testing:
* Pixel.js has a group echo that covers all the different variants.
Make sure to update to latest main branch before running these.
* Desktop should behave the same for Minerva as Echo.
* On mobile only when a user has unseen notifications a red circle
is shown. Otherwise a bell icon is shown, never with number.
* On mobile a single button is visible that combines alert and count
numbers.
* With Echo disabled a bell shows that links to the user talk page
Visual changes:
* Previously the red circle became a transparent/gray circle on click. Now
it will always be red.
* Minor aligment changes to red circle and bell icon are expected as
the change prevents MobileFrontend/Echo updating the icon to use
Codex.
Bug: T342907
Change-Id: I55c18cf723a32f80b93a01dd0687e005162c4e93
This reverts commit 7856f79d11.
Reason for revert: This version of the instrument isn't in use. It was
enabled on the Beta Cluster but then superseded in I39adbce1f2c8.
Change-Id: I273a6f21a881f69298d6219e435639ced0fe8afe