mixant de font-size responsive
This commit is contained in:
parent
7426519638
commit
2862bbff9c
6 changed files with 99 additions and 23 deletions
|
@ -1,3 +1,32 @@
|
|||
// font-size Mixin
|
||||
// compiles to font-size-s + font-size-base on small-plus devices
|
||||
// ex. h2 { @include font-size(h2);}
|
||||
$font-sizes: (
|
||||
base-size : $font-size-base,
|
||||
base-size-s: $font-size-s,
|
||||
h1-size : $h1-size,
|
||||
h1-size-s : $h1-size-s,
|
||||
h2-size : $h2-size,
|
||||
h2-size-s : $h2-size-s,
|
||||
h3-size : $h3-size,
|
||||
h3-size-s : $h3-size-s,
|
||||
h4-size : $h4-size,
|
||||
h4-size-s : $h4-size-s,
|
||||
h5-size : $h5-size,
|
||||
h5-size-s : $h5-size-s,
|
||||
h6-size : $h6-size,
|
||||
h6-size-s : $h6-size-s
|
||||
) !default;
|
||||
|
||||
@mixin font-size($elem) {
|
||||
$base-size: #{$elem}-size;
|
||||
$small-size: #{$elem}-size-s;
|
||||
font-size: map-get($font-sizes, $small-size);
|
||||
@include respond-to("small-up") {
|
||||
font-size: map-get($font-sizes, $base-size);
|
||||
}
|
||||
}
|
||||
|
||||
// Grid Mixin
|
||||
// arguments are : columns number, gutter, min-breakpoint
|
||||
// ex. .ingrid { @include grid(4, 1rem, 640px); }
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue