Update wiki styling

master
Hektor Misplon 2021-08-23 17:10:04 +02:00
parent f3f4fd1ef7
commit 54266a5d59
1 changed files with 119 additions and 13 deletions

View File

@ -1,3 +1,9 @@
@font-face {
font-family: Inter;
src: /* font might be installed locally */ local('Inter');
/* TODO: fallback to url imports */
}
*,
*:before,
*:after {
@ -9,12 +15,12 @@ body {
flex-direction: column;
color: #ccc;
background: #111;
font-family: 'Inter', serif;
font-size: 14px;
line-height: 1.4;
padding: 1.6rem;
font-family: Inter, serif;
font-size: 1rem;
line-height: 1.5;
padding: 3.2rem;
margin: 0 auto;
max-width: 32rem;
max-width: 48rem;
}
a {
@ -28,6 +34,7 @@ h4,
h5,
h6 {
font-weight: normal;
margin-top: 1.6rem;
}
h1 {
@ -46,24 +53,67 @@ h4 {
font-size: 16px;
}
th {
padding: 0.4rem 0;
text-align: left;
p {
margin: 0.4rem 0;
max-width: 32rem;
}
p + h1,
p + h2,
p + h3,
p + h4 {
margin-top: 1.6rem;
}
h1 + p,
h1 + ul,
h1 + ol {
margin-top: 1.2rem;
}
h2 + p,
h2 + ul,
h2 + ol {
margin-top: 0.8rem;
}
h3 + p,
h3 + ul,
h3 + ol {
margin-top: 0.4rem;
}
h4 + p,
h4 + ul,
h4 + ol {
margin-top: 0.4rem;
}
p + p {
margin-top: 0.8rem;
}
td {
padding: 0.4rem 0;
}
th {
padding: 0.4rem 0;
text-align: left;
}
ul,
ol {
list-style-position: outside;
padding: 0;
margin: 0;
margin-bottom: 0.8rem;
}
ul ul,
ol ol {
ol ol,
ul ol,
ol ul {
padding-left: 0.8rem;
}
@ -71,6 +121,11 @@ img {
max-width: 100%;
}
figure > img {
filter: hue-rotate(180deg) invert(1);
mix-blend-mode: screen;
}
/* Minimal scrollbars */
::-webkit-scrollbar {
width: 0.2rem;
@ -86,16 +141,67 @@ hr {
margin: 0.8rem 0;
}
p {
max-width: 32rem;
}
figcaption {
text-align: right;
font-size: 10px;
font-style: italic;
}
/* Tables */
table {
border-collapse: collapse;
min-width: 16rem;
margin: 0.8rem 0;
}
th,
td {
padding: 0.8rem;
padding-left: 0.2rem;
}
th {
border-bottom: 1px solid #222;
}
/* Footnotes */
.footnote-ref {
color: #888;
font-size: 0.8rem;
}
/* References and citations */
.citation {
font-size: 0.8rem;
color: #555;
transition: 0.15s cubic-bezier(0.19, 1, 0.22, 1);
}
.references {
color: #555;
border-top: 1px solid #222;
padding: 1.6rem;
margin: 1.6rem 0;
transition: 0.15s cubic-bezier(0.19, 1, 0.22, 1);
}
.citation:hover,
.references:hover {
color: #888;
}
.list-grid {
display: flex;
flex-wrap: wrap;
}
.list-grid > ul,
.list-grid > ol {
flex: 1 0 16rem;
padding: 1.6rem 0;
border-top: 1px solid #222;
list-style: none;
}