142 lines
1.9 KiB
CSS
142 lines
1.9 KiB
CSS
@font-face {
|
|
font-family: 'inconsolata';
|
|
src: url('/inconsolata-regular-webfont.woff2') format('woff2'),
|
|
url('/inconsolata-regular-webfont.woff') format('woff');
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
|
|
html {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
body {
|
|
color: #333;
|
|
background-color: #f2f4f4;
|
|
background-repeat: repeat;
|
|
}
|
|
|
|
a,
|
|
a:visited,
|
|
a:hover,
|
|
a:active {
|
|
color: rgb(62, 231, 123);
|
|
text-decoration: none;
|
|
}
|
|
a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.dim {
|
|
color: rgb(62, 231, 123, 0.5);
|
|
}
|
|
|
|
.mastodon {
|
|
display: none;
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
body {
|
|
color: rgb(50, 200, 100);
|
|
background-color: #010;
|
|
background-image: none;
|
|
}
|
|
|
|
a,
|
|
a:visited,
|
|
a:hover,
|
|
a:active {
|
|
color: rgb(62, 231, 123);
|
|
}
|
|
|
|
.dim {
|
|
color: rgb(62, 231, 123, 0.5);
|
|
}
|
|
}
|
|
|
|
@media (prefers-color-scheme: light) {
|
|
body {
|
|
color: #333;
|
|
background-color: #f2f4f4;
|
|
background-repeat: repeat;
|
|
}
|
|
|
|
a,
|
|
a:visited,
|
|
a:hover,
|
|
a:active {
|
|
color: #333;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.dim {
|
|
color: rgba(30, 30, 30, 0.5);
|
|
}
|
|
}
|
|
|
|
/* Manually toggled dark class on body */
|
|
body.dark {
|
|
color: rgb(50, 200, 100);
|
|
background-color: #010;
|
|
background-image: none;
|
|
}
|
|
.dark a,
|
|
.dark a:visited,
|
|
.dark a:hover,
|
|
.dark a:active {
|
|
color: rgb(62, 231, 123);
|
|
}
|
|
.dark .dim {
|
|
color: rgb(62, 231, 123, 0.5);
|
|
}
|
|
|
|
/* Manually toggled light class on body */
|
|
body.light {
|
|
color: #333;
|
|
background-color: #f2f4f4;
|
|
background-repeat: repeat;
|
|
}
|
|
|
|
.light a,
|
|
.light a:visited,
|
|
.light a:hover,
|
|
.light a:active {
|
|
color: #333;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.light .dim {
|
|
color: rgba(30, 30, 30, 0.5);
|
|
}
|
|
|
|
.page-wrapper {
|
|
text-align: center;
|
|
}
|
|
|
|
.inner-wrapper {
|
|
display: inline-block;
|
|
text-align: left;
|
|
white-space: pre;
|
|
font-family: 'inconsolata', monospace;
|
|
margin: 0 auto;
|
|
width: auto;
|
|
}
|
|
|
|
ol {
|
|
padding: 0;
|
|
line-height: 0.5em;
|
|
}
|
|
|
|
@media screen and (min-width: 700px) {
|
|
body, html {
|
|
font-size: 18px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 900px) {
|
|
body, html {
|
|
font-size: 24px;
|
|
}
|
|
}
|