@use "sass:math";

$base-font-size: 16;
$base-viewport-width: 1920;

// Given a unitless number and an optional context, calculate a size in rem.
//
// @param  {number} $size    A unitless number to convert to a size in rem
// @param  {number} $context A unitless number that acts as the divisor
// @return {number}          The size in rem
@function rem($size, $context: $base-font-size) {
  @return math.div($size, $context) * 1rem;
}

// Given a unitless number and an optional context, calculate a size in rem.
//
// @param  {number} $size    A unitless number to convert to a size in rem
// @param  {number} $context A unitless number that acts as the divisor
// @return {number}          The size in rem
@function em($size, $context: $base-font-size) {
  @return math.div($size, $context) * 1em;
}

// Given a unitless number and an optional context, calculate a size in vw.
//
// @param  {number} $size    A unitless number to convert to a size in vw
// @param  {number} $context A unitless number that acts as the divisor
// @return {number}          The size in vw
@function vw($size, $context: $base-viewport-width) {
  @return (math.div($size, $context) * 100) * 1vw;
}
