StarCitizenTools/mediawiki-skins-Citizen
1
0
Fork 0
mirror of https://github.com/StarCitizenTools/mediawiki-skins-Citizen.git synced 2024-11-15 02:24:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(AdvancedSearch): ✨ update AdvancedSearch styles

Browse source
This commit is contained in:
alistair3149 2022-12-13 17:39:50 -05:00
parent 224c190a47
commit 88fca93c46
No known key found for this signature in database
4 changed files with 97 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
README.md
View file

@ -36,7 +36,7 @@ OOUI | A | 0.44.3 | 2022-11-30
### Extensions
Name | Grade | Version | Last updated
:--- | :--- | :--- | :---
[AdvancedSearch](https://www.mediawiki.org/wiki/Extension:AdvancedSearch) | B | REL1_35 `fae6250` | 2021-08-26
[AdvancedSearch](https://www.mediawiki.org/wiki/Extension:AdvancedSearch) | B | REL1_39 `3a0eed7` | 2022-12-12
[AJAXPoll](https://www.mediawiki.org/wiki/Extension:AJAXPoll) | A | REL1_39 `8429d8d` | 2022-10-25
[ApprovedRevs](https://www.mediawiki.org/wiki/Extension:Approved_Revs) | B | N/A | N/A
[Babel](https://www.mediawiki.org/wiki/Extension:Babel) | B | MLEB 2021.07 | 2021-07-29

12
skinStyles/extensions/AdvancedSearch/ext.advancedSearch.initialstyles.less
View file

@ -3,13 +3,21 @@
*
* SkinStyles for Extension:AdvancedSearch
* Module: ext.advancedSearch.initialstyles
* Version: REL1_35 fae6250
* Version: REL1_39 3a0eed7
*
* Date: 2021-08-26
* Date: 2022-12-12
*/
.client-js {
.mw-search-form-wrapper {
// min-height: 122.6px;
}
.mw-search-spinner {
top: 5em;
// Very hacky since it might be wrong because of font size
left: 23em;
&:before,
&:after,
& .mw-search-spinner-bounce {

103
skinStyles/extensions/AdvancedSearch/ext.advancedSearch.styles.less
View file

@ -3,54 +3,123 @@
*
* SkinStyles for Extension:AdvancedSearch
* Module: ext.advancedSearch.styles
* Version: REL1_35 fae6250
* Version: REL1_39 3a0eed7
*
* Date: 2021-08-26
* Date: 2022-12-12
*/
.mw-advancedSearch-container {
border-bottom: 1px solid var( --border-color-base );
margin-top: var( --space-xs );
}
// Align with Citizen label styles
.mw-advancedSearch-searchPreview-label,
.advancedsearch-namespacesPreview-label {
margin-right: var( --space-xs );
color: var( --color-base--subtle );
font-size: 0.875rem;
font-weight: var( --font-weight-normal );
letter-spacing: 0.05em;
}
.mw-advancedSearch-fieldContainer {
border-color: var( --border-color-base );
background: transparent;
max-width: none;
border: 0;
border-radius: var( --border-radius--small );
margin-top: 0;
background: var( --color-surface-2 );
fieldset {
border-color: var( --border-color-base );
border-top-color: var( --border-color-base );
margin-top: var( --space-md );
}
.oo-ui-labelElement > .oo-ui-fieldsetLayout-header > .oo-ui-labelElement-label {
background: var( --color-surface-0 ); // the parent containers are transparent
background: var( --color-surface-2 );
color: var( --color-base--subtle );
font-size: 0.875rem;
font-weight: var( --font-weight-normal );
letter-spacing: 0.05em;
}
}
.mw-advancedSearch-expandablePane-options,
.mw-advancedSearch-expandablePane-namespaces {
max-width: none;
padding-top: 0; // padding handled through container
}
.mw-advancedSearch-expandablePane-button {
&.oo-ui-widget-enabled.oo-ui-buttonWidget {
&.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
background-color: var( --color-surface-2 );
> .oo-ui-buttonElement-button {
padding-left: 0;
border-color: transparent;
background-color: transparent;
&:hover {
background-color: var( --background-color-quiet--hover );
color: inherit;
}
// Added active state
&:active {
background-color: var( --background-color-quiet--active );
}
// HACK: Flip indicator when expanded
.oo-ui-indicator-down {
transition: opacity 100ms, transform 250ms ease;
}
&[ aria-expanded='true' ] {
.oo-ui-indicator-down {
transform: rotate3d( 1, 0, 0, 180deg );
}
}
}
> .oo-ui-buttonElement-button {
&:hover {
background-color: var( --color-surface-2--hover );
color: var( --color-base );
}
&.oo-ui-buttonElement-pressed > .oo-ui-buttonElement-button {
background-color: transparent;
}
}
}
.mw-advancedSearch-namespace-selection-header {
> .mw-advancedSearch-namespace-search-in-label {
font-weight: var( --font-weight-semibold );
}
}
.mw-advancedSearch-namespace-selection {
border-color: var( --border-color-base );
max-width: none;
border: 0;
border-radius: var( --border-radius--small );
margin-top: 0;
background: var( --color-surface-2 );
}
.mw-advancedSearch-namespace-border {
border-color: var( --border-color-base );
border-top: 1px solid var( --border-color-base );
border-bottom: 0;
}
.mw-advancedSearch-namespaceFilter.oo-ui-tagMultiselectWidget {
max-width: none;
}
.mw-advancedSearch-namespaceFilter .oo-ui-tagMultiselectWidget-handle {
border-radius: 0 0 var( --border-radius--small ) var( --border-radius--small );
}
.mw-advancedSearch-namespaceFilter .oo-ui-tagMultiselectWidget-input .oo-ui-inputWidget-input {
background-color: var( --color-surface-0 );
}
// that's how nested the background-color property of a tagWidget is
.oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined .oo-ui-tagItemWidget.oo-ui-widget-enabled {
&.selected {
border-color: var( --color-primary );
background-color: var( --color-surface-3 );
background-color: var( --background-color-primary--hover );
}
}

9
skinStyles/mediawiki/special/mediawiki.special.search.styles.less
View file

@ -16,15 +16,6 @@
display: none;
}
.mw-search-form-wrapper {
border-bottom: 1px solid var( --border-color-base );
// Wrapper has a border bottom already
.mw-search-profile-tabs:last-child {
border-bottom: 0;
}
}
#mw-search-top-table {
display: flex;
justify-content: space-between;