// Some mixins that help us deal with browser scaling of text more consistantly.
// Essentially, fonts across eui should scale agains the root html element, not
// against parent inheritance.


// Typography mixins

@function convertToRem($size) {
  @return #{$size / $euiFontSize}rem;
}

// Spit out rem and px

@mixin fontSize($size: $euiFontSize) {
  font-size: $size;
  font-size: convertToRem($size);
}

// Families

$euiFontFamily: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !default;
$euiCodeFontFamily: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace !default;

// Font sizes

$euiFontSize:       $euiSize !default;

$euiFontSizeXS:     $euiFontSize * .75 !default;
$euiFontSizeS:      $euiFontSize * .875 !default;
$euiFontSizeM:      $euiFontSize * 1.125 !default;
$euiFontSizeL:      $euiFontSize * 1.5 !default;
$euiFontSizeXL:     $euiFontSize * 2 !default;
$euiFontSizeXXL:    $euiFontSize * 3 !default;

// Line height

$euiLineHeight:     1.5;


// Font weights

$euiFontWeightLight:    300 !default;
$euiFontWeightRegular:  400 !default;
$euiFontWeightMedium:   500 !default;
$euiFontWeightBold:     700 !default;
