Call us on 3117 2300
This contains the core functions needed for the Matter Kit, outside of the functions that bourbon provides.
Below is a list of functions that are standard across installs.
mk-get-media-query-size( $size )
Retrieve the requested size from the media query breakpoints map
ratio( $width, $height )
Calculate and return a ratio size in percentages
col( $span, $columns: $mk-grid-columns )
Include a grid column. Span denotes how many columns to span out of the total number. By default, the total number is the number of grid columns defined in the global grid partial, however this can be overridden to create grids within grids.
strip-unit( $number )
Remove the unit from a number. This allows us to add numbers together and then convert them to a different value. Care needs to be taken by the developer that they know what units they are removing, so the calculations will be correct.
calc-rem( $px-size )
Takes a pixel size and converts it to REM, based on the base font size.
calc-em( $px-size, $context-px-size: 16px )
Similar to calc-rem, it takes a pixel size and changes it to EM, using the assumed context size of 16px. This should be set contextually, because EMs scale relatively to their parent.
pow($number, $exp)
Power function, pulled from: https://unindented.org/articles/trigonometry-in-sass/
This allows us to create a typographic scale, based on a variable defined in the main typography parial.
calc-type-scale( $scale-position, $pixel-size: $mk-base-font-size, $scale: $mk-base-type-scale )
Calculate the requested position in the typographic scale, this allows us to simply call calc-type-scale( 1 ) to get the first size in the typographic scale based on our standard typographic declarations.