mediawiki-skins-Vector/resources/skins.vector.styles
Nicholas Ray 78787d9665 Switch to navigation-first DOM order under $wgVectorIsSearchInHeader feature flag
This moves the header, navigation, sidebar, and article toolbar to be
before the content in the DOM. As a result, a lot of absolute
positioning logic can be removed and styles can be simplified.

Note that although the sidebar was moved from the header into the
workspace container allowing it to de-absolutely positioned, its
absolute positioning was kept intact as it has a fair amount of
complexity that should be handled in a separate task.

To activate, set  `$wgVectorIsSearchInHeader = true;`

Changes that could cause concern:

* The "jump to search" link was removed as the search is now much
earlier in the DOM and I questioned the value of keeping this. However,
it can be added back in if this change is contentious.

* A "jump to content" link was added to account for the new DOM order.

* Because the sidebar was taken out of the header, users will not be
able to tab from the sidebar button into the sidebar without additional
tweaking (e.g. should we add JS to enable this?). It was deemed that
this work can be saved as a follow-up task.

* I applied `overflow-y: auto` to the `mw-page-container` because the
header's top margin was collapsing and caused whitespace to appear
between the viewport and the header. Alternatively, we could apply a top
padding to the page container and remove the header's top margin. I went
for the simplest solution but am open to alternatives.

* I left the footer as-is in this patch to minimize risk. It might be
cleaner later on to move the footer inside the workspace container which
would leave only one workspace container.

Bug: T261802
Change-Id: Ic553fab3bde25769b103d899b92b3b694c00c384
2020-09-09 18:31:35 +00:00
..
common [less] Remove normalize rules covered by mediawiki.skinning/normalize module 2020-07-31 22:21:25 +00:00
images skins.vector.styles: Remove PNG fallback and merge skins.vector.icons module 2020-08-13 13:53:46 +01:00
legacy Split Searchbox layout styles for legacy and modern 2020-07-14 13:01:35 -07:00
checkboxHack.less Move sidebar into header to improve tab order 2020-06-25 16:55:34 -06:00
Footer.less Remove #footer selectors now that cache has expired 2020-05-06 18:55:50 -07:00
Indicators.less Organize CSS by common, layout, typography and components 2020-05-07 22:57:13 +00:00
layout-default.less Switch to navigation-first DOM order under $wgVectorIsSearchInHeader feature flag 2020-09-09 18:31:35 +00:00
layout-max-width.less Switch to navigation-first DOM order under $wgVectorIsSearchInHeader feature flag 2020-09-09 18:31:35 +00:00
layout-print.less Print: Add layout print styles on Ctrl+p and ElectronPdf 2020-08-03 20:06:37 +00:00
layout-search-header.less Switch to navigation-first DOM order under $wgVectorIsSearchInHeader feature flag 2020-09-09 18:31:35 +00:00
layout.less Include @padding-horizontal-page-container in header adjustment calculations 2020-08-26 14:33:22 -07:00
Logo.less Logo shouldn't import layout 2020-07-07 22:22:24 +00:00
Menu.less Refactor: Drop legacy selectors 2020-08-18 12:39:13 -07:00
MenuDropdown.less Replace deprecated background-image-svg() mixin calls 2020-07-23 17:50:31 -07:00
MenuPortal.less Refactor: Drop legacy selectors 2020-08-18 12:39:13 -07:00
MenuTabs.less MenuTabs: Remove IE 8 fallback 2020-07-23 18:13:31 -07:00
SearchBox.less [search] Tweak the search input styles 2020-09-04 14:49:50 -06:00
SearchBoxLoader.less Adds loading indicator for new search module 2020-09-08 13:59:41 +00:00
Sidebar.less Switch to navigation-first DOM order under $wgVectorIsSearchInHeader feature flag 2020-09-09 18:31:35 +00:00
SidebarLogo.less [legacy] Split sidebar code and mark layout as legacy in preparation for new layout 2020-04-16 11:29:03 -07:00
SiteNotice.less Organize CSS by common, layout, typography and components 2020-05-07 22:57:13 +00:00
skin-legacy.less [styles] Remove Internet Explorer 8 specific hacks and workarounds 2020-08-27 01:34:13 -07:00
skin.less Merge "Adds loading indicator for new search module" 2020-09-08 14:24:09 +00:00
TabWatchstarLink.less Remove the loading background image for loading class 2020-09-02 11:42:49 -07:00