/// // Converts a pixel value to ems with a base font size of 18 px // // @param {int} $px Target pixel value // @return {value} Pixel value converted to ems /// @function -cdd-em($px) { @return ($px / 18) * 1em; } /// // Converts a pixel value to rems with a base font size of 18 px // // @param {int} $px Target pixel value // @return {value} Pixel value converted to rems /// @function -cdd-rem($px) { @return ($px / 18) * 1rem; } /// // Returns the correct url() to an image in assets/img // // @param {string} $name Filename of the image // @return {value} /// @function -cdd-img-url($name) { @return url(-cdd-cachebuster('/assets/img/' + $name)); } /// // Helper to embed @font-face declarations // Inspired by https://gist.github.com/jonathantneal/d0460e5c2d5d7f9bc5e6 // // @param {string} $name Font name (human-readable) // @param {string} $file Name of the font file // @param {int} $weight font-weight value of the font file // @param {string} $style font-style value of the font file /// @mixin -cdd-font-face($name, $file, $weight: normal, $style: normal) { @font-face { font-family: quote($name); font-style: $style; font-weight: $weight; src: url(-cdd-cachebuster('/assets/fonts/' + $file + '.eot')); // IE < 9 src: url(-cdd-cachebuster('/assets/fonts/' + $file + '.eot') + '?#') format('embedded-opentype'), // IE 9 url(-cdd-cachebuster('/assets/fonts/' + $file + '.woff2')) format('woff2'), url(-cdd-cachebuster('/assets/fonts/' + $file + '.woff')) format('woff'); font-display: swap; } }