|
@ -1,10 +1,17 @@ |
|
|
|
|
|
/** |
|
|
|
|
|
* functions to convert px to em and rem |
|
|
|
|
|
* |
|
|
|
|
|
* |
|
|
|
|
|
* @author Björn Hase |
|
|
|
|
|
* |
|
|
|
|
|
*/ |
|
|
|
|
|
|
|
|
$base__font-size: 16px !default; |
|
|
$base__font-size: 16px !default; |
|
|
$base__line-height: 1.5 !default; |
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
|
* calculate pixel value to em |
|
|
* calculate pixel value to em |
|
|
* |
|
|
* |
|
|
* @param {px} $font-size |
|
|
|
|
|
|
|
|
* @param {px} $fontSize |
|
|
* @return {em} |
|
|
* @return {em} |
|
|
*/ |
|
|
*/ |
|
|
@function pxToEm($font-size) { |
|
|
@function pxToEm($font-size) { |
|
@ -14,32 +21,10 @@ $base__line-height: 1.5 !default; |
|
|
/** |
|
|
/** |
|
|
* calculate px value to rem |
|
|
* calculate px value to rem |
|
|
* |
|
|
* |
|
|
* @param {px} $px |
|
|
|
|
|
|
|
|
* @param {px} $fonz-size |
|
|
* @param {px} $font-size |
|
|
* @param {px} $font-size |
|
|
* @return {em} |
|
|
* @return {em} |
|
|
*/ |
|
|
*/ |
|
|
@function pxToRem($font-size) { |
|
|
@function pxToRem($font-size) { |
|
|
@return ($font-size / $base__font-size) * 1rem; |
|
|
@return ($font-size / $base__font-size) * 1rem; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
/** |
|
|
|
|
|
* calculate em value to rem |
|
|
|
|
|
* |
|
|
|
|
|
* @param {em} $value |
|
|
|
|
|
* @param {px} $font-size |
|
|
|
|
|
* @return {px} |
|
|
|
|
|
*/ |
|
|
|
|
|
@function emToPx($value, $font-size: $base__font-size) { |
|
|
|
|
|
@return ($value * $font-size) * 1px; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
|
* calculate line-height with font-size |
|
|
|
|
|
* |
|
|
|
|
|
* @param {px} $font-size |
|
|
|
|
|
* @param {unitless} $base-line-height |
|
|
|
|
|
* @return {unitless} |
|
|
|
|
|
*/ |
|
|
|
|
|
@function lineHeight($font-size, $line-height: $base-line-height) { |
|
|
|
|
|
@return unitless(emToPx($line-height * 1em) / $font-size); |
|
|
|
|
|
} |
|
|
|