Commit graph

183 commits

Author SHA1 Message Date
jdlrobson a7db7341ca Last modified bar should not show external link icon
A new rule resetting padding-right and background-image on
a.external inside footer is added.

Additional change:
* Merge all styles relating to the last modified bar into a single
component file for consistency with Vector and easier lookup.

Bug: T267464
Change-Id: I558f0756264e92ca757a99e47a53564c3ecd8b71
2020-11-17 03:36:01 -08:00
Peter Ovchyn 402aaad6ff Move css styles related to lazy-image-placeholder to skinStyles
`lazy-image-placeholder` is needed only when MobileFrontend is enabled.
So it makes sense to move those styles to mobile.init css. See more details here: T199351#6380240

Bug: T260406
Change-Id: I16ca734af33fb0f3c4c67f20bbca8631279d7778
2020-08-18 16:51:02 +00:00
Peter Ovchyn 8581b2c16b Make lazy-image-placeholder vertically aligned middle by default
All images in MinervaNeue skin are vertically aligned `middle`,
so placeholder for them should be consistent.

Bug: T199351
Change-Id: I5fa00bd0c02e67059543389e4bbd07b073a2c5e0
2020-08-17 18:30:21 +00:00
Ed Sanders e8d5462bb3 Apply infobox styles to any element with the class
MoveLeadParagraphTransform treats div.infobox the same as table.infobox,
and should be fixed to match any element too.

Fix specificity of tablet overrides.

Bug: T258011
Change-Id: I9ada6d1b8b19b46dba6527f1f66edd2547fa0c88
2020-07-17 22:09:30 +01:00
Volker E fea419f543 Use default @border-radius-base variable
Following WikimediaUI Base variable naming scheme.

Bug: T255230
Change-Id: I71f49d2b554dbca726aee43b19b1554969449403
2020-06-25 19:07:17 +00:00
Volker E 4cef1791c2 Use correctly named variables background-color-base and color-base--inverted
Depends-On: I7b7534223c672a47a11e69fc07bea535ec0085a1
Bug: T255230
Change-Id: Ibf5c0410e446cff18fc26fe2e80d120a72209c04
2020-06-25 19:07:12 +00:00
Volker E 7f590aba17 Rename link color variable to standard naming scheme
Change-Id: Iff85d1e424e18902df58988167ae6668ce034aa2
2020-06-25 11:20:33 -07:00
Volker E bb6827122c Naming convention using 'skin' as entrance point
Similar to Ief1c469724d4ffe238d307407c3ddb46f2e1abfa

Change-Id: Ibca2473b14ef258f92e71524489298e2f53ed873
2020-05-29 14:32:12 -07:00
Volker E b26f62b2fa Change opacity (color) of logo to a subtler gray close to #54595d
Use a variable to rely on opacity value close to `#54595d` similar
to icons in the header.

Bug: T251135
Change-Id: Ie3eaad9ac86f8c3827e0a41f0b73b694d8f8f2fc
2020-05-12 22:09:59 -07:00
Jan Drewniak 1a838f2004 Fix for 27eb9e - "Changing color of logo from black to gray"
Use a variable consistent with Wikimedia UI base instead of
a hard-coded opacity value.

Bug: T251135
Change-Id: I883d3b122c3a0206fe83365a7818929d74f86459
2020-05-04 21:08:25 +00:00
jenkins-bot 5bd8c646c9 Merge "Revert "Changing color of logo from black to gray using opacity."" 2020-05-04 18:14:51 +00:00
Jdlrobson d65ac4b5bb Revert "Changing color of logo from black to gray using opacity."
This reverts commit 27eb9e1666 to simplify the SWAT of
https://gerrit.wikimedia.org/r/594254

Change-Id: Iccb2e32c3b46e5014849a9a397e062203631342d
2020-05-04 17:58:30 +00:00
Volker E c9461c9dd8 Replace skins.minerva.mainMenu.advanced.icons with OOUI icons
Additional changes:
* Address a fixme relating to the overflow icon and move some AMC styles
out of the critical path for non-AMC pages

Note about ellipsis:
The class mf-mw-ui-icon-rotate-clockwise cannot be used as it's part of
MobileFrontend and loaded via JS. Minerva must work without MobileFrontend
and this rotation is needed without JS.

Bug: T244444
Change-Id: Ifd02c50305cf036dd6df640d778678668507e5eb
2020-05-01 12:18:35 -07:00
Jan Drewniak 27eb9e1666 Changing color of logo from black to gray using opacity.
Bug: T251135
Change-Id: I332e36149f71976008f1c020ff79db4adb96b9b8
2020-04-30 19:29:24 +02:00
jenkins-bot 8cb8a3cd3a Merge "Reduce last-modified-bar nesting and add mw-footer class" 2020-04-28 16:17:28 +00:00
Volker E b88cc09284 Clarify comment on Desktop MinervaNeue
Change-Id: Ibba6ea33f6338688dc3239d1da4b8c8d973f3c9b
2020-04-27 12:15:19 -07:00
Volker E 447a83415c Reduce last-modified-bar nesting and add mw-footer class
Reducing (currently) unnecessary `last-modified-bar` context nesting,
which isn't done consistently across stylesheet files.
Additionally adding new `mw-footer` class, but not yet using it
exclusively due to caching.

Change-Id: I6b9caa42c1907ec1a7f8c8b67334fb7f08705848
2020-04-27 12:02:47 -07:00
Volker E 18ab61d4fe Use .text-overflow() mixin from 'mediawiki.mixins'
Removing MinervaNeue's own mixin now that it's possible.
Also unify code instances to use new mixin.

Depends-On: Ia8d6e7229b49598b0f4cb19dff463ffe2f11a43d
Change-Id: Iaffcefcb7a239d5ddecbe17097573d06099de88e
2020-04-21 11:49:30 -07:00
Umherirrender 53fab7c03d Always enable stylelint rules after disable
Change-Id: I3c677fb6e3ff9666e8e50f3a2ad9cd9ac57c29b8
2020-03-11 15:50:14 -07:00
jdlrobson b3b50ce854 Fix Minerva print mode to correctly show top of document
When we built the new main menu we started using a `nav` element.
Update selectors to hide the `nav` element when printing from
mobile.

When printing from tablet or desktop make sure the header is displayed.

Bug: T244181
Change-Id: I7f60fd11d969a48e1c7926ad8acc4213f9affed4
2020-02-18 17:50:30 +00:00
Umherirrender 78dc3baf5c Use single quotes on less @import
Change-Id: I370dd866e9e3836fe6de4c86a54861f055424d7d
2020-02-07 17:51:49 +00:00
Umherirrender 4ccaf6e959 Move comments out of class lists
Bypass upstream bug and allow stylelint upgrade
https://github.com/stylelint/stylelint/issues/4049

Change-Id: Ibb0a1cc714324db96cf6c7973cfd8c4616e159b8
2020-02-06 01:05:27 +00:00
jdlrobson 1e64fc8f3d Dev: Address some FIXMEs
* Drop non-existent pointer-overlay selector
* Drop redundant icon class for arrow
* Drop unnecessary !important
* Drop transparent-shield class
* Reword an existing FIXME about a contensious decision and
add a new FIXME for moving some code to a more appropriate place.
* Move an image into a ResourceLoaderImage module (test with
`mw.notify('error', { type: 'error'} )`)

Change-Id: I6e38f07772afae6f13c4851ca17a67d52ca7d331
2020-02-03 08:43:18 +00:00
Ed Sanders e2903a5bad Reduce height of sections due to edit links
This matches the old height and the height in edit mode.

Change-Id: Ibdfd7cdabe16cec0b050a4ea706849c34beeb2ea
2020-01-29 21:35:34 -08:00
jdlrobson 1f584195de Reorganise stylesheets
All stylesheet-only ResourceLoader modules now have a single entry point
rather than multiple files. This eases compilation of the content of
those modules by all toolchains, which will be useful when introducing
the bundlesize tool.

Change-Id: Ic38a3e51db2f419fe68efd23a2c48ee69218a526
2020-01-29 09:46:18 +00:00
Krzysztof Witucki 3ec0ca1e6e Remove border-radius
ToggleList.less: remove border-radius style from .toggle-list__list
userMenu.less: add border-radius to .minerva-user-menu-list
pageactions.less: add border-radius to .page-actions-overflow-list
design feedback: (see T231205#5771626)

Bug: T231205
Change-Id: Ia06e230a53ddba7931a2869209e0851b11ca8030
2020-01-06 21:47:55 +01:00
Jan Drewniak f5bef2ea5c Main menu button works without JS
Converts the main menu button to work without JS using the CSS-only
"checkbox" hack, using the ToggleList module from the dropdown menus.

Bug: T225213
Change-Id: I0eff0439f7284ec74f6304324fab409e8a1b6245
2019-12-19 19:55:39 +00:00
Volker E 76212152a0 Use font-weight: 500 for page action buttons
Bug: T237019
Change-Id: I55e167ce794fe5c635cd86205e38055d7deb1040
2019-12-18 00:15:14 -08:00
Volker E 09d0feb287 Add @font-size-root var and rename @font-size-body-mobile
Following Vector and OOUI in `@font-size-root` and put it in central
file. Removing duplicated code in `html` and `body` achieving the
same thing.
Also renaming `@font-size-body-mobile` to a distinct
`@font-size-body--feature-phone` ending the confusion that it's a
variable only used at `@width-breakpoint-mobile - 1`.

Change-Id: Ie355d015d882f61c813991c3244bfcb67f161791
2019-12-12 17:34:44 -08:00
Volker E 7dc77f594a Replace id by attribute selector
`[ class|='mw-content ]'` catches `.mw-content`, but also `.mw-content-rtl`.

Change-Id: Ibbde7670cf86e36f08a4ce3dca9565bdaaec9b13
2019-12-12 14:36:09 +00:00
jenkins-bot d53cf4c3e0 Merge "Discontinue back-to-top feature" 2019-12-11 20:00:04 +00:00
Ammar Abdulhamid 898b048d1c Discontinue back-to-top feature
Bug: T237290
Change-Id: I06a6823bd3d1985a1d76384bb65c9d2ddf334a21
2019-12-11 05:12:43 +00:00
Volker E cf903b20f6 Remove duplicated line-height
It's also set in content.styles/main.less and is preceding there.
This has already been merged in reset removal branch and is now
re-deleted on master after first branch attempt failed.

Bug: T222877
Change-Id: I1e9eb28360acd57e574d37e118058abbf5bc6b3e
2019-12-10 18:29:27 -08:00
Volker E ea00e7cb28 Align LESS typography variable naming scheme to WikimediaUI Base
Another step into unified naming scheme, here all typography
variables.

Change-Id: Ic0ee64fc924ccc2b04a6b9d040e2f00dc6c45799
2019-12-05 21:15:33 -08:00
jdlrobson 97c157b8e8 Replace .content class with .post-content on last modified bar
We use `.post-content` which has less side effects.

Change-Id: I40ce9b2c7410c4c361554b5b32d9c1178a59e234
2019-12-05 21:01:23 +00:00
jenkins-bot 2880fa63eb Merge "Replace #content selector by .mw-body" 2019-12-03 18:49:33 +00:00
jenkins-bot 1f22955461 Merge "Enable stylelint 'selector-max-id' rule and disable only on occurrence" 2019-12-03 18:48:13 +00:00
Volker E a62ca4412f Replace #content selector by .mw-body
Has been replaced in other skins, `.mw-body` is exclusively used on
`#content`.

Change-Id: I56ca92a683a2f9f4181e7708a312e691448ce230
2019-12-03 11:36:18 -07:00
Volker E 52f37a5f2a Enable stylelint 'selector-max-id' rule and disable only on occurrence
Enabling 'selector-max-id' rule, and changing in rare exceptions like
`#bodyContent` to `.mw-body > .content` where there's only one less
specific option.

Bug: T239183
Change-Id: I9d929eaae09475b2e20d96cb19081aba3aec5877
2019-11-27 17:36:59 -08:00
Volker E 1a5a80df6f Remove obsolete CSS after cache has cleared
Introduced in I27658477aaeed3290aced844caa64fc5e1c34fbd

Change-Id: I8273272fe087d83bcaade5a33bd23908228ac4b7
2019-11-27 15:58:36 -08:00
Jan Drewniak 3014a6b8d1 Fix page-action menu labels for non-amc mode
Followup to 77a1424e4e

Bug: T226562
Change-Id: I85257e3e0dc32cbc0d04b31486b65743d073e7a3
2019-10-29 17:51:33 +00:00
Jan Drewniak 77a1424e4e Show labels in page-actions menu on desktop widths
Adds labels to page-actions menu via a new
`.mw-ui-icon-with-label-desktop` class that shows labels at the
desktop break-point.

Bug: T226562
Change-Id: If57ab44660e0dc2a58c04fbf22dee6c27dd1f45f
2019-10-28 12:53:38 -07:00
Volker E 19b1ea2297 Unify transition values across board
Using newly introduced variables instead of fixed values.
Also adding `transition` to property blacklist to ensure using
mediawiki.mixin.

Bug: T236224
Change-Id: I3d2d05f4e50e7b6bba0fe84fae1dde5de5b75492
2019-10-24 12:11:52 -07:00
VolkerE bcd0d25b32 Revert "Last modified should have line-height 1"
This caused T234492. It seems that `1.65` is the minimum to universally satisfy language scripts like Burmese. It predates MinervaNeue being split out and was invented in 2cad4ce3d7af09fba52d87a32518715029eb32a0. While it might not be set with this intention, `1.6` is already cutting off letters. 

This reverts commit 1c7adedda4.

Bug: T234492
Change-Id: I36c85b307bacbbcb9d28c2c60e18da7a412eddae
2019-10-07 23:10:41 +00:00
jdlrobson e72c0d7ba4 Render main menu and shield on server side
This is a second attempt at I3892afb5ed3df628e2845043cf3bbc22a9928921
that is cached HTML friendly and won't cause T234599.

This time rather than solving the entire problem, we'll start rendering
the menu on the server, to allow us in future to drop the Menu code

Bug: T234650
Change-Id: Iea5406ef1c561f2907ec6132481007673aabf1e9
2019-10-04 19:35:28 +00:00
Jdlrobson 93b16db1c5 Revert "MainMenu is a controller not a View and server rendered"
This reverts commit 111757970e.

Although I cannot replicate the performance issue, the menu doesn't seem to be rendering at all on cached HTML so this is a deal breaker. Back to the drawing board..

Bug: T234599
Change-Id: Idadc5a079340f44ec66d20a38259b6b337d2dcee
2019-10-04 15:03:19 +00:00
jdlrobson 111757970e MainMenu is a controller not a View and server rendered
As Stephen pointed out somewhere, this is a bit of a micro-optimisation
Let's simplify this code by always rendering it in the HTML. MainMenu.js
as a result becomes a controller that just decides when to show it.

The geolocation check for Nearby is removed given the fact that all
grade A browsers for mediawiki have Geolocation support

Additional changes
* Browser support suggests "animations" class is redundant now
* `open` event no longer filed - not being used anywhere
* Transparent shield is now managed by the MainMenu controller not
the skin (which was confusing)
* Test geolocation using a simple feature tests
rather than abstracting it away inside Browser
* The main menu button is always hidden under either a translucent shield
and/or the main menu itself when it has been opened
so so it's not possible to ever click it while the menu is open
 - the click handler is thus simplified
removing a check for the class of the button

Depends-On: I7fd243366cceae780bd46e1aef2c08dae073f647
Change-Id: I3892afb5ed3df628e2845043cf3bbc22a9928921
2019-10-03 13:13:09 -07:00
jdlrobson 1c7adedda4 Last modified should have line-height 1
Quick fix to resolve issues with vertical alignment.

Bug: T233172
Change-Id: I3213e6c9935dcc1dd5feb658f6f0321b1437d2ff
2019-09-30 14:56:11 -07:00
Jan Drewniak 51049c0ceb Refactor "last-modified" bar to use flexbox layout.
Brings the last-modified toolbar (links to history page at the bottom
of articles) in line with recent icon changes. Removes the icon
class from the toolbar itself and by employing a flexbox layout,
reducing the amount of CSS required for this toolbar.

Bug: T233172
Change-Id: I27658477aaeed3290aced844caa64fc5e1c34fbd
2019-09-27 00:03:14 +00:00
Jan Drewniak 6e6cdd74c4 [ICONS] Remove padding from .mw-ui-icon-small class
The `.mw-ui-icon-small` class shouldn't include the padding that comes
with `.mw-ui-icon-element`, it should instead render a small icon
without padding.

The right-margin for mw-ui-icon-before is also changed to be
the @icon-padding size instead of a static 1em.

Includes a fix for the "last-modified" bar cause by this change.
This temporarily breaks the reference drawer with error state but that
will be swiftly fixed in I229dd5ae04bde96ba8d5622097ff09ea4324ab0e

Change-Id: Ia44b3157ecec6a036f3bd6287d4b8096748d4afa
2019-09-26 23:07:03 +00:00