118 lines
2.7 KiB
CSS
118 lines
2.7 KiB
CSS
body { font-family: sans-serif;
|
|
font-size: 15px;
|
|
line-height: 20px;
|
|
max-width: 50em;
|
|
hyphens: auto;
|
|
-webkit-hyphens: auto;
|
|
-moz-hyphens:auto;
|
|
-ms-hyphens:auto; }
|
|
|
|
h1, h2, h3, h4, h5, h6,
|
|
pre, code, blockquote, ol, ul,
|
|
ol ol, ul ul, ul ol, ol ul, li,
|
|
p, section, header, footer {
|
|
float: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
h1, h2, h3, h4, h5, h6,
|
|
pre, code, blockquote,
|
|
p, ul, ol, section, header, footer, .figure {
|
|
margin-top: 20px;
|
|
margin-bottom: 20px;
|
|
}
|
|
h1 { font-size: 1em; }
|
|
h2 { font-size: 1em; }
|
|
h3 { font-size: 1em; }
|
|
h4 { font-size: 1em; }
|
|
h5 { font-size: 1em; }
|
|
h6 { font-size: 1em; }
|
|
h1::before { content: "# "; opacity: 0.5; }
|
|
h2::before { content: "## "; opacity: 0.5; }
|
|
h3::before { content: "### "; opacity: 0.5; }
|
|
h4::before { content: "#### "; opacity: 0.5; }
|
|
h5::before { content: "##### "; opacity: 0.5; }
|
|
h6::before { content: "###### "; opacity: 0.5; }
|
|
p { margin: 0; padding: 0; }
|
|
hr {
|
|
position: relative;
|
|
height: 20px;
|
|
font-size: 0;
|
|
line-height: 0;
|
|
overflow: hidden;
|
|
border: 0;
|
|
margin-bottom: 20px;
|
|
}
|
|
hr:after {
|
|
content: "----------------------------------------------------------------------------------------------------";
|
|
font-family: monospace;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
font-size: 14px;
|
|
line-height: 20px;
|
|
width: 100%;
|
|
word-wrap: break-word;
|
|
}
|
|
blockquote { margin-left: 0; }
|
|
pre::after,pre::before { content: "~~~~~~"; display: block; font-size: 1.25em; opacity: 0.3; }
|
|
code {
|
|
font-family: "courrier new", monospace;
|
|
background: #f2f2f2;
|
|
}
|
|
pre code { background: none; }
|
|
blockquote {
|
|
position: relative;
|
|
padding-left: 17px;
|
|
padding-left: 2ch;
|
|
overflow: hidden;
|
|
}
|
|
blockquote:after {
|
|
content: ">\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>";
|
|
white-space: pre;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
font-size: 14px;
|
|
line-height: 20px;
|
|
opacity: 0.3;
|
|
}
|
|
|
|
li {
|
|
position: relative;
|
|
display: block;
|
|
padding-left: 18px;
|
|
}
|
|
li:after {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
ul > li:after {
|
|
content: "▪";
|
|
opacity: 0.2;
|
|
}
|
|
ol {
|
|
counter-reset: ol;
|
|
}
|
|
ol > li:after {
|
|
content: counter(ol) ".";
|
|
counter-increment: ol;
|
|
}
|
|
|
|
/* colors */
|
|
a, a:visited { color: #008AFF; }
|
|
a:active, a:hover, a:focus { color: #0085a1; }
|
|
|
|
h1 { color: #6c71c4;}
|
|
h2 { color: #d33682;}
|
|
h3 { color: #dc322f;}
|
|
h4 { color: #cb4b16;}
|
|
h5 { color: #b58900;}
|
|
h6 { color: #859900;}
|
|
|
|
img { max-width: 100%;
|
|
max-height: 800px;
|
|
margin: 20px auto; }
|