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

refactor: clean up header background var

Browse source
This commit is contained in:
alistair3149 2021-02-04 10:38:29 -05:00
parent 64c89ecbf1
commit 73a18ceb56
No known key found for this signature in database
GPG key ID: 94D081060FD3DD9C
3 changed files with 16 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
resources/skins.citizen.styles/Header.less
View file

@ -37,17 +37,7 @@
/*
* ease(x) := 1 - pow(1 - x, 2);
*/
background-image: linear-gradient(to bottom,
~"rgba(var(--background-color-dp-00-rgb),1)" 0%,
~"rgba(var(--background-color-dp-00-rgb),0.988)" 11.11%,
~"rgba(var(--background-color-dp-00-rgb),0.951)" 22.22%,
~"rgba(var(--background-color-dp-00-rgb),0.889)" 33.33%,
~"rgba(var(--background-color-dp-00-rgb),0.802)" 44.44%,
~"rgba(var(--background-color-dp-00-rgb),0.691)" 55.56%,
~"rgba(var(--background-color-dp-00-rgb),0.556)" 66.67%,
~"rgba(var(--background-color-dp-00-rgb),0.395)" 77.78%,
~"rgba(var(--background-color-dp-00-rgb),0.210)" 88.89%,
~"rgba(var(--background-color-dp-00-rgb),0)" 100%);
background-image: linear-gradient( to bottom, ~'rgba( var( --background-color-dp-00--rgb ), 1 )' 0%, ~'rgba( var( --background-color-dp-00--rgb ), 0.988 )' 11.11%, ~'rgba( var( --background-color-dp-00--rgb ), 0.951 )' 22.22%, ~'rgba( var( --background-color-dp-00--rgb ), 0.889 )' 33.33%, ~'rgba( var( --background-color-dp-00--rgb ), 0.802 )' 44.44%, ~'rgba( var( --background-color-dp-00--rgb ), 0.691 )' 55.56%, ~'rgba( var( --background-color-dp-00--rgb ), 0.556 )' 66.67%, ~'rgba( var( --background-color-dp-00--rgb ), 0.395 )' 77.78%, ~'rgba( var( --background-color-dp-00--rgb ), 0.210 )' 88.89%, ~'rgba( var( --background-color-dp-00--rgb ), 0 )' 100% );
content: '';
}
}

14
resources/skins.citizen.styles/common/rootvariables.less
View file

@ -10,7 +10,6 @@
*/
:root {
/* Background Colors */
--background-color-dp-00-rgb: red(@background-color-dp-00), green(@background-color-dp-00), blue(@background-color-dp-00);
--background-color-dp-00: @background-color-dp-00;
--background-color-dp-01: @background-color-dp-01;
--background-color-dp-02: @background-color-dp-02;
@ -82,12 +81,16 @@ html {
--padding-page: @padding-page;
}
.mw-header {
// Used for header gradient only
--background-color-dp-00--rgb: @background-color-dp-00--rgb;
}
/**
* Dark theme
*/
:root.skin-citizen-dark {
/* Background Colors */
--background-color-dp-00-rgb: red(@dark-background-color-dp-00), green(@dark-background-color-dp-00), blue(@dark-background-color-dp-00);
--background-color-dp-00: @dark-background-color-dp-00;
--background-color-dp-01: @dark-background-color-dp-01;
--background-color-dp-02: @dark-background-color-dp-02;
@ -132,3 +135,10 @@ html {
--border-color-input: @dark-border-color-input;
--border-color-input--hover: @dark-border-color-input--hover;
}
.skin-citizen-dark {
.mw-header {
// Used for header gradient only
--background-color-dp-00--rgb: @dark-background-color-dp-00--rgb;
}
}

4
resources/variables.less
View file

@ -73,6 +73,7 @@
/* Background Colors */
@background-color-dp-00: @color-base100;
@background-color-dp-00--rgb: red(@background-color-dp-00), green(@background-color-dp-00), blue(@background-color-dp-00);
@background-color-dp-01: @color-base100;
@background-color-dp-02: @color-base100;
@background-color-dp-03: @color-base100;
@ -164,6 +165,7 @@
/* Background Colors */
@dark-background-color-dp-00: @dark-color-base0;
@dark-background-color-dp-00--rgb: red(@dark-background-color-dp-00), green(@dark-background-color-dp-00), blue(@dark-background-color-dp-00);
@dark-background-color-dp-01: @dark-color-base10;
@dark-background-color-dp-02: @dark-color-base20;
@dark-background-color-dp-03: @dark-color-base30;
@ -174,7 +176,7 @@
@dark-background-color-dp-16: @dark-color-base80;
@dark-background-color-dp-24: @dark-color-base90;
@dark-background-color-overlay: rgba( 19, 26, 33, 0.95 ); //base0 95% opacity
@dark-background-color-overlay: rgba( 19, 26, 33, 0.95 ); //base0 95% opacity
@dark-background-color-framed: @dark-color-base10;
@dark-background-color-framed--hover: @dark-color-base30;