miti.sh/app.css

347 lines
4.7 KiB
CSS

a[href]:link {
color: #ff2a2a;
text-decoration: none;
}
a[href]:visited {
color: #cf4a4a;
}
a[href]:hover {
text-decoration: underline;
color: #ff7a7a;
}
a[href]:active {
color: #ff9595;
}
header a[href]:visited {
color: #ff2a2a;
}
.app-source-code-link {
font-size: smaller;
font-weight: normal;
margin-left: 0.5em;
float: right;
}
body {
font: 0.95em/1.692307em 'Bitter', Georgia, 'Times New Roman', Times, serif;
color: #24292e;
display: flex;
margin: 0 auto;
padding: 0;
flex-wrap: wrap;
max-width: 1160px;
flex-flow: column;
}
header {
padding: 0 1em;
text-align: center;
flex-grow: 1;
}
header > dl > dt > a[rel="author"] {
font-weight: bold;
font-size: x-large;
}
nav {
font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}
header > dl > dd {
font-family: Monaco, monospace, Courier, "Courier New";
margin: 0;
font-size: smaller;
}
header > dl {
margin-bottom: 3em;
}
nav > ul > li {
text-transform: uppercase;
}
main {
text-align: center;
flex-grow: 1;
padding: 0 1em;
}
/* Overrule pandoc style */
div.sourceCode {
margin: inherit;
}
main * {
text-align: left;
margin-left: auto;
margin-right: auto;
box-sizing: border-box;
}
main > div {
display: inline-block;
}
section, h2 {
max-width: 650px;
box-sizing: border-box;
}
section {
padding-bottom: 1em;
}
section + section {
padding-bottom: 1em;
}
section:first-child h3 {
margin-top: 0.83em;
}
section:last-child {
padding-bottom: 0;
}
section > h3 {
margin-top: 0;
margin-bottom: 0;
}
section + section > h3 {
margin-top: 1em;
}
section > time {
font-weight: bold;
font-size: smaller;
color: #98bf1f;
}
section p {
margin-top: 0.4em;
}
article > * {
max-width: 600px;
margin-left: auto;
margin-right: auto;
box-sizing: border-box;
}
article > time {
display: block;
text-align: center;
margin-bottom: 1.5em;
}
section > time, article > time {
font-family: sans-serif;
}
article > h2:first-child {
text-align: center;
}
article h2, article h3, article h4, article h5 {
margin-top: 2em;
}
.info {
border: 1px solid slategray;
border-radius: 8px;
padding: 0 1em;
background-color: #ddf0f0;
font-family: sans-serif;
color: darkslategray;
}
.info > p:first-child:before {
content: "ⓘ";
float: left;
font-size: xx-large;
color: slategray;
margin-right: 0.25em;
}
.warning {
border: 1px solid orange;
border-radius: 8px;
padding: 0 1em;
background-color: beige;
font-family: sans-serif;
color: darkslategray;
}
.warning > p:first-child:before {
content: "⚠";
float: left;
font-size: xx-large;
color: orange;
margin-right: 0.25em;
}
figure {
text-align: center;
}
figure img {
max-width: 100%;
}
figure figcaption {
text-align: center;
}
pre {
padding: 1em;
overflow: auto;
border-radius: 3px;
/* Dracula theme */
background: #282a36;
color: #f8f8f2;
}
:not(pre) > code {
background-color: rgb(230, 232, 245);
}
.code-filename-label, .filename-for-code-block > p {
font-weight: bold;
margin-bottom: 0;
}
.code-filename-label code, .filename-for-code-block code {
background-color: transparent;
}
.code-filename-label + pre,
.code-filename-label + div.sourceCode,
.filename-for-code-block + pre,
.filename-for-code-block + div.sourceCode {
margin-top: 0;
}
code {
font-size: 0.85em;
font-family: Monaco, monospace, Courier, "Courier New";
}
li p img {
float: left;
margin-bottom: 40px;
}
li, p {
clear: both;
}
address {
text-align: center;
font-style: normal;
}
blockquote {
border-left: 5px solid #ccc;
padding: 0.1em 0;
padding-left: 1em;
}
footer {
padding: 1em;
font-size: smaller;
font-family: sans-serif;
margin-top: 0;
white-space: nowrap;
color: lightgray;
}
footer ul, nav ul {
margin: 0;
padding-left: 1em;
list-style-type: none;
}
.read-post-link {
white-space: nowrap;
}
footer {
flex-basis: 100%;
text-align: center;
padding-top: 3em;
white-space: normal;
}
footer ul {
list-style: none;
margin-left: 0;
padding-left: 0;
}
footer li, footer ul {
display: inline;
}
footer li::after {
content: ", ";
}
footer li:last-child::after {
content: "";
}
nav ul {
list-style: none;
margin-left: 0;
padding-left: 0;
}
nav li, nav ul {
display: inline;
}
nav li + li {
margin-left: 0.25em;
}
.container {
white-space: normal;
}
header {
padding-bottom: 1em;
margin-bottom: 1em;
}
header > a[rel="author"] {
margin-top: 15px;
}
section:first-child h2 {
margin-top: 0;
}
address {
text-align: left;
}
header > dl {
margin-bottom: 1em;
line-height: 1.2em;
}
table > caption {
text-align: center;
font-weight: bold;
font-variant-caps: small-caps;
}