themes/kobel
themes/kobel
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

FIX theme toggle

Browse source
This commit is contained in:
Hoernschen 2024-01-06 20:44:35 +01:00
parent bfccca3b45
commit 553285c04b
Signed by: hoernschen
GPG key ID: 37591FAF4E6D3462
9 changed files with 111 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

59
assets/scss/index.scss
View file

@ -1,6 +1,35 @@
$font: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
$width: 680px;
$lightBg: white;
$lightText: black;
$darkBg: #383838;
$darkText: white;
:root {
color-scheme: light dark;
}
body {
background-color: $darkBg;
color: $darkText;
}
body.light {
background-color: $lightBg;
color: $lightText;
}
@media (prefers-color-scheme: light) {
body {
background-color: $lightBg;
color: $lightText;
}
body.dark {
background-color: $darkBg;
color: $darkText;
}
}
* {
box-sizing: border-box;
word-break: break-word;
@ -10,6 +39,11 @@ html {
scroll-behavior: smooth;
}
header, footer {
background-color: black;
color: white;
}
html, body {
height: 100%;
}
@ -18,7 +52,6 @@ body {
margin: 0;
display: flex;
flex-direction: column;
color: #333;
font-family: $font;
font-weight: 400;
font-style: normal;
@ -76,6 +109,10 @@ a {
float: left;
}
.rotate-45 {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);}
.rotate-90 {-webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg);}
.rotate-180 { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg);}
.row {
display: flex;
flex-wrap: wrap;
@ -195,7 +232,7 @@ a {
}
.section-even {
background-color: #eee;
// background-color: #eee;
}
.section-highlight {
@ -243,7 +280,7 @@ a {
border-bottom: 3px solid {{ .Site.Params.color.primary }};
}
.hero-content div {
.hero-content > div {
flex-grow: 1;
display: flex;
flex-direction: column;
@ -251,6 +288,21 @@ a {
padding-inline-start: 25px;
}
.hero-content .social {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.hero-content .social i {
font-size: x-large;
}
.hero-content .social a {
padding-inline: 6px;
color: {{ .Site.Params.color.primary }};
}
/* Buttons */
button {
@ -304,6 +356,5 @@ img {
border-radius: 50%;
border: 3px solid {{ .Site.Params.color.primary }};
object-fit: cover;
margin: 0 auto;
width: 150px;
}