68 lines
No EOL
1.2 KiB
CSS
68 lines
No EOL
1.2 KiB
CSS
@media (prefers-color-scheme: light) {
|
|
:root {
|
|
--bg: #e4e4e4;
|
|
--fg: #242424;
|
|
--link: #217b9c;
|
|
}
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
:root {
|
|
--bg: #0a0a0a;
|
|
--fg: #b4b4b4;
|
|
--link: #9fc2cf;
|
|
}
|
|
}
|
|
|
|
body {
|
|
background-color: var(--bg);
|
|
color: var(--fg);
|
|
font-family: 'JetBrains Mono', monospace, system-ui, sans-serif;
|
|
font-size: 1.125rem;
|
|
max-width: 55rem;
|
|
align-self: center;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
p, a, li {
|
|
font-size: 1.125rem;
|
|
margin-bottom: 2rem;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 2rem;
|
|
margin-top: 5rem;
|
|
|
|
transition: margin-top .2s;
|
|
}
|
|
|
|
p:last-child {
|
|
background-image: linear-gradient(to right, var(--fg) 15%, transparent 32%);
|
|
color: transparent;
|
|
background-clip: text;
|
|
white-space: nowrap;
|
|
margin-bottom: 10rem;
|
|
transition: margin-bottom .2s;
|
|
}
|
|
|
|
a {
|
|
color: var(--link);
|
|
}
|
|
|
|
@media screen and (max-width: 905px) {
|
|
body {
|
|
margin-left: .7rem !important;
|
|
margin-right: .7rem !important;
|
|
}
|
|
|
|
h1 {
|
|
margin-top: 1rem;
|
|
transition: margin-top .2s;
|
|
}
|
|
|
|
p:last-child {
|
|
margin-bottom: 1rem;
|
|
transition: margin-bottom .2s;
|
|
}
|
|
} |