Skip to content

[Mobile] Restore adaptive layout for small screens

Unfortunately, the responsive layout defined within media breakpoints has been dropped since refactoring to 4.0.0-RC1. Some of the adaptive css rules are missing now and have to be restored.

  1. The navigation bar should collapse and provide a dropdown menu for its items and.
  2. The logo should scale down accordingly to the given navigation bar height.
  3. The toolbar should get a different concept, as many new features have been introduced now. Maybe only icons should be displayed, or an off-canvas drawer on the right will be helpful. Most of the time, it won't be used anyway and could be moved off the screen to make space for more content.
  4. The font-size should scale up/down according to the screen dimensions within a minimum and a maximum size.
  5. The navigation bar and the toolbar should have a smaller height on small screens.
  6. Horizontally stacked grid elements should be stacked vertically on small screens to avoid horizontal scrolling wherever possible.

Bildschirmfoto_2018-09-24_um_18.50.08

Bildschirmfoto_2018-09-24_um_18.50.28

Bildschirmfoto_2018-09-24_um_18.50.45

Edited by Ghost User
To upload designs, you'll need to enable LFS and have an admin enable hashed storage. More information