Skip to content

Instantly share code, notes, and snippets.

@RussellBishop
Last active December 30, 2019 20:46
Show Gist options
  • Star 8 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save RussellBishop/f5b14ab213c6ecb35cc6ba9b3ec3071a to your computer and use it in GitHub Desktop.
Save RussellBishop/f5b14ab213c6ecb35cc6ba9b3ec3071a to your computer and use it in GitHub Desktop.
Container Units CSS - SCSS Functions
@function columns($i) {
@return calc(#{$i} * var(--column-unit));
}
@function gutters($i) {
@return calc(#{$i} * var(--gutter-unit));
}
@function column-spans($i) {
@return calc(#{$i} * var(--column-and-gutter-unit) - var(--gutter-unit));
}
@function gutter-spans($i) {
@return calc(#{$i} * var(--column-and-gutter-unit) - var(--column-unit));
}
@function mix-units($columns, $gutters: $columns) {
@return calc((#{$columns} * var(--column-unit)) + (#{$gutters} * var(--gutter-unit)));
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment