// Posts and pages
figure {
margin-right: 0; margin-left: 0; margin-top: 1.5em; margin-bottom: 2em; & > :nth-last-child(2) { margin-bottom: 0; & > :last-child { margin-bottom: 0; } } figcaption { color: #878787; margin-top: 0.3em; font-size: 0.8em; text-align: center } &.screenshot { margin-left: 0; margin-right: 0; margin-top: 0; figcaption { margin-top: -1em; margin-right: 2em; margin-left: 2em; } } &.attributed-quote { margin-left: 0; margin-right: 0; figcaption { margin-top: 0.8em; margin-left: 4em; p { display: inline; } &::first-letter { margin-left: -2.5ex; } } }
}
@media screen and (max-width: 760px) {
figure { margin-left: 1em; margin-right: 1em; }
}
@media screen and (max-width: 500px) {
figure.screenshot figcaption { margin-top: 0; }
}
// End of alterations for captions.
.page, .post {
margin-bottom: 1em; li + li { margin-top: .25rem; }
}
// Blog post or page title .page-title, .post-title, .post-title a {
color: $body-color;
@media (prefers-color-scheme: dark) {
color: $body-color-dark; }
}
.page-title, .post-title {
margin-top: 0;
}
// Meta data line below post title .post-date {
display: block; margin-top: -.5rem; margin-bottom: 1rem; color: $body-color;
@media (prefers-color-scheme: dark) {
color: $body-color-dark; }
}
.permalink {
display: block; font-size: 90%; margin-top: -.9rem; margin-bottom: 1.5rem; color: $body-color;
@media (prefers-color-scheme: dark) {
color: $body-color-dark; }
}
.external-link {
display: block; font-size: 90%; margin-top: -.9rem; margin-bottom: 1.5rem; opacity: .5; color: $body-color;
@media (prefers-color-scheme: dark) {
color: $body-color-dark; }
}
.tag-list {
padding-top: 0px; padding-bottom: 4px; padding-right: 8px; border-radius: 5px; color: $body-color; @media (prefers-color-scheme: dark) { color: $code-dark; }
}
// Related posts .related {
padding-top: 2rem; padding-bottom: 2rem; margin-bottom: 2rem; border-top: 1px solid #d4d4d4; border-bottom: 1px solid #d4d4d4;
@media (prefers-color-scheme: dark) {
border-top: 1px solid #333333; border-bottom: 1px solid #333333; }
}
.PageNavigation {
font-size: 18px; display: block; width: auto; overflow: hidden;
}
.PageNavigation a {
display: inline; width: auto; float: left; margin: 1em 0;
}
.PageNavigation .next {
float: right; width: auto; text-align: right;
}
.related-posts {
padding-left: 0; list-style: none; h3 { margin-top: 0; } li { small { font-size: 75%; color: #999; } a:hover { color: $light; text-decoration: none; @media (prefers-color-scheme: dark) { color: $dark; } small { color: inherit; } } }
}