* 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
* 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
Although it's not being linked to, it can be visited from cached HTML.
Ensure on this page the menu shows.
Change-Id: Ib688e212c06d7febe82dcd3298e0627b4751dc97
* .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
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
Followup to I30aba29 fixes an issue where the user links (talk|contribs)
were pushed on a new line.
Bug: T236328
Change-Id: I52871ffc643b0484b62f8a2049101027d0de7d50
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
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
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
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
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
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
Using newly introduced variables instead of fixed values.
Also adding `transition` to property blacklist to ensure using
mediawiki.mixin.
Bug: T236224
Change-Id: I3d2d05f4e50e7b6bba0fe84fae1dde5de5b75492
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
While working on I05c4e5f7a8b18a3 I've noticed the missing transition.
Also adding standard WikimediaUI variables in support of this.
Change-Id: I30c75ed306bf826ae40db3703ef423dfad85fa74
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
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
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
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
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
* 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
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
Rely on css top/transform to center it instead of calculations.
I84fc4224d5107188265d8ec0a26c0388664949a5 should be merged shortly after
this one.
Bug: T233156
Change-Id: I6e00f851ecb4e1ba8c1ef5d90bcc4310d66a820e
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
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
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
* 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
This also resolves the issue with the language menu item being grayed out
for pages without languages
Bug: T233167
Bug: T233050
Change-Id: I05c54c0d35e4990717a8c3dc4ab42841349535f1
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
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
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
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
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
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
Note: this agitates T230232 again - when merging this please
make sure a merge for I929090848f3e04647a97f4979ec78682623fa070
is pending.
In various places we try to override the default mw-ui-icon behaviours
The hacks need to be removed as part of addressing the core problem.
Changes:
* Wherever we use mw-ui-icon-before in PHP - wrap the label with a span
so that label font-size is altered where needed - not the icon
* Where a small icon is needed us isSmall parameter for the Icon component
* Apply font-size to labels of mw-ui-icon-before elements
* The browser tests need a slight update to access the span element inside
a menu item - in the case of the logout button the label is always hidden,
so we need to check the visibility of the parent element (secondary_action)
Bug: T229440
Depends-On: I3f803ec4c9068b30aa93b803391aa4d65d8310ff
Change-Id: I07e4ae233979636b739f1117dd7703571e0a9366
This ensures that the logout button is centered vertically on
absolutely positioned elements.
Bug: T229440
Change-Id: I4d230c01fc4d32e854b7ed1e7ed5e09c040954b1
Additionally, apply the same to .mw-rcfilters-ui-overlay, which only
accidentally had the same font-size defined in MediaWiki until
I672fdcebbdc586765de2c10f9a9a21796db57cc5.
Also change .rcfilters-container to .mw-rcfilters-container, since
the former class is deprecated.
Change-Id: I221f6c2d637c7d2a843bfc4a2f7cd9877e2a5b12
On iOS Safari, the screen zooms in when the user focused on
the text input of the rcfilters overlay. This commit adds a quickfix to
address this problem by setting the font-size to its initial value
(assumed to be 16px).
Bug: T231049
Change-Id: I98d28115e570a11d08ba2bd189c0b9151f834e7d
Split @headerHeight variable into @siteHeaderHeight and @overlayHeaderHeight.
@overlayHeaderHeight is now set to 3em (48px).
Use @siteHeaderHeight for the base skin interface, and @overlayHeaderHeight
for overlays.
skinStyles/mobile.notifications.overlay/minerva.less:
* Update footer height to remain the same as header height.
skinStyles/mobile.startup/search/SearchOverlay.less:
* Use @siteHeaderHeight even though it is an overlay, because it's
supposed to exactly match the base skin interface.
Bug: T215426
Change-Id: Iaa36f581a12a8eea2b755ae583b8a2c6324ebe29
Two new feature flags:
1) MinervaPersonalMenu
2) MinervaAdvancedMainMenu
Changes:
* AMC defaults to false on desktop - desktop doesn't have AMC mode it just
enables several skin options.
* WHen inserting a link at the bottom of the page check whether the talk at top
of the page (tabs) is enabled.. not AMC
* Update ServiceWiring to construct menu based on MinervaAdvancedMainMenu
and MinervaPersonalMenu - note when former is enabled but not latter there is
no way to logout. Noted in README.
* Use one entry point for skins.minerva.amc.styles/index.less
* Document files inside skins.minerva.amc.styles to make it clear which features
they are associated with
* Drop history page styles when AMC is disabled - it's not possible to ever get to
these as the history page redirects in non-AMC mode
* Rename the class .minerva--amc-enabled to minerva--history-page-action-enabled
to reflect its real purpose and move styles from skins.minerva.base.styles to skins.minerva.amc.styles
No need to worry about cached HTML as AMC runs without cache...
* Remove isAnyAMCOptionEnabled - it's an antipattern and should be discouraged as it discourages the
art of feature flagging. Nothing is using it after these changes.
* The AMC_MODE flag is disabled. There is no need for this - AMC is not a feature and therefore not a
skin option. It is a mechanism for turning on other skin options. Tests are updated.
Testing:
It should now be possible to enable any feature in `beta` and see it in the beta of the
site.
Bug: T229295
Change-Id: I48959905f5c09721b14a27aa1a5ad82849ac6263
* Remove ambiguity in imports - say the file extension
'less' for all instances of variables and mixins.
* Separate toast styles from drawer styles so they can be
imported separately
* associate header-action selector with its parent
(.overlay-header) not parent's parent (.overlay) so it can be imported
and rendered without the Overlay.
Change-Id: Ib7e19a440ba095d6424d35305fb41d643ca9764c
Color progressive/destructive (blue and red) do not make
sense on a black background, so we use white and underlined
for both of these. Note these don't seem to be used currently
so this is not a breaking change.
Bug: T150189
Change-Id: I78a92b5b6c76638633b99fe32670911d355ce6f3
Force rollback, tagmarkers and revision delete/undelete onto their
own lines without floats
Bug: T229704
Change-Id: I0727f89bf4e906def9d3cfc8af8f921d6c12c68a
- decreases the font-size of the rcfilters module
- increases the font-size of the changeslist date headers
- ensures there is no left margin on the changeslist <ul>
Bug: T229360
Change-Id: I99867ad3702c71b7e627c394359dc02fe4b9214e
We use 0.9em in a variety of places, to shrink font-size from the
default font-size. However given we use 16px as a base font this results
in a font-size of 14.4px. This can also cause problems with icons resulting
in rounding errors when used with multiple icons
This changes the font-size to 14px for those areas and makes future usages
centralized by adding a specific variable.
Also amending `@font-size-browser` variable to be aligned to naming convention
and equal to Vector one.
Bug: T229399
Change-Id: I8e31bca2982c049a9be73c89aa9e8e2aa8141269
The changeslist module is the list of results on special
pages such as recent changes, watchlist, and parts of action history.
Adds a skin style to special.changeslist module.
Bug: T228419
Change-Id: I324b1f136f5314cb6acdba3155b07136bbde363a
Define the color etc. in the base styles, so that other drawers will
not have to redefine them to display the shield.
Bug: T214049
Change-Id: Ife957374cb0d21446db2067171e68fb726ad8347
Before this commit, the filters form would stay collapsed and the user
couldn't toggle the visibility of the form. This commit fixes that by
loading the necessary modules for the history action to make the form
toggleable again:
- mediawiki.page.ready
- jquery.makeCollapsible
- jquery.makeCollapsible.styles
Additional Changes:
- The explicit addition of the 'mediawiki.action.history' module to the
defaultModules array in SkinMinerva was removed because this module
should already be added by HistoryAction.php and all we are doing with
Minerva is styling it differently.
- The styling to hide the filter revisions box in
skinStyles/mediawiki.action.history.styles.less was removed now that
this functionality should work again
Bug: T223204
Change-Id: Icf4a22a62228aca5a120bcdf3d6fede35b3c928e
When opening/closing the main navigation, the large blue button
on the action=history page is visible above the opaque page content.
This changes the z-index when the main navigation is enabled.
Bug: T219895
Change-Id: I724c2419800a4aec0b55b18be920d8bf7e47fa60
Styles the action=history page to resemble it's desktop
counterpart for users in AMC mode.
Bug: T219895
Change-Id: Ide359724a4628f69ef03acee7718d70c698b8faf
