2022-04-10 16:52:13 +00:00
|
|
|
$light-bg: #ddcf99;
|
|
|
|
$light-bg-alt: #4e5463;
|
|
|
|
$light-fg: #202020;
|
|
|
|
$light-ln: #4e5463;
|
2022-04-10 14:55:46 +00:00
|
|
|
|
2022-04-10 16:52:13 +00:00
|
|
|
$dark-bg: #4b3d44;
|
|
|
|
$dark-bg-alt: #bd97a9;
|
|
|
|
$dark-fg: #e6d0c4;
|
|
|
|
$dark-ln: #bd97a9;
|
2022-04-11 17:22:28 +00:00
|
|
|
|
2022-04-11 20:44:06 +00:00
|
|
|
$transition-time: 1s;
|
2022-04-09 19:42:12 +00:00
|
|
|
|
2022-04-09 16:00:33 +00:00
|
|
|
body {
|
2022-04-09 21:45:40 +00:00
|
|
|
&.light {
|
|
|
|
background-color: $light-bg;
|
|
|
|
color: $light-fg;
|
|
|
|
}
|
|
|
|
background-color: $dark-bg;
|
|
|
|
color: $dark-fg;
|
2022-04-10 16:52:13 +00:00
|
|
|
transition: $transition-time;
|
2022-04-09 21:45:40 +00:00
|
|
|
}
|
|
|
|
|
2022-04-09 16:00:33 +00:00
|
|
|
a {
|
2022-04-09 21:45:40 +00:00
|
|
|
&.light {
|
|
|
|
background-color: $light-ln;
|
|
|
|
color: $light-bg;
|
|
|
|
}
|
|
|
|
background-color: $dark-ln;
|
|
|
|
color: $dark-bg;
|
2022-04-10 16:52:13 +00:00
|
|
|
transition: $transition-time;
|
2022-04-09 16:00:33 +00:00
|
|
|
}
|
|
|
|
|
2022-04-11 20:44:06 +00:00
|
|
|
a.footer-nav-item.active,
|
|
|
|
a.footer-nav-item:hover{
|
2022-04-09 21:45:40 +00:00
|
|
|
&.light {
|
2022-04-11 20:44:06 +00:00
|
|
|
color: $light-bg-alt;
|
|
|
|
background-color: $light-bg;
|
|
|
|
border-color: $light-bg;
|
2022-04-09 21:45:40 +00:00
|
|
|
}
|
2022-04-11 20:44:06 +00:00
|
|
|
color: $dark-bg-alt;
|
|
|
|
background-color: $dark-bg;
|
|
|
|
border-color: $dark-bg;
|
|
|
|
transition: 0.24s;
|
2022-04-09 16:00:33 +00:00
|
|
|
}
|
|
|
|
|
2022-04-09 21:45:40 +00:00
|
|
|
footer {
|
|
|
|
&.light {
|
|
|
|
background-color: $light-bg-alt;
|
|
|
|
color: $light-bg;
|
|
|
|
}
|
|
|
|
background-color: $dark-bg-alt;
|
|
|
|
color: $dark-bg;
|
2022-04-10 16:52:13 +00:00
|
|
|
transition: $transition-time;
|
2022-04-09 21:45:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
footer a {
|
2022-04-10 14:55:46 +00:00
|
|
|
&.light {
|
|
|
|
color: $light-bg;
|
|
|
|
background-color: $light-bg-alt;
|
|
|
|
}
|
|
|
|
color: $dark-bg;
|
|
|
|
background-color: $dark-bg-alt;
|
2022-04-10 16:52:13 +00:00
|
|
|
transition: $transition-time;
|
2022-04-10 14:55:46 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
.togglelabel {
|
|
|
|
&.light {
|
2022-04-11 20:44:06 +00:00
|
|
|
background-color: $light-bg-alt;
|
|
|
|
border-color: $light-bg;
|
2022-04-10 14:55:46 +00:00
|
|
|
}
|
2022-04-11 20:44:06 +00:00
|
|
|
background-color: $dark-bg-alt;
|
|
|
|
border-color: $dark-bg;
|
2022-04-10 16:52:13 +00:00
|
|
|
transition: $transition-time;
|
2022-04-10 14:55:46 +00:00
|
|
|
}
|
|
|
|
|
2022-04-10 16:52:13 +00:00
|
|
|
.togglelabel.light::after {
|
2022-04-11 20:44:06 +00:00
|
|
|
background-color: $light-bg;
|
|
|
|
color: $light-bg-alt;
|
|
|
|
transition: $transition-time;
|
2022-04-10 14:55:46 +00:00
|
|
|
}
|
|
|
|
|
2022-04-10 16:52:13 +00:00
|
|
|
.togglelabel::after {
|
2022-04-11 20:44:06 +00:00
|
|
|
background-color: $dark-bg;
|
|
|
|
color: $dark-bg-alt;
|
|
|
|
transition: $transition-time;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
body.light #title {
|
|
|
|
color: $light-bg;
|
|
|
|
background-color: $light-bg-alt;
|
|
|
|
transition: $transition-time;
|
|
|
|
}
|
|
|
|
|
|
|
|
body #title{
|
2022-04-10 14:55:46 +00:00
|
|
|
color: $dark-bg;
|
2022-04-11 20:44:06 +00:00
|
|
|
background-color: $dark-bg-alt;
|
2022-04-10 16:52:13 +00:00
|
|
|
transition: $transition-time;
|
2022-04-09 16:00:33 +00:00
|
|
|
}
|
2022-04-11 17:22:28 +00:00
|
|
|
|
2022-04-11 20:44:06 +00:00
|
|
|
article {
|
|
|
|
&.light {
|
|
|
|
background-color: $light-bg;
|
|
|
|
border-color: $light-bg-alt;
|
2022-04-11 17:22:28 +00:00
|
|
|
}
|
2022-04-11 20:44:06 +00:00
|
|
|
background-color: $dark-bg;
|
|
|
|
border-color: $dark-bg-alt;
|
2022-04-11 17:22:28 +00:00
|
|
|
}
|