Commit graph

315 commits

Author SHA1 Message Date
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
Jon Robson 19ea6328b0 Drop mw.mobileFrontend references
Bug: T348807
Change-Id: Ib71b43005e5788d0e29917a165281faa84926414
2023-10-31 21:54:26 +00:00
Volker E 1dbd976eb9 styles: Bring headings line-height value in line with Codex
The line-height value for headings in MinervaNeue was 1.3,
while in Codex and Vector it changed to 1.375.
This patch brings the value in MinervaNeue in line with Codex and
the corresponding change in Vector a while ago.
This also makes future typographic changes more easily handlable.

Bug: T331403
Change-Id: I4320035708d6005388428dfbc90da2ef613841b5
2023-10-24 21:54:51 -07:00
Jon Robson 0c8caebfc6 Generate section edit links via SkinMustache
Bug: T346944
Depends-On: Ief6a6ee03ada8207fc5c60ea438412fa2d529022
Change-Id: I9f768706c0a0f14f14ee4b3812288218bef36018
2023-10-23 23:17:43 +00:00
Jon Robson 05231bb254 Support extension of page actions via hook and addPortletLink
This adds support for:
mw.util.addPortletLink('p-views', '#', 'text', 'fooz',null,
  null,'#page-actions-overflow' )

and adding multiple edit icons via hooks.

Depends-On: I655097769620301143140ded1cde4c7a16879ef4
Depends-On: I401805224c0f387ac85b52b50c1f298b83c03a91
Bug: T346944
Change-Id: I3c9d59f49f1b939981a7b2b450448db6736d5958
2023-10-04 22:15:47 +00:00
Jon Robson b51c6511ef Fixes history icon in green last modified bar
Currently the last modified bar icon appears black rather than
white. This is because the last modified icon shares icon CSS
with the page actions in AMC.

Untie these by giving the icon in this context a different selector,
taking care to support cached HTML.

Change-Id: I98443b0dcb88911a5314092216809387b4fb80dc
2023-09-25 20:40:55 +00:00
Jon Robson d407d1054c Remove or document remaining mw-ui-icon usages
Most of these are captured in other bugs
The anon talk message style doesn't do anything.

Bug: T344022
Change-Id: Iba1fce98ea05931fe07b2b20f07c62d198039d1b
2023-09-13 00:03:38 +00:00
jenkins-bot d676f6e910 Merge "Ensure header edit icons are the same size" 2023-09-12 00:09:12 +00:00
bwang 9e9c1292e4 Ensure header edit icons are the same size
Bug: T345969
Change-Id: Ica191284df74610c958ad8808dcd1c03839b1a5d
2023-09-11 18:37:31 -05:00
Derk-Jan Hartman 2728752633 Add figure and picture elements to the reset.
These are newer elements but they have similar user agent defaults to
img/video/audio etc.

This should fix the usage of imagemaps, which use frameless figures
and currently have excessive margin in minerva

Change-Id: If9f995401b771baffe221e474991cf1e3fbc7f76
2023-09-09 13:53:06 +02:00
bwang 7bbb240db1 Make menuGroup.mustache use togglelist classes, ensuring ToggleList HTML is consistent. Remove duplicated CSS
Bug: T343920
Change-Id: I567d20171b0e511d00922adf250f97b9b8ed146b
2023-08-25 17:57:47 +00:00
Jon Robson 952789bc17 Switch Minerva button template to use Codex and remove mw-ui-button
- 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
2023-08-24 15:57:01 -05:00
bwang b66ac786d1 Prepare addPortletLink handler for Codex switchover
Change-Id: I33e541ab7b816640a63541ce719e094bb8f5d78e
2023-08-24 12:07:28 -05:00
jenkins-bot 7c59e349a9 Merge "Edit icon uses template parser" 2023-08-16 22:27:51 +00:00
Jon Robson f3c1b06ce6 Move button styles out of icons.less
Follow up to
I84407fb562c288bafe02e97ba7f3366de7f61611

Change-Id: I80c2b63077d38203fcef09d473c82f5566a92467
2023-08-11 17:54:59 +00:00
Jon Robson 12f3e033a7 Redo icon sizing
The current implementation enforces the size to be part of the
icon name. It would be preferable to have a specific class for
controlling size given we don't want to have to update all the
names of our icons.

Bug: T342908
Change-Id: I84407fb562c288bafe02e97ba7f3366de7f61611
2023-08-11 17:08:28 +00:00
Jon Robson 0c6ac2926d Edit icon uses template parser
Bug: T344007
Change-Id: I772f2c8be7e4f48e9d67a5d1d7d3ef9e6af17851
2023-08-10 22:04:11 +00:00
bwang 0648dbf29c Fix header overflow style causing header buttons from being cut off
Reverts the change to flushing for notification icons in
I55c18cf723a32f80b93a01dd0687e005162c4e93

Bug: T343908
Change-Id: I1c9b9969c822f90f8edeb90ce8b27d79d378cf64
2023-08-10 18:14:05 +00:00
Esanders 35dfdfceb9 Revert "Any header overflow should be hidden"
This reverts commit e78d6a5216.

Reason for revert: Completely truncates the user popup menu.

Bug: T343908
Change-Id: I320103bb7563c9265afb9956b9375d2a96b37172
2023-08-10 12:54:36 +00:00
Jon Robson e78d6a5216 Any header overflow should be hidden
One of the child elements are flushed right.

Bug: T343908
Change-Id: I227264ad50e7ce8dbaac260d607824ec47a81739
2023-08-09 10:10:59 -07:00
jenkins-bot 0c69779b73 Merge "Echo uses Button template" 2023-08-08 17:44:22 +00:00
Jon Robson ded6430b47 Echo uses Button template
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
2023-08-08 15:44:38 +00:00
bwang 465e66aad5 Update page issues to use new MF icon class
Bug: T343053
Change-Id: I917a4ac4d0a8af5162959f4514bc184670582b50
2023-08-04 16:50:26 +00:00
bwang e6511ebe8f Add option for different icon sizes, reduce size of arrow icon in last modified bar
Change-Id: I494a02e5ba08cc7849cf1973f8f9163c672fccff
2023-07-31 14:18:49 -05:00
Jon Robson a8362a9237 Hide image overlay slider buttons
There is one instance of icon only buttons in the overlay content.

Bug: T342936
Change-Id: I8aef02c87b63d2248c30371c98e390322f5c706c
2023-07-31 08:51:15 -07:00