Permalink
Switch branches/tags
Nothing to show
Find file
Fetching contributors…
Cannot retrieve contributors at this time
40 lines (34 sloc) 3.16 KB
// This file can ONLY contain variables!! Do not add styles here!
// DEFAULT COLORS
@lightBase : #edede9;
@darkBase : #605959;
@highlight : #e1567a;
// COLORS
.monochromeBackground(@base, @variant) when (@variant = light-one){ background-color : lighten(spin(@base, 5), 10%); }
.monochromeBackground(@base, @variant) when (@variant = light-two){ background-color : lighten(spin(@base, 10), 20%); }
.monochromeBackground(@base, @variant) when (@variant = light-three){ background-color : lighten(spin(@base, 15), 30%); }
.monochromeBackground(@base, @variant) when (@variant = light-four){ background-color : lighten(spin(@base, 20), 40%); }
.monochromeBackground(@base, @variant) when (@variant = base){ background-color : @base; }
.monochromeBackground(@base, @variant) when (@variant = dark-one){ background-color : darken(spin(@base, -5), 10%); }
.monochromeBackground(@base, @variant) when (@variant = dark-two){ background-color : darken(spin(@base, -10), 20%); }
.monochromeBackground(@base, @variant) when (@variant = dark-three){ background-color : darken(spin(@base, -15), 30%); }
.monochromeBackground(@base, @variant) when (@variant = dark-four){ background-color : darken(spin(@base, -20), 40%); }
.monochromeForeground(@base, @variant) when (@variant = light-one){ color : lighten(spin(@base, 5), 10%); }
.monochromeForeground(@base, @variant) when (@variant = light-two){ color : lighten(spin(@base, 10), 20%); }
.monochromeForeground(@base, @variant) when (@variant = light-three){ color : lighten(spin(@base, 15), 30%); }
.monochromeForeground(@base, @variant) when (@variant = light-four){ color : lighten(spin(@base, 20), 40%); }
.monochromeForeground(@base, @variant) when (@variant = base){ color : @base; }
.monochromeForeground(@base, @variant) when (@variant = dark-one){ color : darken(spin(@base, -5), 10%); }
.monochromeForeground(@base, @variant) when (@variant = dark-two){ color : darken(spin(@base, -10), 20%); }
.monochromeForeground(@base, @variant) when (@variant = dark-three){ color : darken(spin(@base, -15), 30%); }
.monochromeForeground(@base, @variant) when (@variant = dark-four){ color : darken(spin(@base, -20), 40%); }
.complementaryBackground(@base, @variant) when (@variant = complement-one){ background-color : spin(@base, 180); }
.complementaryBackground(@base, @variant) when (@variant = complement-two){ background-color : darken(spin(@base, 180), 5%); }
.complementaryBackground(@base, @variant) when (@variant = base){ background-color : @base; }
.complementaryBackground(@base, @variant) when (@variant = light-one){ background-color : lighten(@base, 15%); }
.complementaryBackground(@base, @variant) when (@variant = light-two){ background-color : lighten(@base, 30%); }
.complementaryForeground(@base, @variant) when (@variant = complement-one){ color : spin(@base, 180); }
.complementaryForeground(@base, @variant) when (@variant = complement-two){ color : darken(spin(@base, 180), 5%); }
.complementaryForeground(@base, @variant) when (@variant = base){ color : @base; }
.complementaryForeground(@base, @variant) when (@variant = light-one){ color : lighten(@base, 15%); }
.complementaryForeground(@base, @variant) when (@variant = light-two){ color : lighten(@base, 30%); }