// This css basically from yue.css, and I have done some change for it.
.post {
font-weight: 400; line-height: 1.8rem; font-size: 1rem; color: $post-content-color;
}
.post h1, .post h2, .post h3, .post h4, .post h5, .post h6 {
color: $post-heading-color;
}
.post h1 {
font-size: 1.5em; margin: 1.3em 0; line-height: 1.1em;
}
.post > h1 {
margin-top: 0;
}
.post h2 {
font-size: 1.35em; margin: 0.83em 0;
}
.post h3 {
font-size: 1.15em; margin: 1em 0;
}
.post h4, .post h5, .post h6 {
font-size: 1em; margin: 1.6em 0 1em 0;
}
.post h6 {
font-weight: 500;
}
.post p {
margin-top: 0; margin-bottom: 1.46em;
}
.post a {
color: $post-link-color; word-wrap: break-word; text-decoration-color: rgba($post-link-color, .8);
}
.post a:hover {
color: $post-link-hover-color; text-decoration-color: rgba($post-link-hover-color, .6);
}
.post h1 a, .post h2 a, .post h3 a {
text-decoration: none;
}
.post strong, .post b {
font-weight: 700; color: $post-emphasis-color;
}
.post em, .post i {
font-style: italic; color: $post-emphasis-color;
}
.post img {
max-width: 100%; height: auto; margin: 0.2em 0;
}
.post figure {
position: relative; clear: both; outline: 0; margin: 10px 0 30px; padding: 0; min-height: 100px;
}
.post figure img {
display: block; max-width: 100%; margin: auto auto 4px; box-sizing: border-box;
}
.post figure figcaption {
position: relative; width: 100%; text-align: center; left: 0; margin-top: 10px; font-weight: 400; font-size: 14px; color: $post-figure-color;
}
.post figure figcaption a {
text-decoration: none; color: $post-figure-color;
}
.post hr {
display: block; width: 40%; margin: 60px auto 55px; border: 0 none; border-top: 1px solid $post-border-color;
}
.post blockquote {
margin: 0 0 1.64em 0; border-left: 3px solid $post-border-color; padding-left: 12px; color: $post-blockquote-color;
}
.post blockquote a {
color: $post-blockquote-color;
}
.post ul, .post ol {
margin: 0 0 24px 6px; padding-left: 16px;
}
.post ul {
list-style-type: square;
}
.post ol {
list-style-type: decimal;
}
.post li {
margin-bottom: 0.2em;
}
.post li ul, .post li ol {
margin-top: 0; margin-bottom: 0; margin-left: 14px;
}
.post li ul {
list-style-type: disc;
}
.post li ul ul {
list-style-type: circle;
}
.post li p {
margin: 0.4em 0 0.6em;
}
.post .unstyled {
list-style-type: none; margin: 0; padding: 0;
}
.post code, .post tt {
color: $post-block-color; background-color: $post-block-bg-color; font-size: 0.96em; padding: 1px 2px; border: 1px solid $post-border-color; border-radius: 3px; font-family: $monospaced-fonts; word-wrap: break-word;
}
.post pre {
margin: 1.64em 0; padding: 7px; border: none; border-left: 3px solid $post-border-color; padding-left: 10px; overflow: auto; line-height: 1.5; font-size: 0.96em; font-family: $monospaced-fonts; color: $post-block-color; background-color: $post-block-bg-color;
}
.post pre code, .post pre tt {
color: $post-block-color; border: none; background: none; padding: 0;
}
.post table {
width: 100%; max-width: 100%; border-collapse: collapse; border-spacing: 0; margin-bottom: 1.5em; font-size: 0.96em; box-sizing: border-box;
}
.post th, .post td {
text-align: left; padding: 4px 8px 4px 10px; border: 1px solid $post-border-color;
}
.post td {
vertical-align: top;
}
.post tr:nth-child(even) {
background-color: $post-block-bg-color;
}
.post iframe {
display: block; max-width: 100%; margin-bottom: 30px;
}
.post figure iframe {
margin: auto;
}
.post table pre {
margin: 0; padding: 0; border: none; background: none;
}
@media (min-width: 1100px) {
.post blockquote { padding-left: 20px; border-width: 4px; } .post blockquote blockquote { margin-left: 0; }
}