2-mixins-and-functions edit

function-spacing  edit

outputs spacing

Spacing function
Uses kspace function to pull spaces from kspaces variable map
usage: kspace(sm)
Go to spacing variables and map

Height function for rows
uses height function to pull heights from variable map
usage: height(md)
Go to spacing variables and map



Copy
Edit
<!-- components/2-mixins-and-functions/function-spacing.php --> <p> <strong>Spacing function</strong><br> Uses kspace function to pull spaces from kspaces variable map <br> usage: <code>kspace(sm)</code> <br> <a href="../wm/atomic-core/?cat=3-variables#wm-spacing">Go to spacing variables and map</a> </p> <p> <strong>Height function for rows</strong><br> uses height function to pull heights from variable map <br> usage: <code>height(md)</code> <br> <a href="../wm/atomic-core/?cat=3-variables#wm-spacing">Go to spacing variables and map</a> </p> <br><br>
Copy
Copy
Edit
/* scss/2-mixins-and-functions/_function-spacing.scss */ //* -------------- KARLS SPACES FUNCTION // spaces map in _wm-spacing.scss // retrieve space from map with Sass ie. 'kspaces(md)' @function kspaces($space-name) { // single-level space, one deep @return #{map-get($kspaces, $space-name)}; } // retrieve height from map with Sass ie.'height(primary) $height-prefix: --height-; @function height($height-name, $height-variant: null, $true-val: false) { // if we need to return the height value //@if $true-val == true { // if height variant is specified @if ($height-variant != null) { // map inception, need two deep @return map-get(map-get($heights, $height-name), $height-variant); } @else { // single-level height, one deep @return map-get($heights, $height-name); } }