Due to the addition of scrollbars in the sidebar in a previous commit, an additional 0.5 rem were added, which was not mirrored to the main content area and caused margins on the left and right sides. Now equal left and right smaller margins are used for small screens, and the original margin size for left and right on bigger screens. The navbar's margin top and bottom are adjusted accordingly, and so is the search bar.
When the whole title bar (.nav-brand) in detail view gets too long, the action buttons move to a second line and are placed to the right.
When the title itself is very long, the text is cut off and an ellipsis is appended.
Font sizes are adapted for small screens.
The footer's margins now behave like the navbar ones.
Screenshots from Chrome Dev Tools, iphone 5:
As a reminder to myself:
In a future step font sizes need to be (re-)based on rem (currently there is % and em, which causes lots of troubles).
A title that is too long could very well be displayed with a horizontal scroll bar (which looks ugly on browsers that do not allow native scrollbar styling; but there are JS libraries...).
Many things in the "main content" area still need to be taken care of.
Due to the addition of scrollbars in the sidebar in a previous commit, an additional 0.5 rem were added, which was not mirrored to the main content area and caused margins on the left and right sides. Now equal left and right smaller margins are used for small screens, and the original margin size for left and right on bigger screens. The navbar's margin top and bottom are adjusted accordingly, and so is the search bar.
When the whole title bar (
.nav-brand
) in detail view gets too long, the action buttons move to a second line and are placed to the right.When the title itself is very long, the text is cut off and an ellipsis is appended.
Font sizes are adapted for small screens.
The footer's margins now behave like the navbar ones.
Screenshots from Chrome Dev Tools, iphone 5:
As a reminder to myself:
In a future step font sizes need to be (re-)based on rem (currently there is % and em, which causes lots of troubles).
A title that is too long could very well be displayed with a horizontal scroll bar (which looks ugly on browsers that do not allow native scrollbar styling; but there are JS libraries...).
Many things in the "main content" area still need to be taken care of.