kevin/KevinK.dev.js
1
0
Fork 0
mirror of https://github.com/Unkn0wnCat/KevinK.dev.js.git synced 2025-06-06 12:42:01 +02:00
Code Issues Projects Releases Wiki Activity

Add light mode

Browse source
This commit is contained in:
Kevin Kandlbinder 2021-07-25 13:47:03 +00:00 • committed by GitHub
parent c0db0f2611
commit d9b538312a
9 changed files with 754 additions and 685 deletions
Download patch file Download diff file Expand all files Collapse all files

158
src/layouts/default.scss
View file

@ -1,73 +1,85 @@
@import "../variables";
* {
box-sizing: border-box;
}
body,
html,
#___gatsby,
#gatsby-focus-wrapper {
margin: 0;
padding: 0;
width: 100%;
min-height: 100vh;
font-family: $mainFont;
}
#gatsby-focus-wrapper {
background: $background;
color: $textColor;
display: flex;
flex-direction: column;
}
footer {
background: darken($background, 1);
width: 100%;
color: white;
padding: 5px;
text-align: center;
a {
color: white;
text-decoration: underline dotted currentColor;
}
}
#content {
flex-grow: 1;
display: flex;
flex-direction: column;
}
.flexSpacer {
flex-grow: 1;
text-align: center;
}
section > div:not(.profile),
section > article,
.section > div:not(.profile),
.section > article {
max-width: $layoutWidth;
width: 100%;
padding: 39px 20px;
margin: 0 auto;
}
article {
p {
text-align: justify;
}
a {
color: $accentColor;
text-decoration: underline dotted currentColor;
text-decoration-skip: none;
}
}
h1 {
font-size: 2em;
}
@import "../variables";
* {
box-sizing: border-box;
}
body,
html,
#___gatsby,
#gatsby-focus-wrapper {
margin: 0;
padding: 0;
width: 100%;
min-height: 100vh;
font-family: $mainFont;
}
#gatsby-focus-wrapper {
background: $background;
color: $textColor;
display: flex;
flex-direction: column;
transition: background-color .25s, color .25s;
@media(prefers-color-scheme: light) {
background: $lightBackground;
color: $lightTextColor;
}
}
footer {
background: darken($background, 1);
width: 100%;
color: white;
padding: 5px;
text-align: center;
transition: background-color .25s, color .25s;
@media(prefers-color-scheme: light) {
background: darken($lightBackground, 1);
color: $lightTextColor;
}
a {
color: inherit;
text-decoration: underline dotted currentColor;
}
}
#content {
flex-grow: 1;
display: flex;
flex-direction: column;
}
.flexSpacer {
flex-grow: 1;
text-align: center;
}
section > div:not(.profile),
section > article,
.section > div:not(.profile),
.section > article {
max-width: $layoutWidth;
width: 100%;
padding: 39px 20px;
margin: 0 auto;
}
article {
p {
text-align: justify;
}
a {
color: $accentColor;
text-decoration: underline dotted currentColor;
text-decoration-skip: none;
}
}
h1 {
font-size: 2em;
}