65 lines
1015 B
SCSS
65 lines
1015 B
SCSS
// ==========================================================================
|
|
// Base / Headings
|
|
// ==========================================================================
|
|
|
|
@mixin h {
|
|
margin-top: 0;
|
|
line-height: $line-height-h;
|
|
}
|
|
|
|
//
|
|
// Provide a generic class to apply common heading styles.
|
|
//
|
|
// @example
|
|
// <p class="u-h"></p>
|
|
//
|
|
//
|
|
.o-h {
|
|
@include h;
|
|
}
|
|
|
|
//
|
|
// Styles for headings 1 through 6 with classes to provide
|
|
// a double stranded heading hierarchy, e.g. we semantically
|
|
// need an H2, but we want it to be sized like an H1:
|
|
//
|
|
// @example
|
|
// <h2 class="o-h1"></h2>
|
|
//
|
|
//
|
|
h1, .o-h1 {
|
|
@extend .o-h;
|
|
|
|
font-size: rem($font-size-h1);
|
|
}
|
|
|
|
h2, .o-h2 {
|
|
@extend .o-h;
|
|
|
|
font-size: rem($font-size-h2);
|
|
}
|
|
|
|
h3, .o-h3 {
|
|
@extend .o-h;
|
|
|
|
font-size: rem($font-size-h3);
|
|
}
|
|
|
|
h4, .o-h4 {
|
|
@extend .o-h;
|
|
|
|
font-size: rem($font-size-h4);
|
|
}
|
|
|
|
h5, .o-h5 {
|
|
@extend .o-h;
|
|
|
|
font-size: rem($font-size-h5);
|
|
}
|
|
|
|
h6, .o-h6 {
|
|
@extend .o-h;
|
|
|
|
font-size: rem($font-size-h6);
|
|
}
|