// Takes a sizing from the $font-size map (m, xl, xxl, etc) and convert it to // the base unit. Alternatively convert a px font-size into the base unit. // // @param number|string $size // A size from the $font-size map or px value to be converted // @param number|string $context // (optional) Only used if em is the $base-unit. The value of the parent // font-size if it differs from $base-font-size. Specified as a t-shirt size or // value in px. // // @return number // The selected font-size in $base-unit. @function font-size($size, $context: $base-font-size) { $allowed-types: "font-size", "px"; $type: typey-validator($size, $allowed-types); @if $type == "font-size" { @return output-from-font-size-map($size, $context); } @if $type == "px" { @return output-from-px($size, $context); } } // Generate a value to be used as line-height from either: // a) a multiple of $base-line-height // b) a static px value // c) a ratio of the font-size // // Example usage with multiple: // line-height: line-height(2); // Example usage with static value: // line-height: line-height(18px); // Example usage with ratio: // line-height: line-height(1.5); // // @param number $x // Multiple of $base-line-height to be used, px value to be converted, or ratio of // font-size. // @param number|string $context // (optional) Only used if em is the $base-unit. The value of the // elements/parents font-size if it differs from $base-font-size. // Specified as a t-shirt size or value in px. // @return number // The calculated height in $base-unit. @function line-height($x, $context: $base-font-size) { $allowed-types: "multiplier", "px"; $type: typey-validator($x, $allowed-types); @if $type == "multiplier" { @if ($line-height-method == "ratio") { @return output-from-ratio($x); } @else { @return output-from-multiplier($x, $context); } } @if $type == "px" { @return output-from-px($x, $context); } } // Generate a value to be used as some form of height or spacing from either: // a) a multiple of $base-line-height // b) a static px value // // Example usage with multiple: // height: spacing(2); // Example usage with static value: // margin-bottom: spacing(18px); // // @param number $x // Multiple of $base-line-height to be used or px value to be converted. // @param number|string $context // (optional) Only used if em is the $base-unit. The value of the elements/parents // font-size if it differs from $base-font-size. Specified as a t-shirt size or // value in px. // // @return number // The calculated spacing in $base-unit. @function spacing($x, $context: $base-font-size) { $allowed-types: "multiplier", "px", "auto"; $type: typey-validator($x, $allowed-types); @if $type == "multiplier" { @return output-from-multiplier($x, $context); } @if $type == "px" { @return output-from-px($x, $context); } @if $type == "auto" { @return auto; } }