forked from tomasino/wobbly
borrowing cosmic stylesheet to start
This commit is contained in:
parent
09b5c7026c
commit
3116e70fb6
|
@ -4,6 +4,7 @@
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||||
<link rel='icon' href='data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>♊️</text></svg>'>
|
<link rel='icon' href='data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>♊️</text></svg>'>
|
||||||
|
<link rel="stylesheet" href="styles.css">
|
||||||
<style>
|
<style>
|
||||||
body { margin: 0; padding: 0 0 5em}
|
body { margin: 0; padding: 0 0 5em}
|
||||||
#wobbly-toolbar { background-color: #cccccc; width: 100%; position: fixed; top: 0; }
|
#wobbly-toolbar { background-color: #cccccc; width: 100%; position: fixed; top: 0; }
|
||||||
|
|
|
@ -0,0 +1,141 @@
|
||||||
|
@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;
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue