1
0
mirror of https://github.com/Mikaela/cv.git synced 2024-11-29 03:59:27 +01:00
cv/assets/main.scss

122 lines
2.6 KiB
SCSS

---
# front-matter
---
@charset "utf-8";
// Our font definitions. I know system-ui is generally sans-serif, but I
// consider that lesser evil than not letting the client OS choose its
// preferred font.
$serif-font-family: ui-serif, system-ui, serif, "Noto Emoji",
"Noto Color Emoji", emoji;
$sans-serif-font-family: ui-sans-serif, system-ui, sans-serif, "Noto Emoji",
"Noto Color Emoji", emoji;
$monospace-font-family: ui-monospace, monospace, "Noto Emoji",
"Noto Color Emoji", emoji;
// Must be in the end under threat of undefined variable error.
$base-font-family: $sans-serif-font-family;
@import "{{ site.theme }}";
:root {
color-scheme: light dark !important;
}
* {
// box-sizing: border-box !important;
color: revert !important;
background-color: revert !important;
//margin: auto !important;
// line-height: 1.2 !important;
// A4 paper
//max-width: 210mm !important;
font-size: revert;
//padding: auto !important;
overflow-wrap: break-word !important;
hyphens: auto !important;
// Experimental trick to make all emojis text if supported.
font-variant-emoji: text;
/* WCAG minimum suggestions */
margin-bottom: 2 !important;
line-height: 1.5 !important;
letter-spacing: 0.12 !important;
word-spacing: 0.16 !important;
}
a {
text-decoration: underline !important;
}
a.site-title {
font-family: $serif-font-family;
}
// Monospace preferred for code
code,
pre {
font-family: $monospace-font-family !important;
}
// So it will not look bigger than normal text
code {
font-size: 0.8em !important;
}
// Sans-Serif for headings to constrast with aminda.eu
h2,
h3,
h4,
h5,
h6 {
font-family: $sans-serif-font-family !important;
}
h2.footer-heading {
font-family: $serif-font-family !important;
}
// The introduction on top
#bio {
text-align: center;
font-style: italic;
font-family: ui-cursive, $serif-font-family;
}
img {
border-radius: 50% !important;
display: block;
margin-left: auto !important;
margin-right: auto !important;
@media (min-width: 395px) {
display: float !important;
float: right !important;
}
}
ul.linklist {
list-style: none inside;
font-family: $monospace-font-family;
//font-variant: small-caps;
}
// Customize the dark theme to be more me
@media (prefers-color-scheme: dark) {
* {
color: #ffb700 !important;
border-color: #ffb700 !important;
background-color: #000000 !important;
}
.site-nav {
color-scheme: only dark !important;
color: #ffb700 !important;
background-color: #000000 !important;
color: #ffb700 !important;
}
// I don't want links to be restored to amber'
a {
color: revert !important;
}
}