forked from mirror/_s
add font mixins
This commit is contained in:
parent
028fb126ce
commit
68d5abe11c
|
@ -1,50 +1,65 @@
|
||||||
@mixin font-1($weight) {
|
@mixin font-1($weight) {
|
||||||
// see functions.php->google_fonts()
|
// see functions.php->google_fonts()
|
||||||
// and functions.php->_s_scripts()
|
// and functions.php->_s_scripts()
|
||||||
font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI",
|
font-family:
|
||||||
Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
|
Montserrat,
|
||||||
@if $weight == regular {
|
-apple-system,
|
||||||
font-weight: 400;
|
BlinkMacSystemFont,
|
||||||
} @else if $weight == bold {
|
"Segoe UI",
|
||||||
font-weight: 600;
|
Roboto,
|
||||||
} @else if $weight == extra-bold {
|
Oxygen-Sans,
|
||||||
font-weight: 700;
|
Ubuntu,
|
||||||
} @else {
|
Cantarell,
|
||||||
@error "font-weight #{$weight} not in valid font-weights for font-1: 'Montserrat'.";
|
"Helvetica Neue",
|
||||||
}
|
sans-serif;
|
||||||
|
|
||||||
|
@if $weight == regular {
|
||||||
|
font-weight: 400;
|
||||||
|
} @else if $weight == bold {
|
||||||
|
font-weight: 600;
|
||||||
|
} @else if $weight == extra-bold {
|
||||||
|
font-weight: 700;
|
||||||
|
} @else {
|
||||||
|
|
||||||
|
@error "font-weight #{$weight} not in valid font-weights for font-1: 'Montserrat'.";
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin font-body($weight: regular) {
|
@mixin font-body($weight: regular) {
|
||||||
@include font-1($weight);
|
|
||||||
|
@include font-1($weight);
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin font-title($weight: regular) {
|
@mixin font-title($weight: regular) {
|
||||||
@include font-1($weight);
|
|
||||||
|
@include font-1($weight);
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin font-link($weight: regular) {
|
@mixin font-link($weight: regular) {
|
||||||
@include font-1($weight);
|
|
||||||
|
@include font-1($weight);
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin font-code($weight: regular) {
|
@mixin font-code($weight: regular) {
|
||||||
font-family: $font-code;
|
font-family: $font__code;
|
||||||
font-weight: $weight;
|
font-weight: $weight;
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin font-pre($weight: regular) {
|
@mixin font-pre($weight: regular) {
|
||||||
font-family: $font-pre;
|
font-family: $font__pre;
|
||||||
font-weight: $weight;
|
font-weight: $weight;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Center block
|
// Center block
|
||||||
@mixin center-block {
|
@mixin center-block {
|
||||||
display: block;
|
display: block;
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
margin-right: auto;
|
margin-right: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Column width with margin
|
// Column width with margin
|
||||||
@mixin column-width($numberColumns: 3) {
|
@mixin column-width($numberColumns: 3) {
|
||||||
width: map-get($columns, $numberColumns) -
|
width:
|
||||||
(($columns__margin * ($numberColumns - 1)) / $numberColumns);
|
map-get($columns, $numberColumns) -
|
||||||
|
(($columns__margin * ($numberColumns - 1)) / $numberColumns);
|
||||||
}
|
}
|
||||||
|
|
Reference in New Issue