@ -1,3 +1,101 @@ | |||
@import | |||
'functions/units', | |||
'functions/zIndex'; | |||
/** | |||
* functions | |||
* | |||
* | |||
* | |||
* | |||
* @author Björn Hase | |||
* @license http://opensource.org/licenses/MIT The MIT License | |||
* @link https://gitlab.tentakelfabrik.de/tentakelfabrik/crispy | |||
* | |||
*/ | |||
/** | |||
* px to em, wrapper of toRelatives | |||
* | |||
* @param {mixed} $values | |||
* @param {mixed} $base | |||
* @return {rem} | |||
*/ | |||
@function toEm($values, $base: $crispy__font-size) { | |||
@return toRelatives($values, 1em, $base); | |||
} | |||
/** | |||
* px to rem, wrapper of toRelatives | |||
* | |||
* @param {mixed} $values | |||
* @param {mixed} $base | |||
* @return {rem} | |||
*/ | |||
@function toRem($values, $base: $crispy__font-size) { | |||
@return toRelatives($values, 1rem, $base); | |||
} | |||
/** | |||
* values to relative | |||
* | |||
* @param {mixed} $values | |||
* @param {mixed} $unit | |||
* @param {mixed} $base | |||
* @return {number} | |||
*/ | |||
@function toRelatives($values, $unit, $base: $crispy__font-size) { | |||
$results: 0; | |||
@if type-of($values) == 'number' { | |||
$results: toRelative($values, $base) * $unit; | |||
} @else { | |||
$results: (); | |||
@each $value in $values { | |||
@if $value == 0 { | |||
$results: append($results, $value); | |||
} | |||
@else { | |||
$results: append($results, toRelative($value, $base) * $unit); | |||
} | |||
} | |||
} | |||
@return $results; | |||
} | |||
/** | |||
* to relative | |||
* | |||
* @param {mixed} $value | |||
* @param {mixed} $base | |||
* @return {number} | |||
*/ | |||
@function toRelative($value, $base: $crispy__font-size) { | |||
@return stripUnit($value) / stripUnit($base); | |||
} | |||
/** | |||
* strip unit from value | |||
* | |||
* @param {mixed} $value | |||
* @return {number} | |||
*/ | |||
@function stripUnit($value) { | |||
@return $value / ($value * 0 + 1); | |||
} | |||
/** | |||
* function: z-index | |||
* | |||
* uses map $crispy__z-index to get value by key | |||
* | |||
* @author Björn Hase | |||
* | |||
*/ | |||
@function zIndex($name) { | |||
@if map-has-key($crispy__z-index, $name) { | |||
@return map-get($crispy__z-index, $name); | |||
} @else { | |||
@warn 'There is no item "#{$name}" in this list; choose one of: #{$crispy__z-index}'; | |||
@return null; | |||
} | |||
} |
@ -1,7 +0,0 @@ | |||
@import | |||
'helpers/float', | |||
'helpers/spacing', | |||
'helpers/media', | |||
'helpers/text', | |||
'helpers/visibility', | |||
'helpers/width'; |
@ -1,7 +1,16 @@ | |||
@import | |||
'functions', | |||
'variables', | |||
'components/button', | |||
'helpers/float', | |||
'helpers/spacing', | |||
'helpers/media', | |||
'helpers/text', | |||
'helpers/visibility', | |||
'helpers/width', | |||
'mixins', | |||
'config', | |||
'core', | |||
'components', | |||
'helpers'; | |||
'mixins/media-queries'; |
@ -1,39 +0,0 @@ | |||
/** | |||
* fonts | |||
* | |||
* | |||
* @author Björn Hase | |||
* | |||
*/ | |||
/** | |||
* add font-size in px as fallback and in rem | |||
* | |||
* | |||
* @param {px} $font-size | |||
* | |||
*/ | |||
@mixin crispy__font-size($font-size) { | |||
font-size: $font-size; | |||
font-size: toRem($font-size); | |||
} | |||
/** | |||
* add font-sizes as modifactors | |||
* | |||
* | |||
* @param {map} $font-sizes | |||
* | |||
*/ | |||
@mixin crispy__font-sizes($font-sizes) { | |||
@each $name, $font-size in $font-sizes { | |||
@if ($name == 'default') { | |||
@include font-size($font-size); | |||
} @else { | |||
&--#{$name} { | |||
@include font-size($font-size); | |||
} | |||
} | |||
} | |||
} |
@ -1,69 +0,0 @@ | |||
/** | |||
* media-queries | |||
* | |||
* | |||
* @author Björn Hase | |||
* | |||
*/ | |||
@mixin crispy__media-xs() { | |||
@media only screen and (min-width:$crispy__xs) { | |||
@content; | |||
} | |||
} | |||
@mixin crispy__media-sm() { | |||
@media only screen and (min-width: $crispy__sm) { | |||
@content; | |||
} | |||
} | |||
@mixin crispy__media-md() { | |||
@media only screen and (min-width: $crispy__md) { | |||
@content; | |||
} | |||
} | |||
@mixin crispy__media-lg() { | |||
@media only screen and (min-width: $crispy__lg) { | |||
@content; | |||
} | |||
} | |||
@mixin crispy__media-xlg() { | |||
@media only screen and (min-width: $crispy__xlg) { | |||
@content; | |||
} | |||
} | |||
// only | |||
@mixin crispy__media-xs-only() { | |||
@media only screen and (min-width: $crispy__xs) and (max-width: $crispy__sm - 1) { | |||
@content; | |||
} | |||
} | |||
@mixin crispy__media-sm-only() { | |||
@media only screen and (min-width: $crispy__sm) and (max-width: $crispy__md - 1) { | |||
@content; | |||
} | |||
} | |||
@mixin crispy__media-md-only() { | |||
@media only screen and (min-width: $crispy__md) and (max-width: $crispy__lg - 1) { | |||
@content; | |||
} | |||
} | |||
@mixin crispy__media-lg-only() { | |||
@media only screen and (min-width: $crispy__lg) and (max-width: $crispy__xlg - 1) { | |||
@content; | |||
} | |||
} | |||
@mixin crispy__media-xlg-only() { | |||
@media only screen and (min-width: $crispy__xlg) { | |||
@content; | |||
} | |||
} |