mediawiki-skins-Vector/resources/skins.vector.styles/skin.less
bwang b2705c55f1 Use Codex for typeahead search styles
- Update SearchBox.mustache markup to use codex styles
- Scope old SearchBox markup to LegacySearchBox.mustache
- Add handling for thumbnail and autoexpand search variants
- Adds a 'Search' button to SearchBox.mustache matching the initial non vue search box with the Codex design
- Refactor SearchBox CSS so styles are scoped better

Visual changes:
A "Search" button now appears on page load when it previously only appeared after loading in Vue

Bug: T337966
Change-Id: Ibcffe00292ab4f9f5f9919982d578793cf8594de
2023-06-12 16:26:33 -07:00

59 lines
1.7 KiB
Plaintext

/**
* Vector modern stylesheets
* See '../common/common.less' for common screen and print Vector stylesheets.
*/
@import 'mediawiki.mixins.less';
@import '../common/variables.less';
@import '../common/mixins.less';
@media screen {
.vector-feature-zebra-design-disabled {
// Layouts
@import './layouts/screen.less';
@import './layouts/preZebra.less';
@import './layouts/grid.less';
@import './layouts/toc/pinned.less';
@import './layouts/toc/unpinned.less';
// Components
@import './components/Dropdown.less';
@import './components/MainMenu.less';
@import './components/PinnableElement.less';
@import './components/PinnableHeader.less';
@import './components/PageTools.less';
@import './components/StickyHeader.less';
@import './components/TableOfContents.less';
}
}
@media screen {
// Components
@import './components/Button.less';
@import './components/VueEnhancedSearchBox.less';
@import './components/LanguageDropdown.less';
@import './components/UserLinks.less';
@import './components/Header.less';
@import './components/Icon.less';
@import './components/Footer.less';
@import './components/Menu.less';
@import './components/MenuTabs.less';
@import './components/PageTitlebar.less';
@import './components/PageToolbar.less';
@import './components/PopupNotification.less';
@import './components/SearchBox.less';
@import './components/SearchBoxLoader.less';
@import './components/Watchstar.less';
@import './components/LimitedWidthToggle.less';
}
@media all {
// Component styles that should apply in all media.
@import './components/Logo.less';
}
@media print {
@import './layouts/print.less';
}
@import './layouts/gradeC.less';