File: D:/HostingSpaces/SBogers10/ste.komma.pro/resources/sass/2-Tools/_tools.fonts.scss
/* ==========================================================================
* Font related functions
* ========================================================================== */
/**
* Mixin for setting font-size in REM through a Sass Map with all available sizes
USAGE:
.myClass {
@include font-size(xl);
}
*/
@mixin font-size($fs, $lh: null) {
// Get correct key with font-size and line-height px value
$font-size-properties: map-get($font-sizes, $fs);
@if $font-size-properties {
@include font-size(map-get($font-size-properties, font-size));
@if($lh == null){
line-height: map-get($font-size-properties, line-height) / map-get($font-size-properties, font-size);
} @else {
line-height: $lh / map-get($font-size-properties, font-size);
}
}
// When mapping isn't found calculate as if PX-value was given and return REM value
@else {
@if is-number($fs) {
font-size: valueToRem($fs);
@if($lh != null){
line-height: $lh / $fs;
}
}
@else {
@warn " `#{$fs}` is not a valid value. It must be one of the following: `#{$font-sizes}`";
}
}
}
/**
* Mixin for setting font-weight through a Sass Map with all available weights
USAGE:
.myClass {
@include font-weight(semiBold);
}
.myClass {
@include font-weight(medium);
}
*/
@mixin font-weight($weight) {
@if map-get($font-weights, $weight) {
@include font-weight(map-get($font-weights, $weight));
}
@else {
@if is-number($weight) {
font-weight: $weight;
}
@else {
@warn " `#{$weight}` is not a valid value. It must be one of the following: `#{$font-weights}`";
}
}
}
/**
* A simple function for accessing the font families from our mapping
USAGE:
span {
@include font-family(primary);
}
*/
@mixin font-family($family: 'base') {
@if map-has-key($font-families, $family) {
font-family: map-get($font-families, $family);
}
@else {
@warn "Unknown family: `#{$family}` in $font-families. ";
font-family: map-get($font-families, system);
}
}