frontend/source/sass/base/_rem.scss
// Earlier copies of the U.S. Web Design System had a pixels-to-rem function
// we use extensively. New versions have stripped that out. This duplicates it.
$em-base: 10px;
// Strips the unit from a number.
@function strip-units($value) {
@return ($value / ($value * 0 + 1));
}
// Convert pixels to rems
// eg. for a relational value of 12px write rem(12)
// Assumes $em-base is the font-size of <html>
@function rem($pxval) {
@if not unitless($pxval) {
$pxval: strip-units($pxval);
}
$base: $em-base;
@if not unitless($base) {
$base: strip-units($base);
}
@return ($pxval / $base) * 1rem;
}