The width should apply at all resolutions. Note, because of the nature
of flex box and flex-grow the personal tools can grow larger than this
value.
This avoids Alex Hollender (WMF) and similarly long usernames from every
running to the next line before they are allowed to.
Bug: T249363
Change-Id: I4640947aaaf7ab764cb17b911af7085ac291b7d1
I overlooked the horizontal padding on the page container. This needs to be
included in the decision on whether to make the header 2 lines on 1.
Bug: T249363
Change-Id: I4fabac7d57e37db87d2363073317109f582de883
The calculations were a little incorrect as I failed to consider the
sidebar button correctly and how the search's min width and max width
impact layout.
I also move rules from Sidebar.less regarding the placement of the button
into layout where I believe they belong. We do not have a header component, so the
positioning (margin) of the sidebar button in current form should be here.
This can be revisited if we introduce a header component.
Bug: T249363
Change-Id: I4ff640380eafc8beedb2c3c8fb00a56c71c5cb45
The width comfortable should consider the max-width of the search
not the min-width.
This fixes the bug documented in T249363#6391041
Bug: T249363
Change-Id: I3e216a3705730092f88d1dcbb5193e411945a083
To support roll out and avoid issues with cached HTML the new
styles for the new search feature are restricted to HTML where
the body tag has `skin-vector-search-header` class.
For legacy mode, we introduce a new class
`skin-vector-search-header-legacy` and temporarily use a CSS3 `:not()`
selector to ensure the styles ship during the phase where cached
HTML can be served. While this will create some display issues in
browsers that do not support CSS3 selectors, all grade A browsers in
our compatability matrix support this.
Bug: T249363
Change-Id: I7f8059d43eaab49de362405784b34a4fe502c7b0
