Replacing error colors with amended design system values.
Note, that error icon color is slightly lighter than the error
text color.
Change-Id: Ia25a9accff2c8ed643252c2cc609b9bb63db4c47
Modules loaded with packageFiles are always executed in module scope
(with a closure), even in debug mode.
The behaviour of non-packageFiles debug mode is the only reason files
have closures.
https://www.mediawiki.org/wiki/Manual:Coding_conventions/JavaScript#Closure
Change-Id: I14ac680eb67d892618bbc13be9298ec9b8e0e2e9
It moves watchStar.less from .scripts to .base as star is
visible also when JavaScript isn't enabled so the right
time to apply styles to it isn't after scripts are added
but right from beginning to avoid initial animations.
It also limits minerva-animations-ready to transition
as that's the only style that needs page load to actually
happen and otherwise the styles will be limited to
JavaScript clients which isn't intended here.
Bug: T376872
Bug: T376559
Change-Id: I394d21689cae01822cf8791b361cd450771f5c31
- Define icon size variables in icons.less
- Update icon classes to use
.cdx-mixin-css-icon()
- Remove temporary fixes in icons.less
- Add 'codex.styles' dependency in skin.json
- Set 'useMaskImage' to true in skin.json
Bug: T374145
Depends-On: Ia8f770aec365da77b39cb0258f546df7894e6ba4
Change-Id: I87b060cf98194d81679da2610944f58e8d941389
Resubmission of Ib68f45d93a (548e94da98), which caused an error due
to `require('../../`)` not working outside the module base directory.
This is fixed with regression test in T373065.
Further confirmed in this repo by viewing
`/wiki/Special:CreateAccount?campaign=loginCTA&useskin=minerva`
with this patch applied. Without the T373065 fix, the console warns:
> Error: Cannot require undefined file …/ToggleList.js
-------
Support for private require() in tests is available since MW 1.41:
https://mediawiki.org/wiki/RL/PKG#Private_export_and_importhttps://mediawiki.org/wiki/RL/PKG#Virtual_files_in_traditional_modules
This fixes a confusing assertion in page-issues/index.test.js,
where for "insertBannersOrNotice()" it was asserting that the HTML
contain "⧼skin-minerva-issue-learn-more⧽", where the ⧼ character
indicates the message is not found (i.e. an error).
The test had to be written this way in order to pass, because
the skins.minerva.scripts module was not actually loaded, and thus
its templates and messages are not present either. This lack was
filled in by index.js for mw.templates, but not mw.messages.
By adopting private require(), these workarounds can all be removed.
== Motivation ==
In change I3a4024ccf90e505581, I'm working on improving the testrunner
config to enforce uselang=qqx on all tests. This is passing except
for GrowthExperiments and Minerva, both of which have the above
workarounds in place that caused a message to be undefined, and then
kept in the assertion expectation. When using uselang=qqx, values are
returned as (key) instead of ⧼key⧽, which exposes these message
existence errors.
By removing this workaround, the test will simply import the module
in the test as normal, thus the messages will exist, and thus it
will expect (key), and thus it will continue to pass even after
enforcing uselang=qqx.
Bug: T373482
Depends-On: I777f2c12e845a738edeac00e19818d4c939a1ef1
Change-Id: I6348e5ae00776c2c01d91fa90a431b6ffe3da25d
This reverts commit 548e94da98.
Reason for revert: The patch was causing the following error on pageload
Error: Cannot require undefined file includes/Skins/ToggleList/ToggleList.js
require startup.js:1006
Bug: T373482
Change-Id: I22751109c124795af7d2e0ad6c4104745b2d6632
Added to MediaWiki core last year with I9fca9fdf9b7623b1.
This fixes a confusing assertion in page-issues/index.test.js,
where for "insertBannersOrNotice()" it was asserting that the HTML
contain "⧼skin-minerva-issue-learn-more⧽", where the ⧼ character
indicates the message is not found (i.e. an error).
The test had to be written this way in order to pass, because
the skins.minerva.scripts module was not actually loaded, and thus
its templates and messages are not present either. This lack was
filled in by index.js for mw.templates, but not mw.messages.
By adopting private require(), these workarounds can all be removed.
== Motivation ==
In change I3a4024ccf90e505581, I'm working on improving the testrunner
config to enforce uselang=qqx on all tests. This is passing except
for GrowthExperiments and Minerva, both of which have the above
workarounds in place that caused a message to be undefined, and then
kept in the assertion expectation. When using uselang=qqx, values are
returned as (key) instead of ⧼key⧽, which exposes these message
existence errors.
By removing this workaround, the test will simply import the module
in the test as normal, thus the messages will exist, and thus it
will expect (key), and thus it will continue to pass even after
enforcing uselang=qqx.
Change-Id: Ib68f45d93a7054ed8bd35fc5644e2852f2f90248
* eslint-config-wikimedia: 0.27.0 → 0.28.2
The following rules are failing and were disabled:
* tests/selenium:
* implicit-arrow-linebreak
* no-mixed-spaces-and-tabs
* grunt-banana-checker: 0.11.1 → 0.13.0
* stylelint-config-wikimedia: 0.16.1 → 0.17.2
The following rules no longer exist and were removed:
* stylistic/selector-list-comma-newline-after
* braces: 3.0.2 → 3.0.3
* https://github.com/advisories/GHSA-grv7-fg5c-xmjg
Change-Id: Ia94454c1da778f241085714e1601a0233d547570
The message box is changed from warning to
notice for the following messages:
- mobile-frontend-generic-login-new
- mobile-frontend-watchlist-purpose
- mobile-frontend-watchlist-signup-action
Bug: T366127
Depends-On: I358ee59a1a0b7a5bb94e66bca9a2437517f40141
Change-Id: Ifa4418cbecda38011a6ee4d09c03db3ded7a9eb9
Additional changes:
* Update Minerva so that it doesn't output any APIs
to the documentation - this is intentional as Minerva does
not have any public facing APIs.
Bug: T368081
Change-Id: Ie1a3ea30cbf35663c7fdd2494c1698044882969e
These will make JSDoc easier to configure later and is
better suited to ES6 module format.
The dependency injection pattern can be retained by moving
the import to the top of the file.
Change-Id: I0fe692eb7066e52815ef3d21724c7439d82b2c5f
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
