/* Headings */ %headings {
margin-top: 0; margin-bottom: .5rem; font-weight: $font-bold; line-height: 1.1; color: $color-gray-dark; font-family: $font-family-sans-serif;
} %headings-big {
margin-top: 1rem; margin-bottom: .75rem;
}
h1 {
@extend %headings; @extend %headings-big; font-size: 1.8rem;
} h2 {
@extend %headings; @extend %headings-big; font-size: 1.4rem;
} h3 {
@extend %headings; @extend %headings-big; font-size: 1.1rem;
} p + {
h1, h2, h3 { margin-top: 1.5rem; }
} ul + {
h1, h2, h3 { margin-top: 1.5rem; }
} ol + {
h1, h2, h3 { margin-top: 1.5rem; }
} article.post h2 {
margin-top: 2.2rem;
} article.post h3 {
margin-top: 1.5rem;
}
/* Lists and Table*/ ul, ol {
margin-top: 0; margin-bottom: 1.6rem; padding-left: 1.5em;
}
dl {
dt { font-weight: $font-bold; } &.horizontal-dl { dt { float: left; width: 10em; clear: left; overflow: hidden; text-align: right; text-overflow: ellipsis; white-space: nowrap; } dd { margin-left: 11em; } }
}
hr {
display: block; height: 1px; border: 0; border-top: 1px solid $color-gray-smoke; margin: 1em 0; padding: 0;
}
table {
margin-bottom: 1.6rem; border: 1px solid $color-gray-smoke; td, th { border-left: 1px solid $color-gray-smoke; border-top: 1px solid $color-gray-smoke; padding: .25em .75em; }
} /* Codes */ code, pre {
font-family: $font-family-monospace; font-size: 95%;
}
code {
padding: .15em .3em; font-style: normal; font-weight: normal; background-color: $color-semiwhite; @include border-radius(.15em);
} pre {
display: block; margin: 0 0 1rem; font-size: .875rem; line-height: 1.4; white-space: pre; white-space: pre-wrap; word-break: break-all; word-wrap: break-word; code { padding: 0; color: inherit; background-color: transparent; }
} .highlight {
margin-bottom: 1.6rem; @include border-radius(.15em); pre { margin-bottom: 0; font-size: .875rem; padding: 1rem 1.25rem; }
}
kbd {
background-color: $color-white; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#f0f0f0)); background-image: -webkit-linear-gradient(top, #ffffff, #f0f0f0); background-image: -moz-linear-gradient(top, #ffffff, #f0f0f0); background-image: -ms-linear-gradient(top, #ffffff, #f0f0f0); background-image: -o-linear-gradient(top, #ffffff, #f0f0f0); border-color: $color-whitekey; border-style: solid; border-width: 1px 1px 3px 1px; -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; font-size: 0.750em; padding: 2px 5px; text-shadow: 1px 1px #fff; text-transform: capitalize;
}
/* Blockquote */ blockquote {
padding: 0.5rem 1.5rem; margin: 0px 0px 1.5rem; border-left: .4rem solid $color-gray-milk; p { margin-bottom: 1rem; } footer { color: $color-gray-light; font-size: 85%; &:before { content: "\2014 \00A0"; } } p:last-child, ul:last-child, ol:last-child { margin-bottom: 0; }
}
.pullquote {
position: relative; border: none; color: $color-gray-light; text-align: center; margin-bottom: 1.6rem; p { font-size: $font-size-big; margin-bottom: 1rem; } cite { &:before { content: '—'; } } &:before { content: '\201C'; position: absolute; top: 0; left: 0; z-index: -9; color: $color-gray-milk; font-size: $font-size-blockquote-mark; line-height: 1; }
}
@media (min-width: 65em) {
.pullquote { &.pq-left, &.pq-right { display: block; max-width: 40%; padding-top: 0; font-style: italic; &:before { top: -1.5rem }; } &.pq-left { float: left; text-align: right; margin-left: -7em; } &.pq-right { float: right; text-align: left; margin-right: -7em; } &.pq-expand { margin-left: -5em; margin-right: -5em; &:before { font-size: 12rem; top: -0.5rem; } } }
}
/* Text formats */ small {
font-size: 75%;
}
/* Dialogue */ .dialogue {
margin-top: -0.6rem; li { list-style: none; font-style: italic; &:before { font-family: FontAwesome; content: '\f075'; color: $color-gray-light; font-style: normal; margin-right: 0.5em; } }
}