mediawiki-skins-Vector/resources/skins.vector.styles/components/BottomDock.less
Moh'd Khier Abualruz 182bb7519b Migrate uses of codex-search in Vector to use CodexModule
- Loaded new skins.vector.search.codex.scripts module in skin.json, with only the CdxTypeaheadSearch component with codexScriptOnly flag set to true.
- Included skins.vector.search.codex.scripts in the script loading configuration for Vector22 within skin.json.
- Turned off the "interface-message-box" feature within Vector22's skins.vector.styles configuration in skin.json, as Codex now supplies these styles.
- Fix the style selector to add `.cdx-button` to `.vector-limited-width-toggle` in BottomDock.less since using the codex style
- Substituted "codex-search-styles" with "skins.vector.search.codex.styles" in the existing configuration.
- Ensured the availability of skins.vector.search.codex.scripts module for use, marking it in the list of modules in skin.js.
- Modified App.vue to utilize skins.vector.search.codex.scripts instead of @wikimedia/codex-search.
- Update App.test.js.snap to the latest output form
- Update bundlesize.config.json with newest values

Bug: T356677
Change-Id: I7fc223db01171efe6656792530d4b625be4c8edc
2024-03-13 15:58:26 +00:00

43 lines
1,003 B
Plaintext

.client-nojs .vector-settings {
display: none;
}
.vector-settings {
position: fixed;
bottom: 8px;
right: 8px;
z-index: @z-index-stacking-1;
ul {
padding: 0;
list-style: none;
display: flex;
flex-direction: column-reverse;
align-items: center;
column-gap: 8px;
row-gap: 8px;
}
}
/**
* Limited width toggle - a button which lets users change the layout from
* a fixed-width content column to a layout where the content takes up the
* full window width.
*/
// By default, toggle should be hidden unless the breakpoint below is reached.
.vector-limited-width-toggle.cdx-button,
.vector-limited-width-popup {
display: none;
}
// Note on certain pages the control will have no effect e.g. Special:RecentChanges
// Defining this at 1400px is a product decision so do not change it
// (more context at https://phabricator.wikimedia.org/T326887#8540889)
@media ( min-width: 1400px ) {
.vector-limited-width-toggle.cdx-button,
.vector-limited-width-popup {
display: block;
}
}