You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
82 lines
1.6 KiB
82 lines
1.6 KiB
/**
|
|
* Heading
|
|
*
|
|
*
|
|
* @author Björn Hase, Tentakelfabrik
|
|
* @license http://opensource.org/licenses/MIT The MIT License
|
|
* @link https://github.com/tentakelfabrik/crispy-css
|
|
*
|
|
*/
|
|
|
|
|
|
/**
|
|
* add font-size for heading as class and element
|
|
*
|
|
*
|
|
*/
|
|
@mixin heading-font-size($h, $font-size)
|
|
{
|
|
#{$h}, .#{$h} {
|
|
font-size: $font-size;
|
|
}
|
|
}
|
|
|
|
$heading__font-sizes: (
|
|
'h1': 2.5rem,
|
|
'h2': 2rem,
|
|
'h3': 1.75rem,
|
|
'h4': 1.5rem,
|
|
'h5': 1.25rem,
|
|
'h6': 1rem
|
|
) !default;
|
|
|
|
$heading__font-sizes-breakpoints: (
|
|
$grid__md: (
|
|
'h1': 2.75rem,
|
|
'h2': 2.5rem,
|
|
'h3': 2rem,
|
|
'h4': 1.75rem,
|
|
'h5': 1.5rem,
|
|
'h6': 1.2rem
|
|
)
|
|
) !default;
|
|
|
|
$heading__font-weight: bold!default;
|
|
$heading__font-family: $font-family !default;
|
|
|
|
$heading__line-height: 1.2 !default;
|
|
|
|
$heading__margin: $margin !default;
|
|
$heading__margin-breakpoints: margin-breakpoints !default;
|
|
|
|
h1, .h1,
|
|
h2, .h2,
|
|
h3, .h3,
|
|
h4, .h4,
|
|
h5, .h5,
|
|
h6, .h6 {
|
|
font-family: $heading__font-family;
|
|
font-weight: $heading__font-weight;
|
|
line-height: $heading__line-height;
|
|
|
|
margin: $heading__margin;
|
|
@include breakpoints('margin', $heading__margin-breakpoints);
|
|
|
|
&.highlight {
|
|
display: table;
|
|
}
|
|
}
|
|
|
|
// adding font-size for each
|
|
@each $h, $font-size in $heading__font-sizes {
|
|
@include heading-font-size($h, $font-size);
|
|
}
|
|
|
|
// adding breakpoints for each breakpoint and each heading
|
|
@each $breakpoint, $headings in $heading__font-sizes-breakpoints {
|
|
@media only screen and (min-width: $breakpoint) {
|
|
@each $h, $font-size in $headings {
|
|
@include heading-font-size($h, $font-size);
|
|
}
|
|
}
|
|
} |