h1, h2, h3, h4, h5, h6, .heading-lg, .heading-md, .heading-sm, .heading-xs {
margin-top: $headings-margin-top; margin-bottom: $headings-margin-bottom; color: var(--primary-color);
}
h1, .heading-xl { @include properties($heading-xl); }
h2, .heading-lg { @include properties($heading-lg); }
h3, .heading-md { @include properties($heading-md); }
h4, h5, h6, .heading-sm { @include properties($heading-sm); }
.body-lg { @include properties($body-lg); } .body-md { @include properties($body-md); } .body-sm { @include properties($body-sm); } .body-xs { @include properties($body-xs); }
.end {
text-align: end;
}
p {
margin-top: 0; margin-bottom: 1rem;
}
strong {
color: inherit; font-weight: 600;
}
ul, ol, dl {
list-style: none; margin-top: 0; margin-bottom: 1rem;
}
ol, ul {
padding-left: 1.25em;
}
ul li{
&:before { color: rgba(5,5,38,0.3); color: rgba(var(--rgb-primary), 0.3); padding-right: 0.4em; content: "•"; position: absolute; margin-top: -0.1em; margin-left: -0.85em; }
}
ol {
counter-reset: decimal-counter;
}
ol li{
&:before { color: rgba(5,5,38,0.3); color: rgba(var(--rgb-primary), 0.3); padding-right: 0.4em; content: counter(decimal-counter) "."; counter-increment: decimal-counter; position: absolute; margin-left: -1.15em; }
}
.unstyle-list{
padding-left: 0; li{ &:before { padding-right: 0; content: ""; display: none; } } ol li{ &:before { content: ""; display: none; } }
}
dt {
font-weight: bold;
}
dd {
margin-bottom: 0.5rem;
}
hr {
opacity: 0.085; border: 0; margin: 0; width: 100%; height: 1px; background-color: currentColor;
}
abbr {
font-size: 85%; font-weight: bold; color: #555; text-transform: uppercase; &[title] { cursor: help; border-bottom: 1px dotted rgba(var(--rgb-primary), 0.085); }
}
blockquote {
padding: 0.5rem 1rem; margin: 0.8rem 0; color: rgba(var(--rgb-primary), 0.7); border-left: 0.25rem solid rgba(var(--rgb-primary), 0.085); p:last-child { margin-bottom: 0; } @media (min-width: 30em) { padding-right: 5rem; padding-left: 1.25rem; }
}
// Markdown footnotes // // See the example content post for an example.
// Footnote number within body text a, // Back to footnote link a {
display: inline-block; margin-left: 0.1rem; font-weight: bold;
}
// List of footnotes .footnotes {
margin-top: 2rem; font-size: 85%;
}
.footnote-aside {
padding-left: .75rem; padding-right: .75rem; position: absolute; right: 0; width: 50%; -webkit-transform: translateX(100%); transform: translateX(100%); color: rgba(var(--rgb-primary), 0.6); @include media-breakpoint-down(md) { position: relative; width: 100%; text-align: center; -webkit-transform: none; transform: none; }
}
// Custom type // // Extend paragraphs with `.lead` for larger introductory text.
.lead {
font-size: 1.25rem; font-weight: 300;
}