Commit graph

363 commits

Author SHA1 Message Date
Jon Robson e5396b34bc Revert "Fixes issue with height in slideshow"
This reverts commit 1ac1cdfd7e.
No longer needed with change in core

Depends-On: I6d916ffb1301bd2f4a258ec50990c4347f9c63e7
Bug: T326270
Change-Id: I73559c23943a25bbcaea5ba1576155a887d4ba70
2023-01-12 23:44:21 +00:00
Jon Robson 1ac1cdfd7e Fixes issue with height in slideshow
Depends-On: I5c372f8b1bbc44af9c5855baa7ee825ff42fbc96
Bug: T194887
Change-Id: I3904bb158eebe96983ce3318e1e39a6f056624fd
2023-01-09 18:49:34 +00:00
jenkins-bot 8011edcecb Merge "Always show search results at full width" 2022-12-16 08:46:59 +00:00
Jon Robson 57f86745e9 Show the thanks button on mobile special pages
Now the confirmation step code works, we can show this button.
Update styling to generalize the thanks/rollback styling.

Depends-On: Ia03038e86c6a607c8b75eefedbf0285ca1a2f8c8
Depends-On: I5286e80f9dd683ba55b03664dc31de77c19722b7
Bug: T230657
Change-Id: Iab32d8b30d4f2d946ffdaefea72ca9b43448998d
2022-12-15 22:46:33 +00:00
Matthias Mullie 4a4f8f279e Always show search results at full width
Ieebc40073eb3d0c8a56ebc8aec3f060199943ddc lowers the breakpoint
at which search will break into 2 columns (search + interwiki),
in large part because the 2nd column will also be occupied by
Extension:SearchVue's side panel.

On mobile, Extension:SearchVue presents differently (directly
below a search result), so there's not as much need for a 2nd
column this early - wider search results are prefered.

Bug: T321377
Change-Id: I22c46cfad2e054be679d79cce9b8d1ae04e3c6f1
2022-12-15 09:38:36 +01:00
Bartosz Dziewoński 433458ba98 Tweak margins/paddings of Echo icons
On desktop, the "Alert" icon had more white space around it than the
"Notice" icon, and its popup displayed with a different offset.

On mobile, the combined icon jumped around while the page was loading.

Change-Id: Icdd5bc6e8478f3453b6461a35b7fb53e8ab014e9
2022-12-14 04:36:14 +01:00
Arlo Breault c4fe708a36 Remove b/c for media typeof
Bug: T270150
Bug: T203211
Depends-On: I44b3fb432dd00120a4d5cd5556ba5ba8bc4e65d5
Change-Id: I58d8ce9e2e58916d55c8d838c3fbfb96e2a05f02
2022-11-30 13:55:32 -05:00
Jon Robson 7187ce5594 Move skinStyle from Echo to Minerva
Bug: T257143
Change-Id: I1999185d19e171900f2da5acbd39125013d3582c
2022-11-19 00:24:08 +00:00
jenkins-bot 27965530c3 Merge "Media border option applies to the media element, not the wrapper" 2022-11-02 23:02:22 +00:00
Jon Robson 5be882421d Disable new flushing rules on mobile
Don't have capacity to deal with this yet.

Follow up to  I9aba71ac4fff0d285676946acef8309b741ed1ad

Bug: T321504
Change-Id: I85ece1fa28d2c1c5967995ef7622684d73d3c23f
2022-11-02 12:28:49 -07:00
Arlo Breault b1d39a5425 Media border option applies to the media element, not the wrapper
Reported in,
https://it.wikipedia.org/w/index.php?title=Wikipedia%3ABar%2FDiscussioni%2FAggiornamento_del_parser_per_le_immagini%3A_vogliamo_testarlo%3F&type=revision&diff=130240855&oldid=130214646

The default styling in core looks like,

.mw-image-border {
	> a:first-child,
	> span:first-child {
		> *:first-child:not( .mw-broken-media ) {
			border: @border-thumbborder-screen;
		}
	}
}

The simplification here recognizes that the border option doesn't apply
to thumbs, so descendent selectors can be dispensed with, there's no
nesting in figcaptions to worry about.  That's important because
lazy-loading adds a noscript before the img tag, which would make the
selectors with first-child not apply anyways.

An img tag is used instead of the universal selector.  That seems like a
safe assumption for now and can be revisited with T314097 / T318433

Bug: T318300
Change-Id: I25f45ee794300d2ba2a38a0ab6e3741a6b1a18f2
2022-11-02 12:34:00 -04:00
jenkins-bot 2545c6b2d0 Merge "Add styling for Special:Preferences icons" 2022-10-28 16:59:28 +00:00
suecarmol 822bf0f0c3 Add styling for Special:Preferences icons
Added styles for Special:Preferences' mobile layout icons.

Bug: T317419
Depends-On: I6d5730d47e7595b1705787995fe5db2fe734d7f5
Change-Id: I40a1783a24a2d643026132038a71a027d69f178f
2022-10-28 11:39:20 -05:00
Matthias Mullie a0555ee377 Break up words to prevent thumbnails from being squished
Bug: T321362
Change-Id: I9d649873145738808fa5a8456df4272c14e42d6a
2022-10-27 12:02:16 +02:00
Matthias Mullie 4c19038074 Override padding-left for Special:Search results
Bug: T321563
Change-Id: I5fe7c85e459fbab058cb54a3aec8503c8e7ce203
2022-10-25 16:14:46 +02:00
Arlo Breault 8c87990f0b max-width only applies to thumbs
Not frameless or plain floated media.

Bug: T318300
Change-Id: Iced12531dc8fe416c493daa82c0aa8252f9226bd
2022-10-20 17:48:58 -04:00
jenkins-bot e8f369ca6e Merge "Improve Special:Preferences mobile styles" 2022-10-05 18:47:12 +00:00
suecarmol 68d763e62a Improve Special:Preferences mobile styles
Improved the Special:Preferences CSS styles for a mobile interface

Bug: T311717
Change-Id: I50f74cf45288bd261b5e9075260445df73b03333
2022-10-05 18:28:22 +00:00
Jon Robson 400126fa91 Revert back Minerva icon features not ready for production
In Ifccaadabd72a12814d3d4d01200931f7254c6cd5 we made some modifications
to the icon specification. I haven't run these by Alex yet (as focus
is on Vector 2022) and don't
want to rush them, so for now temporarily undoing those changes here.

Changes:
- Reverts icon touch areas from new 44x44 to old 46x46
- Undoes decrease in margins between labels and icons

Bug: T319071
Change-Id: I9a02191c57b7e2d24a8bc909f820ba8db942c028
2022-10-04 00:32:23 +00:00
jenkins-bot c0b79ad3c3 Merge "Don't show thumbnails for non-NS_FILE results on Special:Search" 2022-10-03 07:25:26 +00:00
jenkins-bot 5e945307b6 Merge "Remove redundant styling rules and fix center/none halign for figures" 2022-09-27 20:22:55 +00:00
Arlo Breault 1d123e02d1 Remove redundant styling rules and fix center/none halign for figures
The rules in mediawiki.skinning.content.parsoid were made redundant by
25890e3ece.  There are some more rules
there that should be audited to see if they're still necessary or can be
moved to a more general location now that wgParserEnableLegacyMediaDOM
is being disabled and they apply more broadly than just when Parsoid
styles are requested.

Missing rules for mw-halign-center and mw-halign-none are added.

Bug: T318300
Change-Id: I34fb1ce76de24eec3b136dc6dc9ab4e07e36b809
2022-09-27 17:17:48 +00:00
jenkins-bot 716e184be1 Merge "adjusted button css layou" 2022-09-26 18:52:27 +00:00
ELLENR 8b9f1b0757 adjusted button css layou
buttons are not displayed in AMC page history

Bug: T312311
Change-Id: I390551a98d671d46e4e4d5f9f601124d1ac3f176
2022-09-26 09:43:42 -06:00
suecarmol 3d61c0ed5d Mobile Preferences: Add styles for Special:Preferences mobile
Added a stylesheet for when a user views Special:Preferences in mobile

Bug: T311717
Depends-On: Ia7a730cd7f009dbb921a810f27fae4a9ee66f793
Change-Id: I83558ca5de50fa7d8c7d75572ffa1c600f660d66
2022-09-06 19:38:26 -05:00
Matthias Mullie 3a7d506381 Don't show thumbnails for non-NS_FILE results on Special:Search
Related: I2a679b51758020d3e822da01a1bde1ae632b0b0a
Bug: T306883
Change-Id: I562dea721e7dc587ced739ef5d974a82e16a1e70
2022-09-02 16:01:04 +02:00
Ed Sanders f3ba1af953 Cleanup: Use .position-sticky() mixin from core
Change-Id: I2972eb33dc5ce54fa3ad23e1b52893b52ee13526
2022-08-16 07:51:03 +00:00
Ed Sanders ac317d1146 Fix CSS selectors for Parsoid images
A Parsoid-like DOM is used in VE.

Bug: T313172
Change-Id: I29bd59ff21c920fff3dddf9d1a58a823b460a97c
2022-07-26 01:47:45 +00:00
Ed Sanders d926771bd8 Remove deprecated vendor prefixes and their mixins
Additional change:
* The animation stylesheet pulled down for the storybook instance
in dev-scripts/setup-storybook.sh is no longer referenced anywhere
in assets so can be removed.

Bug: T306486
Bug: T308351
Bug: T308360
Change-Id: Ia9f2a05cde2724486f7e449261c5d4875388f5ab
2022-05-23 23:18:43 +00:00
Ed Sanders 86caa17713 build: Update linters and linter config
* Update stylelint-config-wikimedia to 0.13.0
* Ensure eslintrc.js and root files are linted
  with server config

Change-Id: I59c49fedd5b0c4c5620f960b78e4f781a6bc5abb
2022-05-18 14:33:23 +01:00
Jon Robson 9ffc476b1d Contributions headings should be border box
On mobile devices this is adding horizontal scrolling

Bug: T301798
Change-Id: Ibee771dce4924b138d3dd3df502659b2ea17c66d
2022-03-31 10:30:11 -07:00
Jon Robson 5586526d18 Show the mw-index-pager-list-header
Note this will not go into effect until Iae32ce9eab163bcb5b5b95dfd19c03276bc0f1a9
has been merged which enables skin styling.

The order is intentional to avoid leaving master in a state where
the heading is unstyled but shown.

Bug: T301798
Change-Id: Ia7836a42bfd90379fab981cbd6c64a1c00b29399
2022-03-23 19:22:12 +00:00
Jon Robson 3f9e007745 Remove message box h2 style
Depends-On: Ia57d98d4be39028aa2dfe4ed737755fca79c0db3
Bug: T300306
Change-Id: I1a5ba80ffb219cd7c1e26ea6b18e12237bd78482
2022-02-09 17:49:51 +00:00
jdlrobson f9a8703a64 Minerva uses core page title handling
Bug: T265892
Change-Id: I2ffdedd64414ffb3c6e441391a75fd6e744847a4
2021-12-20 19:39:42 +00:00
Derk-Jan Hartman a0bb9e41ee Fix viewport overflow in RC/Watchlist editsummaries
Set a max-width on this floated element

Bug: T297045
Change-Id: Ie33d7052eb1138cb98543c53410c1f376f3e0e64
2021-12-06 22:22:22 +00:00
Volker E 9c38f7ec82 drawers: Remove outdated supported browser property
IE9 on Windows Phone workarounds are of no use any more.
The `right: 0` and `left: 0` properties below are sufficient in
currently supported browsers.

Change-Id: Ibfb29d1b009cb0ea33bc3cb9be39ee579e981b1a
2021-12-02 13:47:08 -08:00
bwang 03387718cf Clean up MobileFrontend overlay skin styles
Bug: T294033
Depends-on: Ibd4ef00615a1119601c729f2481ff87adaf8c86c
Change-Id: Id1c07205aec59481cc14ddb39c441fafa256e46b
2021-11-04 20:50:49 +00:00
bwang f1c828e19d Refactor Minerva header and overlay headers to use flexbox
- Move new header styles to header.less
- Remove unnecessary styles
- Update search overlay to be aligned with the heading searchbox on all screen sizes
- Add temporary skin style to ensure no regressions in mobile VE

Bug: T294033
Change-Id: Ib9867d1b76b602f3355e9f2689f137bc84b0c929
2021-11-04 15:50:00 -05:00
bwang d1049e5407 Restrict overlay button styles to non icon buttons
Bug: T294146
Change-Id: I5f5568407dda5f3a021d64de9efc2bc7aeb5b458
2021-10-22 18:48:26 +00:00
jdlrobson a7b66f6f63 Remove MinervaTemplate::getContentHtml
* Move method to SkinMinerva
* Turn preparePageContent into a getter that returns the subject
page
* Use getSubjectPage in template

For mobile special pages this now means the page has two .content elements
On those pages I've disabled the initial content element. It also means
various .content <heading> and .content ul  rules now apply that need to be
disabled.

While testing several other issues were taken care of - for example
the h2 in errors

Depends-On: I7761396d6a33830f279742be01240796573556a7
Bug: T291871
Change-Id: I13bc4b5dae7aed86eca31ef306212365e1759481
2021-10-15 20:49:23 +00:00
jdlrobson 3a88911209 Remove whitespace to right of search input in overlay
Bug: T292107
Change-Id: I1143747600a1ffb25dcfe8600c5cd352afb25159
2021-10-12 16:26:53 +00:00
Kosta Harlan 9fac869b8e Revert "Search header should be vertically centered, not top aligned."
This reverts commit d6d26e45bb.

Reason for revert: T292030

Bug: T292030
Change-Id: Ie564139ae0ae5e79389fd9b2beca4e69f36e3e5e
2021-09-29 08:30:03 +00:00
jdlrobson d6d26e45bb Search header should be vertically centered, not top aligned.
Change-Id: I6aa643266a85ec61f2220b12907822d2d03f33c9
2021-09-27 21:35:27 +00:00
jenkins-bot 7791635c0f Merge "minerva-header class is now in cached HTML, remove old header class" 2021-07-21 23:54:23 +00:00
jdlrobson 9fa0f3a64d Use MediaWiki UI version 2 from core in Minerva
Depends-on: Ibc136a17662ae839f90babb21e0f7e8f27b7a7d5
Bug: T191021
Change-Id: Ifdc3a3273aa93129177a11814651ec811c20f49c
2021-07-20 11:59:23 -07:00
jdlrobson ca18ad75d3 minerva-header class is now in cached HTML, remove old header class
This completes the migration from header to minerva-header

Bug: T172626
Change-Id: Ibb86359e683e08d86091f855e3813a99e0ad2cee
2021-07-20 18:36:39 +00:00
ExE Boss 27525d0bff Fix style conflict with content using class="header"
Content using `header` as a CSS class was affected by skin styles
in Minerva being insufficiently specific to the skin‑specific elements.

This changes Minerva to use `class="minerva‑header"`, thus avoiding
the conflict and matching what Vector does.

Bug: T172626
Change-Id: Id8fbe61b2d1d4a89ec11ddfdf7837be797b3bd20
2021-07-16 20:39:24 +00:00
Alexander Vorwerk 9494e1dc80 Drop unused class and style
Droping the unused .navigation-full-screen class and the unused MobileMenu Skin style. This is a follow-up work on: I30b1af8b88dd146d62f0de7a6352c4117a7cdd90

Bug: T252005
Change-Id: Ia1698b5477a159f17a16a6591ee774920f403b79
2021-05-02 17:42:43 +02:00
jdlrobson 685387220f Message box styles for Minerva come from core
Just as before styles for message boxes will be
kept off the critical path of most page views and
loaded on special pages, old revisions and action= URIs,
however unlike before the CSS will come from the definition
in core.

It must also be loaded in JavaScript for compatibility
with the use of warnings in JavaScript, for example 
MobileFrontend overlays.

This change will allow us to remove the
mobile.messageBox.styles module in MobileFrontend
I8b6bdfceaf33b9527dbe6790d2a39e335fb692b2

Bug: T233160
Change-Id: I7d8d1d34621c36c26ec03a3773d4d1e67bd14f2e
2021-04-12 21:45:53 +00:00
yash9265 b14d4e04af Add max-width limit to empty watchlist page
On the Watchlist, when there are no results, the page uses .info and
.empty-page classes. This results in text running without max-length.

Add max-width rule to contain it.

Bug: T222872
Change-Id: I768f800a49e756da1ad2c123c842c37d18fa3310
2021-01-21 19:49:32 +00:00
Sam Wilson df14b078c0 Fix style of clock icon in changes lists
Override core styles for the watchlist expiry clock icon in
Recent Changes and Watchlists.

Bug: T261415
Depends-On: I621b1571b57686beb9fb5802533b1e70d293bc2a
Change-Id: Iefdd271aeb6135771aae832e930fe02c73248110
2020-09-23 10:47:45 +08:00
Sam Wilson e9ad028a5b Center and align the expiry dropdown in watchstar widget
Move the watchlist expiry dropdown list to be aligned in the
centre, and its contents to be left-aligned.

Bug: T261990
Change-Id: I3073618606636c78e6afb5bf19726c7b3973292b
2020-09-21 13:24:03 +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
Ed Sanders 13449aed52 Remove styles moved over to Echo
Bug: T258936
Depends-On: I72bedc3c3d633e8898c93d5e7d570b8ee7b6a1ff
Change-Id: Ic9b03bab0db39ccbed5b05c89577be18bb17c8de
2020-07-28 09:49:33 +00:00
Ed Sanders 58b9721e9c Remove -affixed selector
'affixed' no longer appears anywhere else in Minerva or Echo.

Change-Id: I540beddd7bfee12d699e3596130c65bcf041d036
2020-07-28 09:49:26 +00:00
Ed Sanders 84e1ddd5a8 Fix layout of NotificationsInboxWidget on narrow screen
Bug: T258939
Change-Id: Idfb9b3b5613932c92493df5aa93b5353cc07d7c2
2020-07-28 09:49:09 +00:00
AronDemian e0193eba9b Rename @fontFamily* variables to WikimediaUI Base naming convention
Renaming:
- @fontFamilySans -> @font-family-system-sans
- @fontFamilyBase -> @font-family-base
As defined in: https://phabricator.wikimedia.org/source/wikimedia-ui-base/browse/master/wikimedia-ui-base.less$201

Bug: T245136
Change-Id: Idec2c516efe2a6ee82efdf3cc6be173bedbb5b56
2020-06-25 19:51:11 +00: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 1c340f2b36 PageHistory: Remove input overrides breaking mobile Firefox
Luckily, the reset rules, that these overrides have tackled, don't
exist any more. Applying border-color or background removes all default
OS styling from radio and checkbox inputs. If not done comprehensibly
(as in this case before current patch), it renders affected inputs weakly.

Bug: T247683
Change-Id: If5823a435e8f11b7e445c5db62641173d4e6df9d
2020-05-18 13:20:37 -07:00
Jan Drewniak 833a93d909 AMC history page visual fixes
- Reduces space between diff size and comment block.
- Places tags and undo button on same line.

Bug: T249518
Change-Id: I8451654933875346720dbbe8fdcd2da070fe29f9
2020-05-11 11:19:18 +02:00
Jan Drewniak d781d08c5e Small fixes to AMC history page items
This fixes the alignment of the (cur|prev) buttons, by floating
them right, and removes some space between the "undo" button and
the tags by floating it right as well.

Bug: T249518
Change-Id: I9ff697f4146073355f8b9a61f4b0633e24c85ce6
2020-05-07 15:59:17 +02: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
Volker E ee4dbd39dd Use opacity for aligning icon color
Also adding corresponding variable.

Depends-On: I6e43a32366802775ae05e94859e
Change-Id: Iba1b12817b1620db96096f7fad34db194ce0775c
2020-04-18 00:28:20 +00:00
Ed Sanders 2a52e7f15c build: Update linters
Change-Id: Iaf0c760d5a69bc41505b782ab9f05864c37c7196
2020-04-13 16:05:10 +01:00
jdlrobson 313f2ac220 AMC History page design tweaks
Since a few months ago this page has regressed with changes to the
other pages e.g. Special:RecentChanges

Since the history page has its own stylesheet these styles can be
applied safely without worrying about them impacting other pages.

Change-Id: Ia8d038b6d22a3fe1b537aebe483d5d1683d785a2
2020-04-03 06:42:45 +00:00
jdlrobson ae2c0279d7 Also break word in .mw-contributions-title
Bug: T237230
Change-Id: I15b8d824b73e659ce17f71e9dad85fd7c0b55dbc
2020-03-27 02:04:11 +00:00
jdlrobson e56302a3f6 Break title on watchlist and scope non-hyphenated links
Non-hyphenated links according to T230860 were added for
infoboxes but the default is no hyphens so these no
longer should be needed. It was likely working around
a recently removed bit of CSS in MediaWiki:Minerva.css
(See T248415)

The new selector is needed for Special:Contributions

Bug: T237230
Change-Id: I500ca1a6182f505ceb31441c49e4dcacd597a5d3
2020-03-27 00:30:54 +00:00
Jack Phoenix 004d265c16 Only hide the "remember me" checkbox instead of all (incl. extension-added) checkboxes on Special:UserLogin
Bug: T246135
Change-Id: Ie6102ff8060d32a24cce80914db6eeb7bfaf0ab1
Depends-On: 322a43583cc6e5908bc3f1d17622737c47f62600
2020-03-25 11:20:00 +02:00
jdlrobson 6c6cfac189 Limit title on Special:Watchlist and Special:RecentChanges
Bug: T237230
Change-Id: I8e5e833290ce1968d4610554411f36c92b56e9b7
2020-03-23 16:27:51 +00:00
Umherirrender 53fab7c03d Always enable stylelint rules after disable
Change-Id: I3c677fb6e3ff9666e8e50f3a2ad9cd9ac57c29b8
2020-03-11 15:50:14 -07:00
Volker E 30fbd44efd Reduce selector specificity to necessary minimum
Further reducing selector specificity. `.action-history` does
a sufficient job.

Change-Id: I9393316b28aa86d99797a03ca164a589f5a942a9
2020-03-05 14:00:43 -08:00
Volker E f955bda480 Word-break overlong usernames
Also de-specify styles, we're already in `.action-history`, specificity
resulted from form elements below.

Bug: T237230
Change-Id: I82d9ab071084624025f1c723d2772a409750dbc9
2020-03-05 13:28:35 -08:00
jenkins-bot 00f515cce5 Merge "Reduce margin in icon and label combination" 2020-02-26 18:50:27 +00:00
jenkins-bot c81c1432d0 Merge "PageActionsMenu: Reduce spacing between icons and text in tablet mode" 2020-02-26 18:50:25 +00:00
jenkins-bot c583930c0c Merge "Remove 'new' indicator styles on mobile options" 2020-02-24 21:52:17 +00:00
Volker E 328f46379d Remove hover background on clear indicator
Align to standard component design. Clear indicator doesn't receive
background hover in an input.

Change-Id: Ibf329b450c6dd1c9913744ab1f6f4af13ec6a35f
2020-02-20 08:25:28 -08:00
Volker E d7039ab8ac Remove 'new' indicator styles on mobile options
These have been only in use for AMC, in case we need them again, we
will bring them back.

Bug: T245654
Depends-On: I0bfcbd9378b3fea4d532b78b250ce05a13f71edb
Change-Id: Ibdb69e92de5a0cf20413b0fb576a6797f7bf1771
2020-02-19 19:50:01 +00:00
Volker E a34f9853b5 Ensure hover state is only available on active elements
Exclude disabled icon elements from visual hover feedback.

Change-Id: I0a77f90b1a9a098d2201a360e08541fb718cbf91
2020-02-14 18:51:54 +00:00
Volker E 1c18c860ca Reduce margin in icon and label combination
Specifically visible in main menu.

Bug: T237019
Change-Id: I47bfc169c1edae5c251a76800c800aa2f5328456
2020-02-12 22:43:44 -08:00
Ed Sanders d3f1b6830a PageActionsMenu: Reduce spacing between icons and text in tablet mode
Bug: T237019
Change-Id: Ibec3ce5bb97fa6147fa07fbc2fb5e324c3e03680
2020-02-12 22:29:06 -08:00
Volker E ecf404db7f Drop the abandoned, replaced 'KSS' styleguide
KSS is no longer in use anywhere. The only official style guide is
at https://design.wikimedia.org/style-guide.

Depends-On: I688a78e9a71a082c499af55bd01e8fd615130486
Change-Id: I21663c7b48465b0f23f1b40520e8cee9be71c4bc
2020-02-11 14:26:19 -08: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
jdlrobson 2bf442db12 Diff styles for moving paragraphs and empty lines
* Fix styling of empty lines - cover full width
* Disable the pseudo element shipped in core
* Move styles from mobile.special.mobilediff.styles into mediawiki.diff.styles
since the latter is always present, the former isn't if MobileFrontend is not
available.

Bug: T242310
Bug: T243235
Change-Id: Ic7d12fe890622e7b3ccc7bc56765f505ac0ab651
2020-01-20 22:08:53 +00:00
jdlrobson db29aa53bd Make MobileFrontend dependency a soft one
This extends the work in Ie29a1eb7746d56f7d8c99b74e5e3c213c30fdcf2

Bug: T171000
Change-Id: Ib125e1bdaace1893804892909c27a9f328445835
2020-01-17 14:02:23 -08:00
jdlrobson 81799f71bb Fix the broken main menu
Although it's not being linked to, it can be visited from cached HTML.
Ensure on this page the menu shows.

Change-Id: Ib688e212c06d7febe82dcd3298e0627b4751dc97
2020-01-10 19:14:43 +00:00
Nicholas Ray 725ee88657 Remove 'animated', mw-notification-tag-toast classes from toast.less
* .mw-notification-tag-toast appears to not longer exist anywhere in
mediawiki

* Removed bottom 'counter translate' style. I'm not sure this is needed
now? The comment makes it seem like it was needed for older browsers
that didn't support fixed positioning but I think mobile browser support
for fixed is good now [1]

* The previous animated class was only in effect during the exit of
toasts. I refactored this logic to be easier to read with hopefully the
same animation effect.

[1] https://caniuse.com/#feat=css-fixed

Bug: T234570
Change-Id: I757122758cb0758f9ede5ccb81d9cc82bb92e79b
2020-01-09 13:58:39 -07:00
Nicholas Ray c22eab914e Add minerva-animations-ready CSS class in Minerva
Per T234570, browser support for animations is solid now so we no longer
need to check for browser support.

However, due to some browsers firing css transitions on page load (see
https://bugs.chromium.org/p/chromium/issues/detail?id=332189), we still
need JS to add this wrapping class after CSS transitions are loaded to
prevent the transitions firing on page load for some components
(DropDownList and MainMenu). See MainMenu.less or DropDownList.less for
an example of how this is used.

MobileFrontend adds an animations class too rn, but that will be removed
in in I58f754740f7146f09c38220a7614285e57684924.

Bug: T234570
Change-Id: If0cf7113b40f7217a22b66a8669138466af2cf5d
2020-01-09 13:58:37 -07:00
Jan Drewniak 08b82c025e username & userlinks should appear on a separate line on RecentChanges and Watchlist
Followup to I30aba29 fixes an issue where the user links (talk|contribs)
were pushed on a new line.

Bug: T236328
Change-Id: I52871ffc643b0484b62f8a2049101027d0de7d50
2020-01-06 15:18:00 +01:00
Krzysztof Witucki 0887552619 Fix shadow on notification overlay and navigation-drawer
minerva.variables.less: added gray color variable
MainMenu.less: added shadow to navigation
NotificationOverlay.less: changed alpha color of shadow
drawers.less: replaced rgba color with the same color variable

Bug: T231205
Change-Id: Ib1e16804b941a8f3b0cc639673baf73dc749a60a
2019-12-24 12:00:15 +00: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
jenkins-bot ebd2a32d7f Merge "Remove line-height as a way to create "screen-reader" text for icons." 2019-12-04 18:56:33 +00:00
Jan Drewniak 61e9b0d247 Remove line-height as a way to create "screen-reader" text for icons.
Line-height was used as an alternative to text-indent to push
text inside icon elements off-screen. This method sometimes
caused the pseudo-element to be positioned off-screen
because it is displayed as inline-block.

Now transparent color, combined with nowrap and ellipses are used
to achieve screen-reader only text instead.

Bug: T239304
Change-Id: Ic8eea3f8a1c6e87a35c36e209663e9ab643f7900
2019-12-04 01:48:34 +01:00
Jan Drewniak 0a865d244a Adding min-width/min-height to icon sizes
Bug: T238681
Change-Id: I18c09436232a34bd47afa0aebdff9d1d10a622a0
2019-12-04 01:10:38 +01:00
jenkins-bot 2e264b4f68 Merge "username should appear on its own line on RecentChanges and Watchlist" 2019-12-03 23:10:33 +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
jdlrobson e901bc593e username should appear on its own line on RecentChanges and Watchlist
This shouldn't apply to history or contributions which use the
same stylesheet.

Bug: T236328
Change-Id: I30aba290bd7a47cc2c1f7af665bfabe3f8797b80
2019-11-26 17:57:20 +00:00
jdlrobson b7aaf0c3d8 Icon background should disappear on touch devices after click
A simple fix. Extensive documentation!

Bug: T233046
Change-Id: I378943a663a8947c8a03f807974829c66236a7ff
2019-11-04 21:27:06 +00:00
jdlrobson 7f68c3d3ad MainMenu is a controller not a View and server rendered (take 2)
There should be no caching implications for this change, as the main menu
has been server side rendered on all wikis since 10th October.

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.

ev.preventDefault in onSkinClick is dropped since the link to the '#'
(the default behaviour) is wanted

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

Bug: T234650
Change-Id: If101eebbdbda1519af922745917237648722820e
2019-10-29 16:37:04 -07: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
jenkins-bot 0e521e507e Merge "Remove obsolete mw-mobile-mode classes" 2019-10-28 08:20:14 +00: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
jenkins-bot 6dd4142113 Merge "Add standard transition to icon elements" 2019-10-24 18:13:53 +00:00
Volker E 60e67abcc2 Remove obsolete mw-mobile-mode classes
Originally I intended to reduce specificity, seeing that
`mw-mobile-mode` class does seem obsolete in the meantime -
actually ever since I20e46165fb76956cb 3y & 5m ago.

Change-Id: I4e4d291c72864c868d99d87c4f96108b5eeea0f0
2019-10-24 16:51:18 +00:00
Volker E 3d6b2b29bd Add standard transition to icon elements
While working on I05c4e5f7a8b18a3 I've noticed the missing transition.
Also adding standard WikimediaUI variables in support of this.

Change-Id: I30c75ed306bf826ae40db3703ef423dfad85fa74
2019-10-24 16:51:05 +00:00
Volker E 22d4d095f1 Remove unneeded vertical-alignment property
It's ignored as `float: left` is also set on the same selector.
Resulting from I06422cbe27afeab.

Change-Id: Ibb755c7b71ea5f3006abd178cdeaa540862f862d
2019-10-23 14:29:13 -07:00
jdlrobson 72d4a103fd Consistent undo/rollback links across changelist pages
Move styles from history page into changeslist stylesheet. These
rules will continue to apply but will also apply to other pages
e.g. Special:Watchlist

Remove style for a.mw-rollback-link which does not look like its
 possible - link is always inside a mw-rollback-link container -
according to includes/Linker.php

Bug: T232284
Change-Id: Ifd04adeba74f010161b88f044ff4282636246e7a
2019-10-09 16:11:02 -07:00
jenkins-bot 38b5591c8c Merge "Echo is removed from Minerva" 2019-10-09 19:51:00 +00:00
jdlrobson ab61dbb173 Echo is removed from Minerva
Managing the transition from old implementation to new:
* A version number is exported from skins.minerva.scripts to
tell dormant code added to Echo in I09c27a084100b223662f84de6cbe01bebe1fe774
to begin running.
* A skinStyle is added for the new `ext.echo.mobile` module.
`mobile.notifications.overlay` will soon cease to exist but is kept registered for
backwards compatibility reasons
- Drop ev.preventDefault call from onSkinClick - it is no longer necessary and will ensure
notifications overlay closes when shield is clicked while it is open.

Integration:
* A server side hook SkinMinervaReplaceNotificationsBadge allows Echo to replace
the current Minerva notification badge
* A to-be-created client side hook is subscribed to to deal with the navigations drawer
like functionality using the mainMenu code
* id and class names are added to the container for the NotificationBadge for compatibility with
ext.echo.init in Minerva's desktop mode (it will work like Vector)

See I09c27a084100b223662f84de6cbe01bebe1fe774 for understanding the bigger
picture.

Depends-On:  I09c27a084100b223662f84de6cbe01bebe1fe774
Bug: T221007
Change-Id: I4c11f1b241d629e1b294ebaec17472fbf944f8c7
2019-10-08 23:21:12 +00:00
jenkins-bot b40b29988c Merge "Adding a static width/height for mw-ui-icon background images." 2019-10-08 18:26:12 +00:00
Jan Drewniak c703e94fd3 Adding a static width/height for mw-ui-icon background images.
Adds a static width/height for icon background images as well
as min width/height for situation where flexbox layout
is at play.

Bug: T233521
Change-Id: I3a4ced61dac78df7a3411a5d8510949b491c8591
2019-10-08 19:35:08 +02:00
jdlrobson 59b093a889 Specify LESS suffix in import statements
Follow up to I379334d7729e587a2a0029550e30e7c46a4f7a7a

Change-Id: I549b1400904c7b1d4e40f5418dd665a759728f93
2019-10-07 18:06:57 +00:00
jenkins-bot 18b483b6ea Merge "Revert "MainMenu is a controller not a View and server rendered"" 2019-10-04 15:18:11 +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
jenkins-bot 3c6fd24f00 Merge "MainMenu is a controller not a View and server rendered" 2019-10-03 20:30:02 +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 5b3572ee39 Style rollback link on RecentChanges, Contributions and Watchlist
Bug: T232284
Change-Id: I8c38bb3715b5acaaf49333fcd50bac534dd6eef5
2019-10-02 23:20:23 +00:00
jenkins-bot 9152466474 Merge "Use consistent small font sizes" 2019-10-01 23:21:01 +00:00
jdlrobson 81bbd6eb48 Use consistent small font sizes
* Add @font-size-minerva-smallest and use it in place
of font-size: 0.8em across the site so that we get a round
number for our font sizes.

Bug: T229568
Change-Id: I4270225c07941b4c164d5e044f70d4b131dbc19d
2019-10-01 22:29:55 +00:00
Nicholas Ray e3560b1f93 Remove mobile diff page drawer margin on mobile screens
Although alignment of things on tablet is still anyone's guess, this
commit focuses on fixing the alignment of the contents in the mobile
diff drawer on mobile screen sizes only per [1] by setting the margin to
0.

[1] https://phabricator.wikimedia.org/T233151#5537879

Bug: T233151
Change-Id: Ic3a47cf98380c501709df3f443cd43f37ce1abe8
2019-10-01 14:34:10 -06:00
Nicholas Ray 2b9929a5f9 Vertically center clear icon within search form element
Rely on css top/transform to center it instead of calculations.

I84fc4224d5107188265d8ec0a26c0388664949a5 should be merged shortly after
this one.

Bug: T233156
Change-Id: I6e00f851ecb4e1ba8c1ef5d90bcc4310d66a820e
2019-09-30 16:58:25 -06:00
jenkins-bot 4ec857c2c4 Merge "Fix Recent Changes Comment alignment on deleted pages" 2019-09-27 20:58:39 +00:00
Nicholas Ray 54ec3653b8 Fix Recent Changes Comment alignment on deleted pages
On deleted pages, the comment was being floated making it appear out of
order and misaligned with the rest of the text. This commit fixes that
by removing the float and padding on deletion comments.

Bug: T232955
Change-Id: I3f07128f58ae032c628192f8fc0159aff2c30016
2019-09-27 12:32:30 -06: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
jenkins-bot 060c163b24 Merge "[ICONS] Remove padding from .mw-ui-icon-small class" 2019-09-26 23:45:48 +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
jdlrobson cd688eb197 Avoid flash of unstyled content on Special:Watchlist
Bug: T225127
Change-Id: I9b96627b1d48dddc30006fc52fc1816fbe8b29ac
2019-09-26 21:47:27 +00:00
jdlrobson b15fa199a2 Clear search alignment
* Refactor less variables to make icon touch-area sizes flexible 
* Search input is bumped up 1px to an even number

Bug: T233156
Change-Id: I156d09bfca8db9506c0e9cee21e4d6e0a2e91689
2019-09-25 22:15:21 +00:00
jenkins-bot 98f957219e Merge "Labels for mw-ui-icon-before elements should be vertically aligned inside" 2019-09-20 18:10:36 +00:00
jdlrobson 2a76493a56 Labels for mw-ui-icon-before elements should be vertically aligned inside
This also resolves the issue with the language menu item being grayed out
for pages without languages

Bug: T233167
Bug: T233050
Change-Id: I05c54c0d35e4990717a8c3dc4ab42841349535f1
2019-09-20 10:37:46 -07:00
jdlrobson 4ac03162f0 Add the mw-ui-icon-flush-top class
Bug: T232837
Change-Id: I285d6c7f26bb160eb4b646d241bf3acd0f567f62
2019-09-19 15:59:03 +00:00
jenkins-bot d61e1f7fb7 Merge "Generalize SearchOverlay styles to all "header-chrome" overlays" 2019-09-17 00:40:47 +00:00
jenkins-bot d2a5907c3e Merge "Only apply padding-top to overlays with headers" 2019-09-16 23:27:08 +00:00
jenkins-bot fde1955293 Merge "Add general messagebox (neutral) styling to shared.css" 2019-09-16 21:48:14 +00:00
Bartosz Dziewoński aadd499753 Generalize SearchOverlay styles to all "header-chrome" overlays
Although in practice, SearchOverlay is the only one.

Change-Id: Ibd70fab0ddf0f9513388c76717392871abd8bf26
2019-09-16 21:29:59 +02:00
Bartosz Dziewoński d8deb264f2 Only apply padding-top to overlays with headers
The incorrect padding-top was causing overlays with no headers to
always be scrollable. The issue was noticeable e.g. on the search
overlay or the editor loading overlay in MobileFrontend.

Change-Id: I28ece81402041eea10124c2076cff5a1cba049cf
2019-09-16 21:22:22 +02:00
Jdlrobson 9ec7217d47 Merge "Adjust notification icon to be the same size as the other icons" 2019-09-13 21:53:37 +00:00
Jdlrobson fd3599b603 Merge "Fix truncated text showing through icons & last-modified bar" 2019-09-13 21:53:27 +00:00
jdlrobson 109b24e0ee Adjust notification icon to be the same size as the other icons
Bug: T232011
Change-Id: I0300685d38551bc9ee2c2bd32d6348f32d4df4de
2019-09-13 13:55:01 -07:00
Jdlrobson 4542840cf6 Merge "Utilize the mw-ui-icon-flush-left/right classes to align icons" 2019-09-13 20:33:55 +00:00
Volker E c2fdf9404e Add general messagebox (neutral) styling to shared.css
Bug: T232553
Change-Id: I274471bad1fa402ede4b273444023ea31d2bd502
2019-09-13 13:24:30 -07:00
Jan Drewniak 633c48bddf Utilize the mw-ui-icon-flush-left/right classes to align icons
Affected icons:
- hamburger menu
- "search|notifications|user" menu in page header
- notification "circle" icon
- page actions menu
- section edit icon

Bug: T229440
Change-Id: I5587855d0d9ecf2fac20ce16845e6749c26ab7c2
2019-09-13 12:09:43 -07:00
Jan Drewniak 35e489de25 Fix truncated text showing through icons & last-modified bar
To accommodate for cached HTML a new class last-modified-bar__text
replaces last-modifier-tagline to help us distinguish between old
out dated HTML and the new HTML.

Bug: T232792
Bug: T232800
Change-Id: I53fa45058dbc81c91089840073e03113ff1a4b9c
2019-09-13 18:35:31 +00:00
jdlrobson 19d8f8896e Drop width declaration on close button
Not necessary or compatible with new icons.
A padding left is needed so that the cancel icon
matches up with the content body.

See "The "X" has too much padding, which is causing two issues:"
in attached issue

Bug: T229440#5490743
Change-Id: If76602436e797f2896004181eb776f049cf52fd5
2019-09-13 17:54:46 +00:00
Jan Drewniak 6223d571bc New mw-ui-icon spec for Minerva
Redefines the mw-ui-icon module from MediaWiki-core for
better mobile support.

The new spec maintains the same interface and class names as core
(mw-ui-icon, mw-ui-icon-element, mw-ui-icon-before etc,)
but ensures that icon sizing is more consistent and
provides larger and more flexible touch-areas to the
`.mw-ui-icon-element` class, which in practice is used to
make icon buttons.

This introduces a temporary defect in which the hamburger and user
menu icons are a little too close to the edges. This will be fixed in
I5587855d0d9ecf2fac20ce16845e6749c26ab7c2

Bug: T229440
Change-Id: I929090848f3e04647a97f4979ec78682623fa070
2019-09-12 21:47:09 +00:00
Jan Drewniak be76f05ebb Prepare for new mw-ui-icon spec for Minerva
Includes icon fixes and removal of some CSS overrides.

This causes the following temporary defects to the skin:
* Last modified bar will temporarily be squashed
* clear search  icon will be misaligned vertically

Depends-On:  Ie811d25595d041c35e6c214190101821f3a5d466
Bug: T229440
Change-Id: I0a3a73421791ad353bbcebaeb8241ad062f67ae4
2019-09-12 18:44:44 +00:00
Bartosz Dziewoński 1015e653d6 SearchOverlay: Fix position of the 'clear' button
Before c0f08790ea, this was defined as
`( @iconSize / 2 ) + @headerVerticalPadding`, which computed to 0.9em.
Restore the old value since it looks wrong now: T215426#5486117.

Change-Id: Ib14a148da305d98f2d1ce9b1c71cb8910d665e44
2019-09-12 01:08:34 +02:00
jenkins-bot 02986e7a85 Merge "Change height of overlay headers to 3em, keep site header unchanged" 2019-09-10 22:58:50 +00:00