From: Geoff Kimball Date: Thu, 17 Dec 2015 22:41:48 +0000 (-0800) Subject: If rem-calc() is given a % base, multiply the base by 16px X-Git-Tag: v6.1.0~38^2 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=refs%2Fpull%2F7580%2Fhead;p=thirdparty%2Ffoundation%2Ffoundation-sites.git If rem-calc() is given a % base, multiply the base by 16px --- diff --git a/scss/util/_unit.scss b/scss/util/_unit.scss index 245b572f3..613d9c7e2 100644 --- a/scss/util/_unit.scss +++ b/scss/util/_unit.scss @@ -22,19 +22,22 @@ $global-font-size: 100% !default; /// Converts one or more pixel values into matching rem values. /// /// @param {Number|List} $values - One or more values to convert. Be sure to separate them with spaces and not commas. If you need to convert a comma-separated list, wrap the list in parentheses. -/// @param {Number} $base [null] - The base value to use when calculating the `rem`. If you're using Foundation out of the box, this is 16px. +/// @param {Number} $base [null] - The base value to use when calculating the `rem`. If you're using Foundation out of the box, this is 16px. If this parameter is `null`, the function will reference the `$base-font-size` variable as the base. /// /// @returns {List} A list of converted values. @function rem-calc($values, $base: null) { $rem-values: (); $count: length($values); + // If no base is defined, defer to the global font size @if $base == null { $base: $global-font-size; } + // If the base font size is a %, then multiply it by 16px + // This is because 100% font size = 16px in most all browsers @if unit($base) == '%' { - $base: 16px; + $base: ($base / 100%) * 16px; } @if $count == 1 {