On branded navbars with long provider names, the hamburger icon will break to another line on small screens.
Changes
Move styling changes from ember-osf-preprints to osf-style
Lessoned padding between branded name and the icon
Increased margin between the branded name and links
Added flexbox styling and an ellipsis overflow to long brand names on mobile view
QA Notes
This will affect how the navbar acts on smaller screens. You should be able to make the screen small and notice that the hamburger menu icon doesn't drop to a lower line with a brand like LIS Scholarship Archive.
Even on a navbar with many links you should also notice that the branded name never overlaps any of the links.
Purpose
On branded navbars with long provider names, the hamburger icon will break to another line on small screens.
Changes
ember-osf-preprints
toosf-style
QA Notes
This will affect how the navbar acts on smaller screens. You should be able to make the screen small and notice that the hamburger menu icon doesn't drop to a lower line with a brand like
LIS Scholarship Archive
.Even on a navbar with many links you should also notice that the branded name never overlaps any of the links.
On mobile view:
Ticket
https://openscience.atlassian.net/browse/IN-368