64 lines
1.8 KiB
SCSS
64 lines
1.8 KiB
SCSS
|
$base03: #002b36;
|
||
|
|
$base03: #002b36;
|
||
|
|
$base02: #073642;
|
||
|
|
$base01: #586e75;
|
||
|
|
$base00: #657b83;
|
||
|
|
$base0: #839496;
|
||
|
|
$base1: #93a1a1;
|
||
|
|
$base2: #eee8d5;
|
||
|
|
$base3: #fefbdc;
|
||
|
|
$yellow: #b58900;
|
||
|
|
$orange: #cb4b16;
|
||
|
|
$red: #dc322f;
|
||
|
|
$magenta: #d33682;
|
||
|
|
$violet: #6c71c4;
|
||
|
|
$blue: #268bd2;
|
||
|
|
$cyan: #2aa198;
|
||
|
|
$green: #859900;
|
||
|
|
|
||
|
|
@mixin rebase($rebase03,$rebase02,$rebase01,
|
||
|
|
$rebase00,$rebase0,$rebase1,$rebase2,$rebase3) {
|
||
|
|
* { color:$rebase0; }
|
||
|
|
body { background-color:$rebase03; }
|
||
|
|
h1,h2,h3,h4,h5,h6 { color:$rebase1; border-color: $rebase0; }
|
||
|
|
h1#pagetitle, h1:first-of-type { color: $rebase1; }
|
||
|
|
h2#pagesubtitle, h2:first-of-type { color: $rebase01; }
|
||
|
|
a, a:active, a:visited { color: $rebase1; }
|
||
|
|
//a:hover { background-color: $rebase02 }
|
||
|
|
header {
|
||
|
|
background-color: $rebase01;
|
||
|
|
color: $rebase1;
|
||
|
|
a.navlink, a:active.navlink, a:visited.navlink { color: $rebase1; }
|
||
|
|
a:hover.navlink { background: transparent; color: $rebase02; }
|
||
|
|
#sitelink { color: $rebase02; background-color: $rebase1 }
|
||
|
|
a:hover#sitelink { font-weight: bold; }
|
||
|
|
}
|
||
|
|
footer {
|
||
|
|
background-color: $rebase02;
|
||
|
|
color: $rebase01;
|
||
|
|
}
|
||
|
|
pre {
|
||
|
|
color: $rebase1;
|
||
|
|
background-color: $rebase02;
|
||
|
|
}
|
||
|
|
tr:nth-child(odd) { background-color:$rebase02 }
|
||
|
|
th { color:$rebase1; background-color:$rebase03; }
|
||
|
|
h1 a:hover {
|
||
|
|
-webkit-text-stroke: 3px $rebase02;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@mixin accentize($accent) {
|
||
|
|
a, a:active, a:visited, code.url { color: $accent; }
|
||
|
|
h1,h2,h3,h4,h5,h6 {color:$accent}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* light is default mode, so pair with general html definition */
|
||
|
|
html, .light { @include rebase($base3,$base2,$base1,$base0,$base00,$base01,$base02,$base03)}
|
||
|
|
.dark { @include rebase($base03,$base02,$base01,$base00,$base0,$base1,$base2,$base3)}
|
||
|
|
|
||
|
|
html * {
|
||
|
|
color-profile: sRGB;
|
||
|
|
rendering-intent: auto;
|
||
|
|
}
|