8 - Sass Functions
Source: functions/__documentation.scss, line 5
It is possible to define your own functions in sass and use them in any value or script context
http://sass-lang.com/documentation/file.SASS_REFERENCE.html#function_directives
8.1 - em($size, $context: 16)
Source: functions/_em.scss, line 10
The em function converts px value into an em value. By default, the function uses the base 16px. This function is used to set the media queries with em value. Resources:
- https://css-tricks.com/em-based-media-queries-are-based-on/
- https://zellwk.com/blog/media-query-units/
Parameters:
$size- Size in px to be converted in em$context- Optional value. By default $context is equal to 16 as this function is mostly use for media queries
Usage:
em(400px);
Output:
25em;
8.2 - map-deep-get($map, $keys...)
Source: functions/_map-deep-get.scss, line 12
The map-deep-get function allows to get and set values from the nested tree. This function is used to set the media queries with em value.
Source:
- https://css-tricks.com/snippets/sass/deep-getset-maps/
Parameters:
$map- targeted map$keys- Keys to target
Usage:
map-deep-get($aspect-ratios, 1x1, width)