main
km0 1 year ago
parent 2be51ff47d
commit d73a23830f

@ -1,112 +1,120 @@
* {
box-sizing: border-box;
box-sizing: border-box;
}
html, body {
margin: 0;
font-size: 24px;
font-family: serif;
html,
body {
margin: 0;
font-size: 24px;
font-family: serif;
}
header {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 64px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 64px;
}
.last-update {
text-transform: lowercase;
font-family: sans-serif;
font-size: 0.75rem;
margin: 1em;
color: #aaa;
text-transform: lowercase;
font-family: sans-serif;
font-size: 0.75rem;
margin: 1em;
color: #aaa;
}
.chapter {
max-width: 80ch;
margin-inline: auto;
padding-inline: 32px;
max-width: 80ch;
margin-inline: auto;
padding-inline: 32px;
}
.chapter img {
max-width: 100%;
object-fit: contain;
}
.chapter + .chapter {
margin-top: 256px;
margin-top: 256px;
}
h1, h2, h3 {
font-family: sans-serif;
margin: 2em auto;
h1,
h2,
h3 {
font-family: sans-serif;
margin: 2em auto;
}
h2 {
color: white;
background-color: black;
width: fit-content;
margin: 128px auto;
text-align: center;
color: white;
background-color: black;
width: fit-content;
margin: 128px auto;
text-align: center;
}
a {
color: tomato;
text-decoration: none;
color: tomato;
text-decoration: none;
}
pre, code {
white-space: pre-wrap;
pre,
code {
white-space: pre-wrap;
}
.language-note,
.language-todo {
margin: 32px auto;
font-family: sans-serif;
display: inline-block;
width: auto;
padding: 1ch;
color: #aaa;
border: 1px solid #aaa;
position: relative;
white-space: pre-wrap;
margin: 32px auto;
font-family: sans-serif;
display: inline-block;
width: auto;
padding: 1ch;
color: #aaa;
border: 1px solid #aaa;
position: relative;
white-space: pre-wrap;
}
.language-note:before,
.language-todo:before {
padding: 0.1ch;
position: absolute;
top: 0;
translate: calc(-1ch + -1px) -100%;
display: inline-block;
background-color: #aaa;
color: white;
padding: 0.1ch;
position: absolute;
top: 0;
translate: calc(-1ch + -1px) -100%;
display: inline-block;
background-color: #aaa;
color: white;
}
.language-note:before {
content: 'Note'
content: "Note";
}
.language-todo:before {
content: 'TO DO'
content: "TO DO";
}
.language-placeholder {
position: relative;
margin: 48px auto;
display: flex;
flex-direction: column;
border: 1px dashed currentColor;
justify-content: center;
align-items: center;
padding: 32px 32px;
border-radius: 50%;
font-family: sans-serif;
text-align: center;
position: relative;
margin: 48px auto;
display: flex;
flex-direction: column;
border: 1px dashed currentColor;
justify-content: center;
align-items: center;
padding: 32px 32px;
border-radius: 50%;
font-family: sans-serif;
text-align: center;
}
.language-placeholder:before {
content: "placeholder";
text-transform: uppercase;
font-size: 0.8rem;
content: "placeholder";
text-transform: uppercase;
font-size: 0.8rem;
color: #aaa;
color: #aaa;
}

Loading…
Cancel
Save