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

feat: rewrite MediaWiki UI skinstyles to the new system

Browse source
This commit is contained in:
alistair3149 2021-07-27 16:24:26 -04:00
parent 07484ee190
commit cebbf32b0b
No known key found for this signature in database
GPG key ID: 94D081060FD3DD9C
3 changed files with 86 additions and 39 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
skinStyles/mediawiki/ui/mediawiki.ui.components.button.less
View file

@ -1,48 +1,51 @@
/*
* Citizen - Buttons
* https://starcitizen.tools
* Citizen
*
* SkinStyles for MediaWiki UI
* Module: mediawiki.ui.button
* Version: Core REL1_35 086b4f1
*
* Date: 2021-07-27
*/
@import '../../../resources/variables.less';
.mw-ui-button {
border-color: var( --border-color-base );
background-color: var( --background-color-framed );
color: var( --color-base );
background-color: var( --color-surface-2 );
color: var( --color-base--emphasized );
&:visited {
color: var( --color-base );
color: var( --color-base--emphasized );
}
&:hover {
border-color: var( --border-color-base );
background-color: var( --background-color-framed--hover );
color: var( --color-base--emphasized );
background-color: var( --color-surface-2--hover );
color: var( --color-base );
}
&:focus {
border-color: var( --color-primary );
background-color: var( --background-color-framed );
background-color: var( --color-surface-2 );
box-shadow: inset 0 0 0 1px var( --color-primary );
color: var( --color-base );
}
&:active,
&.is-on {
border-color: var( --background-color-framed--active );
background-color: var( --background-color-framed--active );
color: var( --color-base--subtle );
border-color: var( --color-surface-2--active );
background-color: var( --color-surface-2--active );
color: var( --color-base--emphasized );
}
&:disabled {
border-color: var( --background-color-framed--active );
background-color: var( --background-color-framed--active );
border-color: var( --color-surface-4 );
background-color: var( --color-surface-4 );
color: var( --color-base--subtle );
&:hover,
&:active {
border-color: var( --background-color-framed--active );
background-color: var( --background-color-framed--active );
border-color: var( --color-surface-4 );
background-color: var( --color-surface-4 );
color: var( --color-base--subtle );
}
}

66
skinStyles/mediawiki/ui/mediawiki.ui.components.checkbox.less
View file

@ -1,23 +1,63 @@
/*
* Citizen - Checkbox
* https://starcitizen.tools
* Citizen
*
* SkinStyles for MediaWiki UI
* Module: mediawiki.ui.checkbox
* Version: Core REL1_35 086b4f1
*
* Date: 2021-07-27
*/
@import '../../../resources/variables.less';
.mw-ui-checkbox:not( #noop ) {
[ type='checkbox' ] {
& + label:before {
border-color: var( --border-color-base );
background-color: var( --color-surface-1 );
}
.skin-citizen-dark {
.mw-ui-checkbox:not( #noop ) {
[ type='checkbox' ] {
& + label:before {
border: 1px solid @dark-bg-60;
background-color: @dark-bg-0;
&:enabled {
&:focus + label:before {
border-color: var( --color-primary );
}
// disabled checkboxes have a gray background
&:disabled + label:before {
border-color: @dark-bg-30;
background-color: @dark-bg-30;
&:hover + label:before {
border-color: var( --color-primary--hover );
}
&:active + label:before {
border-color: var( --color-primary--active );
background-color: var( --color-primary--active );
box-shadow: inset 0 0 0 1px var( --color-primary--active );
}
&:checked {
& + label:before {
border-color: var( --color-primary );
background-color: var( --color-primary );
}
&:focus + label:before {
border-color: var( --color-primary );
background-color: var( --color-primary );
box-shadow: inset 0 0 0 1px var( --color-primary ), inset 0 0 0 2px #fff;
}
&:hover + label:before {
border-color: var( --color-primary--hover );
// FIXME: Replace with WikimediaUI Base vars when available.
background-color: var( --color-primary--hover );
}
&:active + label:before {
border-color: var( --color-primary--active );
background-color: var( --color-primary--active );
}
}
}
&:disabled + label:before {
border-color: var( --color-surface-4 );
background-color: var( --color-surface-4 );
}
}
}

22
skinStyles/mediawiki/ui/mediawiki.ui.components.input.less
View file

@ -1,21 +1,25 @@
/*
* Citizen - Inputs
* https://starcitizen.tools
* Citizen
*
* SkinStyles for MediaWiki UI
* Module: mediawiki.ui.input
* Version: Core REL1_35 086b4f1
*
* Date: 2021-07-27
*/
@import '../../../resources/variables.less';
.mw-ui-input {
border: 1px solid var( --border-color-input );
background-color: var( --background-color-input );
color: var( --color-base );
border-color: var( --border-color-base );
background-color: var( --color-surface-1 );
color: var( --color-base--emphasized );
&:hover {
border-color: var( --border-color-input--hover );
border-color: var( --border-color-base--darker );
}
&:disabled {
border-color: var( --background-color-framed--active );
border-color: var( --border-color-base--darker );
background-color: var( --color-surface-3 );
color: var( --color-base--subtle );
}
}