Commit graph

8 commits

Author SHA1 Message Date
Volker E 3da637156f Use default duration LESS variable and align timing function one
Bug: T236224
Change-Id: I5c709a0989ab22839453e64bcefab201c666bf3c
2019-10-24 14:50:38 -07: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 7280d255c0 Dev: Prep for storybook
* 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
2019-08-21 12:20:26 -07:00
Stephen Niedzielski bfdfc1165c [UI] [menu] slide the main menu over the page
Slide the main menu over the page instead of sliding the page over the
menu. Also, use viewport units for the main and notification menus.

Note, this lays foundation work for T225213.

Bug: T206354
Change-Id: I14b67d1e97b84086ea13e28df8148824a1f493e3
2019-08-12 18:22:45 +00:00
Stephen Niedzielski 73a95866bc [menu] [UI] [notifications] make notifications slide over top
Animate the notifications menu over the content instead of the content
over the menu. Try to trim unnecessary CSS.

Bug: T206354
Bug: T226125
Change-Id: I08f65798ef41da3c7c48fb5c65e31c6a3dd71af1
2019-08-07 19:42:48 +00:00
Stephen Niedzielski 10076c1b61 [dev] divide main menu LESS
Split apart the extensive mainmenu.less file into a few component-like
files: MainMenu, MainMenuFooter, MainMenuItem, and NotificationsOverlay.
Two variables, @duration and @easing, were moved to minerva.variables.
The separation is imperfect as some overlap still exists but is far
better than before.

This patch is focused on division without regression. Please limit any
refactor requests.

No user visible changes intended. The only selector that was cognizantly
changed was to duplicate the drawer visibility on main menu and
notifications overlay:

  // Old: mainmenu.less
  .navigation-drawer,
  .transparent-shield {
    visibility: visible;
  }

  // ---

  // New: MainMenu.less
  #mw-mf-page-left,
  .transparent-shield {
    visibility: visible;
  }

  // New: NotifcationsOverlay.less
  .navigation-enabled {
    .notifications-overlay {
      visibility: visible;
    }
  }

The is unfortunately useless. It is best to reproduce these changes
locally by renaming mainmenu.less to MainMenu.less and extract parts to
MainMenuFooter, MainMenuItem, and NotificationsOverlay LESS files until
the result matches.

Bug: T206354
Change-Id: I8d37c5346efcf39a4d76322fd6e6af3fff96ac53
2019-08-07 16:48:31 +00:00