Chirp Sass Documentation

General

Css

& .kib-input-text__icon,
  & .kib-field__icon--action { ... }& .kib-input-text__icon,
  & .kib-field__icon--action { @include mixins.input-field-icon; }

Description

deprecate when field new is supported

.kib-input-text__icon &__adornment { ... }.kib-input-text__icon &__adornment { &.MuiInputAdornment-root {
      @include mixins.input-adornment;
    }

    .Mui-focusVisible {
      @include mixins.button-focus;
    }

    .MuiButtonBase-root {
      @include mixins.button;

      #{$parent} .kib-field__icon--action & {
        @include mixins.button-action;
      }

      #{$parent} .kib-field__icon--action &:focus {
        @include mixins.button-action-focus;
      }
    }

    #{$parent} .kib-field__icon--action &.is-expanded .MuiButtonBase-root {
      @include mixins.button-action-expanded;
    } }

Description

deprecate when field new is supported

.kib-input-text__icon &__adornment-icon { ... }.kib-input-text__icon &__adornment-icon { @include mixins.input-adornment-icon;

    .Mui-disabled & {
      @include mixins.input-adornment-icon-disabled;
    }

    #{$parent} .kib-field__icon--action .is-expanded & {
      @include mixins.input-adornment-icon-expanded;
    } }

Description

deprecate when field new is supported

.kib-field__action &__adornment { ... }.kib-field__action &__adornment { &.MuiInputAdornment-root {
      @include mixins.input-adornment-new;

      &.is-disabled {
        @include mixins.button-action-disabled;
      }
    }

    .Mui-focusVisible {
      @include mixins.button-focus;
    }

    .MuiButtonBase-root {
      @include mixins.button-new;
    }

    &.is-expanded .MuiButtonBase-root {
      @include mixins.button-action-expanded;
    } }

Description

new datepicker specific styles

.kib-field__action .Mui-disabled &__adornment-icon { ... }.kib-field__action .Mui-disabled &__adornment-icon { @include mixins.input-adornment-icon-disabled; }

Description

new datepicker specific styles

&--xs { ... }&--xs { @include mixins.font-styles('xs'); }

Functions

@function -get-spacing-value($theme: common.$default-theme, $alias) { ... }@function -get-spacing-value($theme: common.$default-theme, $alias) { 
  $spacings: common.get-theme-map(settings.$themes, $theme);
  $has-key: map.has-key($spacings, $alias);

  @if $has-key == false {
    @error "Spacing not found: '#{$alias}'";
  }

  $value: map.get($spacings, $alias);

  @return unit.rem($value);
 }

Description

Retrieves a spacing unit from a theme's spacing tokens

Parameters

Parameters
parameter Name	parameter Description	parameter Type	parameter Default value
`$theme`	Name of the theme	`String`	`common.$default-theme`
`$alias`	Alias of spacing unit	`String`	— none

Returns

Number —

Spacing value from the theme

Throws

Spacing not found:

Requires

[function] get-theme-map
[function] get
[function] rem
[variable] themes

Used by

[function] get

@function get-properties($theme: common.$default-theme) { ... }@function get-properties($theme: common.$default-theme) { 
  $theme-map: common.get-theme-map(settings.$themes, $theme);

  @each $key, $value in $theme-map {
    $theme-map: map.set($theme-map, 'spacing', $key, unit.rem($value));
  }

  @return common.flatten-map($theme-map);
 }

Description

Returns a theme's spacings as a flattened map with kebab-cased names

Parameters

Parameters
parameter Name	parameter Description	parameter Type	parameter Default value
`$theme`	Name of the theme	`String`	`common.$default-theme`

Returns

Map —

Final flattened map

Requires

[function] get-theme-map
[function] rem
[function] flatten-map
[variable] themes

@function get($spacings...) { ... }@function get($spacings...) { 
  $properties: ();

  @each $value in $spacings {
    @if meta.type-of($value) == number or $value == auto {
      $properties: list.append($properties, $value);
    } @else {
      $property: common.get-property-name('spacing', $value);
      $fallback: -get-spacing-value(common.$default-theme, $value);
      $properties: list.append($properties, var(#{$property}, #{$fallback}));
    }
  }

  // Return the plain value if it's just one. If a list with just one
  // value is returned, type functions will return `list` instead of `string`.
  @if list.length($properties) == 1 {
    @return list.nth($properties, 1);
  }

  @return $properties;
 }

Description

Creates a custom property reference from a list of spacing aliases. Number values and auto are allowed for convenience when writing complex shorthand padding or margin properties.

Parameters

Parameters
parameter Name	parameter Description	parameter Type	parameter Default value
`$spacings...`	Comma separated list of spacing units from a theme. Numbers and `auto` are also valid.	`List`	— none

Returns

List —

List of CSS var() function with fallback values

Example

Basic usage

@use '~@chewy/kib-foundations/src/spacing';

.example {
  padding-right: spacing.get('s4');
}

.example-margin {
  margin: spacing.get('s2', auto);
}

.example-padding {
  padding: spacing.get('s3', 0, 's7');
}

Requires

Variables

$preferred-theme: common.$preferred-theme !default;

Description

Name of the preferred theme to look for properties first. If not found it will fallback to common.$default-theme.

Type

String

$themes: (...);$themes: (
  base: tokensWeb.$chirp-typography,
  petmd: tokensPetMD.$chirp-typography,
  gordita: tokensGordita.$chirp-typography,
  enterprise: tokensEnterprise.$chirp-typography
);

Description

Map of typography token themes with type style declarations.

Type

Map

$aliases: (...);$aliases: (
  'paragraph': 'editorial-p-1'
);

Description

Map of type style aliases to facilitate deprecation and removal of type styles

Type

Map

Used by

[mixin] style-as

$chirp-typography-price-small-strikethrough-text-case: none !default;

Description

Sass variables

$chirp-typography: (
  'display-typeface': $chirp-typography-display-typeface,
  'text-typeface': $chirp-typography-text-typeface,
  'ls-standard': $chirp-typography-ls-standard,
  'ls-loose': $chirp-typography-ls-loose,
  'ls-wide': $chirp-typography-ls-wide,
  'ls-tight': $chirp-typography-ls-tight,
  'weight-normal': $chirp-typography-weight-normal,
  'weight-bold': $chirp-typography-weight-bold,
  'weight-semibold': $chirp-typography-weight-semibold,
  'weight-medium': $chirp-typography-weight-medium,
  'weight-heavy': $chirp-typography-weight-heavy,
  'display-1': (
    'font-family': $chirp-typography-display-1-font-family,
    'font-weight': $chirp-typography-display-1-font-weight,
    'line-height': $chirp-typography-display-1-line-height,
    'font-size': $chirp-typography-display-1-font-size,
    'letter-spacing': $chirp-typography-display-1-letter-spacing,
    'text-decoration': $chirp-typography-display-1-text-decoration,
    'text-case': $chirp-typography-display-1-text-case
  ),
  'display-2': (
    'font-family': $chirp-typography-display-2-font-family,
    'font-weight': $chirp-typography-display-2-font-weight,
    'line-height': $chirp-typography-display-2-line-height,
    'font-size': $chirp-typography-display-2-font-size,
    'letter-spacing': $chirp-typography-display-2-letter-spacing,
    'text-decoration': $chirp-typography-display-2-text-decoration,
    'text-case': $chirp-typography-display-2-text-case
  ),
  'display-3': (
    'font-family': $chirp-typography-display-3-font-family,
    'font-weight': $chirp-typography-display-3-font-weight,
    'line-height': $chirp-typography-display-3-line-height,
    'font-size': $chirp-typography-display-3-font-size,
    'letter-spacing': $chirp-typography-display-3-letter-spacing,
    'text-decoration': $chirp-typography-display-3-text-decoration,
    'text-case': $chirp-typography-display-3-text-case
  ),
  'display-4': (
    'font-family': $chirp-typography-display-4-font-family,
    'font-weight': $chirp-typography-display-4-font-weight,
    'line-height': $chirp-typography-display-4-line-height,
    'font-size': $chirp-typography-display-4-font-size,
    'letter-spacing': $chirp-typography-display-4-letter-spacing,
    'text-decoration': $chirp-typography-display-4-text-decoration,
    'text-case': $chirp-typography-display-4-text-case
  ),
  'display-5': (
    'font-family': $chirp-typography-display-5-font-family,
    'font-weight': $chirp-typography-display-5-font-weight,
    'line-height': $chirp-typography-display-5-line-height,
    'font-size': $chirp-typography-display-5-font-size,
    'letter-spacing': $chirp-typography-display-5-letter-spacing,
    'text-decoration': $chirp-typography-display-5-text-decoration,
    'text-case': $chirp-typography-display-5-text-case
  ),
  'display-6': (
    'font-family': $chirp-typography-display-6-font-family,
    'font-weight': $chirp-typography-display-6-font-weight,
    'line-height': $chirp-typography-display-6-line-height,
    'font-size': $chirp-typography-display-6-font-size,
    'letter-spacing': $chirp-typography-display-6-letter-spacing,
    'text-decoration': $chirp-typography-display-6-text-decoration,
    'text-case': $chirp-typography-display-6-text-case
  ),
  'section-1': (
    'font-family': $chirp-typography-section-1-font-family,
    'font-weight': $chirp-typography-section-1-font-weight,
    'line-height': $chirp-typography-section-1-line-height,
    'font-size': $chirp-typography-section-1-font-size,
    'letter-spacing': $chirp-typography-section-1-letter-spacing,
    'text-decoration': $chirp-typography-section-1-text-decoration,
    'text-case': $chirp-typography-section-1-text-case
  ),
  'section-2': (
    'font-family': $chirp-typography-section-2-font-family,
    'font-weight': $chirp-typography-section-2-font-weight,
    'line-height': $chirp-typography-section-2-line-height,
    'font-size': $chirp-typography-section-2-font-size,
    'letter-spacing': $chirp-typography-section-2-letter-spacing,
    'text-decoration': $chirp-typography-section-2-text-decoration,
    'text-case': $chirp-typography-section-2-text-case
  ),
  'section-3': (
    'font-family': $chirp-typography-section-3-font-family,
    'font-weight': $chirp-typography-section-3-font-weight,
    'line-height': $chirp-typography-section-3-line-height,
    'font-size': $chirp-typography-section-3-font-size,
    'letter-spacing': $chirp-typography-section-3-letter-spacing,
    'text-decoration': $chirp-typography-section-3-text-decoration,
    'text-case': $chirp-typography-section-3-text-case
  ),
  'paragraph-1': (
    'font-family': $chirp-typography-paragraph-1-font-family,
    'font-weight': $chirp-typography-paragraph-1-font-weight,
    'line-height': $chirp-typography-paragraph-1-line-height,
    'font-size': $chirp-typography-paragraph-1-font-size,
    'letter-spacing': $chirp-typography-paragraph-1-letter-spacing,
    'text-decoration': $chirp-typography-paragraph-1-text-decoration,
    'text-case': $chirp-typography-paragraph-1-text-case
  ),
  'paragraph-2': (
    'font-family': $chirp-typography-paragraph-2-font-family,
    'font-weight': $chirp-typography-paragraph-2-font-weight,
    'line-height': $chirp-typography-paragraph-2-line-height,
    'font-size': $chirp-typography-paragraph-2-font-size,
    'letter-spacing': $chirp-typography-paragraph-2-letter-spacing,
    'text-decoration': $chirp-typography-paragraph-2-text-decoration,
    'text-case': $chirp-typography-paragraph-2-text-case
  ),
  'caption': (
    'font-family': $chirp-typography-caption-font-family,
    'font-weight': $chirp-typography-caption-font-weight,
    'line-height': $chirp-typography-caption-line-height,
    'font-size': $chirp-typography-caption-font-size,
    'letter-spacing': $chirp-typography-caption-letter-spacing,
    'text-decoration': $chirp-typography-caption-text-decoration,
    'text-case': $chirp-typography-caption-text-case
  ),
  'button': (
    'font-family': $chirp-typography-button-font-family,
    'font-weight': $chirp-typography-button-font-weight,
    'line-height': $chirp-typography-button-line-height,
    'font-size': $chirp-typography-button-font-size,
    'letter-spacing': $chirp-typography-button-letter-spacing,
    'text-decoration': $chirp-typography-button-text-decoration,
    'text-case': $chirp-typography-button-text-case
  ),
  'button-medium': (
    'font-family': $chirp-typography-button-medium-font-family,
    'font-weight': $chirp-typography-button-medium-font-weight,
    'line-height': $chirp-typography-button-medium-line-height,
    'font-size': $chirp-typography-button-medium-font-size,
    'letter-spacing': $chirp-typography-button-medium-letter-spacing,
    'text-decoration': $chirp-typography-button-medium-text-decoration,
    'text-case': $chirp-typography-button-medium-text-case
  ),
  'overline': (
    'font-family': $chirp-typography-overline-font-family,
    'font-weight': $chirp-typography-overline-font-weight,
    'line-height': $chirp-typography-overline-line-height,
    'font-size': $chirp-typography-overline-font-size,
    'letter-spacing': $chirp-typography-overline-letter-spacing,
    'text-decoration': $chirp-typography-overline-text-decoration,
    'text-case': $chirp-typography-overline-text-case
  ),
  'form-grouping': (
    'font-family': $chirp-typography-form-grouping-font-family,
    'font-weight': $chirp-typography-form-grouping-font-weight,
    'line-height': $chirp-typography-form-grouping-line-height,
    'font-size': $chirp-typography-form-grouping-font-size,
    'letter-spacing': $chirp-typography-form-grouping-letter-spacing,
    'text-decoration': $chirp-typography-form-grouping-text-decoration,
    'text-case': $chirp-typography-form-grouping-text-case
  ),
  'form-label': (
    'font-family': $chirp-typography-form-label-font-family,
    'font-weight': $chirp-typography-form-label-font-weight,
    'line-height': $chirp-typography-form-label-line-height,
    'font-size': $chirp-typography-form-label-font-size,
    'letter-spacing': $chirp-typography-form-label-letter-spacing,
    'text-decoration': $chirp-typography-form-label-text-decoration,
    'text-case': $chirp-typography-form-label-text-case
  ),
  'form-dropdown-header': (
    'font-family': $chirp-typography-form-dropdown-header-font-family,
    'font-weight': $chirp-typography-form-dropdown-header-font-weight,
    'line-height': $chirp-typography-form-dropdown-header-line-height,
    'font-size': $chirp-typography-form-dropdown-header-font-size,
    'letter-spacing': $chirp-typography-form-dropdown-header-letter-spacing,
    'text-decoration': $chirp-typography-form-dropdown-header-text-decoration,
    'text-case': $chirp-typography-form-dropdown-header-text-case,
    'font-style': $chirp-typography-form-dropdown-header-font-style
  ),
  'form-text': (
    'font-family': $chirp-typography-form-text-font-family,
    'font-weight': $chirp-typography-form-text-font-weight,
    'line-height': $chirp-typography-form-text-line-height,
    'font-size': $chirp-typography-form-text-font-size,
    'letter-spacing': $chirp-typography-form-text-letter-spacing,
    'text-decoration': $chirp-typography-form-text-text-decoration,
    'text-case': $chirp-typography-form-text-text-case
  ),
  'form-helper': (
    'font-family': $chirp-typography-form-helper-font-family,
    'font-weight': $chirp-typography-form-helper-font-weight,
    'line-height': $chirp-typography-form-helper-line-height,
    'font-size': $chirp-typography-form-helper-font-size,
    'letter-spacing': $chirp-typography-form-helper-letter-spacing,
    'text-decoration': $chirp-typography-form-helper-text-decoration,
    'text-case': $chirp-typography-form-helper-text-case
  ),
  'form-error': (
    'font-family': $chirp-typography-form-error-font-family,
    'font-weight': $chirp-typography-form-error-font-weight,
    'line-height': $chirp-typography-form-error-line-height,
    'font-size': $chirp-typography-form-error-font-size,
    'letter-spacing': $chirp-typography-form-error-letter-spacing,
    'text-decoration': $chirp-typography-form-error-text-decoration,
    'text-case': $chirp-typography-form-error-text-case
  ),
  'utility': (
    'font-family': $chirp-typography-utility-font-family,
    'font-weight': $chirp-typography-utility-font-weight,
    'line-height': $chirp-typography-utility-line-height,
    'font-size': $chirp-typography-utility-font-size,
    'letter-spacing': $chirp-typography-utility-letter-spacing,
    'text-decoration': $chirp-typography-utility-text-decoration,
    'text-case': $chirp-typography-utility-text-case
  ),
  'utility-small': (
    'font-family': $chirp-typography-utility-small-font-family,
    'font-weight': $chirp-typography-utility-small-font-weight,
    'line-height': $chirp-typography-utility-small-line-height,
    'font-size': $chirp-typography-utility-small-font-size,
    'letter-spacing': $chirp-typography-utility-small-letter-spacing,
    'text-decoration': $chirp-typography-utility-small-text-decoration,
    'text-case': $chirp-typography-utility-small-text-case
  ),
  'price-x-small': (
    'font-family': $chirp-typography-price-x-small-font-family,
    'font-weight': $chirp-typography-price-x-small-font-weight,
    'line-height': $chirp-typography-price-x-small-line-height,
    'font-size': $chirp-typography-price-x-small-font-size,
    'letter-spacing': $chirp-typography-price-x-small-letter-spacing,
    'text-decoration': $chirp-typography-price-x-small-text-decoration,
    'text-case': $chirp-typography-price-x-small-text-case
  ),
  'price-small': (
    'font-family': $chirp-typography-price-small-font-family,
    'font-weight': $chirp-typography-price-small-font-weight,
    'line-height': $chirp-typography-price-small-line-height,
    'font-size': $chirp-typography-price-small-font-size,
    'letter-spacing': $chirp-typography-price-small-letter-spacing,
    'text-decoration': $chirp-typography-price-small-text-decoration,
    'text-case': $chirp-typography-price-small-text-case
  ),
  'price-medium': (
    'font-family': $chirp-typography-price-medium-font-family,
    'font-weight': $chirp-typography-price-medium-font-weight,
    'line-height': $chirp-typography-price-medium-line-height,
    'font-size': $chirp-typography-price-medium-font-size,
    'letter-spacing': $chirp-typography-price-medium-letter-spacing,
    'text-decoration': $chirp-typography-price-medium-text-decoration,
    'text-case': $chirp-typography-price-medium-text-case
  ),
  'price-large': (
    'font-family': $chirp-typography-price-large-font-family,
    'font-weight': $chirp-typography-price-large-font-weight,
    'line-height': $chirp-typography-price-large-line-height,
    'font-size': $chirp-typography-price-large-font-size,
    'letter-spacing': $chirp-typography-price-large-letter-spacing,
    'text-decoration': $chirp-typography-price-large-text-decoration,
    'text-case': $chirp-typography-price-large-text-case
  ),
  'price-x-large': (
    'font-family': $chirp-typography-price-x-large-font-family,
    'font-weight': $chirp-typography-price-x-large-font-weight,
    'line-height': $chirp-typography-price-x-large-line-height,
    'font-size': $chirp-typography-price-x-large-font-size,
    'letter-spacing': $chirp-typography-price-x-large-letter-spacing,
    'text-decoration': $chirp-typography-price-x-large-text-decoration,
    'text-case': $chirp-typography-price-x-large-text-case
  ),
  'price-x-small-strikethrough': (
    'font-family': $chirp-typography-price-x-small-strikethrough-font-family,
    'font-weight': $chirp-typography-price-x-small-strikethrough-font-weight,
    'line-height': $chirp-typography-price-x-small-strikethrough-line-height,
    'font-size': $chirp-typography-price-x-small-strikethrough-font-size,
    'letter-spacing': $chirp-typography-price-x-small-strikethrough-letter-spacing,
    'text-decoration': $chirp-typography-price-x-small-strikethrough-text-decoration,
    'text-case': $chirp-typography-price-x-small-strikethrough-text-case
  ),
  'price-small-strikethrough': (
    'font-family': $chirp-typography-price-small-strikethrough-font-family,
    'font-weight': $chirp-typography-price-small-strikethrough-font-weight,
    'line-height': $chirp-typography-price-small-strikethrough-line-height,
    'font-size': $chirp-typography-price-small-strikethrough-font-size,
    'letter-spacing': $chirp-typography-price-small-strikethrough-letter-spacing,
    'text-decoration': $chirp-typography-price-small-strikethrough-text-decoration,
    'text-case': $chirp-typography-price-small-strikethrough-text-case
  )
);

Description

Modified 'scss/map-deep' template to output custom properties for properties that have references

$chirp-typography-price-small-strikethrough-text-case: none !default;

Description

Sass variables

$chirp-typography: (
  'display-typeface': $chirp-typography-display-typeface,
  'ls-wide': $chirp-typography-ls-wide,
  'text-typeface': $chirp-typography-text-typeface,
  'weight-heavy': $chirp-typography-weight-heavy,
  'weight-bold': $chirp-typography-weight-bold,
  'weight-semibold': $chirp-typography-weight-semibold,
  'ls-standard': $chirp-typography-ls-standard,
  'ls-loose': $chirp-typography-ls-loose,
  'ls-tight': $chirp-typography-ls-tight,
  'weight-normal': $chirp-typography-weight-normal,
  'weight-medium': $chirp-typography-weight-medium,
  'display-1': (
    'font-family': $chirp-typography-display-1-font-family,
    'font-weight': $chirp-typography-display-1-font-weight,
    'line-height': $chirp-typography-display-1-line-height,
    'font-size': $chirp-typography-display-1-font-size,
    'letter-spacing': $chirp-typography-display-1-letter-spacing,
    'text-decoration': $chirp-typography-display-1-text-decoration,
    'text-case': $chirp-typography-display-1-text-case
  ),
  'display-2': (
    'font-family': $chirp-typography-display-2-font-family,
    'font-weight': $chirp-typography-display-2-font-weight,
    'line-height': $chirp-typography-display-2-line-height,
    'font-size': $chirp-typography-display-2-font-size,
    'letter-spacing': $chirp-typography-display-2-letter-spacing,
    'text-decoration': $chirp-typography-display-2-text-decoration,
    'text-case': $chirp-typography-display-2-text-case
  ),
  'display-3': (
    'font-family': $chirp-typography-display-3-font-family,
    'font-weight': $chirp-typography-display-3-font-weight,
    'line-height': $chirp-typography-display-3-line-height,
    'font-size': $chirp-typography-display-3-font-size,
    'letter-spacing': $chirp-typography-display-3-letter-spacing,
    'text-decoration': $chirp-typography-display-3-text-decoration,
    'text-case': $chirp-typography-display-3-text-case
  ),
  'display-4': (
    'font-family': $chirp-typography-display-4-font-family,
    'font-weight': $chirp-typography-display-4-font-weight,
    'line-height': $chirp-typography-display-4-line-height,
    'font-size': $chirp-typography-display-4-font-size,
    'letter-spacing': $chirp-typography-display-4-letter-spacing,
    'text-decoration': $chirp-typography-display-4-text-decoration,
    'text-case': $chirp-typography-display-4-text-case
  ),
  'display-5': (
    'font-family': $chirp-typography-display-5-font-family,
    'font-weight': $chirp-typography-display-5-font-weight,
    'line-height': $chirp-typography-display-5-line-height,
    'font-size': $chirp-typography-display-5-font-size,
    'letter-spacing': $chirp-typography-display-5-letter-spacing,
    'text-decoration': $chirp-typography-display-5-text-decoration,
    'text-case': $chirp-typography-display-5-text-case
  ),
  'display-6': (
    'font-family': $chirp-typography-display-6-font-family,
    'font-weight': $chirp-typography-display-6-font-weight,
    'line-height': $chirp-typography-display-6-line-height,
    'font-size': $chirp-typography-display-6-font-size,
    'letter-spacing': $chirp-typography-display-6-letter-spacing,
    'text-decoration': $chirp-typography-display-6-text-decoration,
    'text-case': $chirp-typography-display-6-text-case
  ),
  'section-1': (
    'font-family': $chirp-typography-section-1-font-family,
    'font-weight': $chirp-typography-section-1-font-weight,
    'line-height': $chirp-typography-section-1-line-height,
    'font-size': $chirp-typography-section-1-font-size,
    'letter-spacing': $chirp-typography-section-1-letter-spacing,
    'text-decoration': $chirp-typography-section-1-text-decoration,
    'text-case': $chirp-typography-section-1-text-case
  ),
  'section-2': (
    'font-family': $chirp-typography-section-2-font-family,
    'font-weight': $chirp-typography-section-2-font-weight,
    'line-height': $chirp-typography-section-2-line-height,
    'font-size': $chirp-typography-section-2-font-size,
    'letter-spacing': $chirp-typography-section-2-letter-spacing,
    'text-decoration': $chirp-typography-section-2-text-decoration,
    'text-case': $chirp-typography-section-2-text-case
  ),
  'section-3': (
    'font-family': $chirp-typography-section-3-font-family,
    'font-weight': $chirp-typography-section-3-font-weight,
    'line-height': $chirp-typography-section-3-line-height,
    'font-size': $chirp-typography-section-3-font-size,
    'letter-spacing': $chirp-typography-section-3-letter-spacing,
    'text-decoration': $chirp-typography-section-3-text-decoration,
    'text-case': $chirp-typography-section-3-text-case
  ),
  'editorial-p-1': (
    'font-family': $chirp-typography-editorial-p-1-font-family,
    'font-weight': $chirp-typography-editorial-p-1-font-weight,
    'line-height': $chirp-typography-editorial-p-1-line-height,
    'font-size': $chirp-typography-editorial-p-1-font-size,
    'letter-spacing': $chirp-typography-editorial-p-1-letter-spacing,
    'text-decoration': $chirp-typography-editorial-p-1-text-decoration,
    'text-case': $chirp-typography-editorial-p-1-text-case
  ),
  'editorial-p-2': (
    'font-family': $chirp-typography-editorial-p-2-font-family,
    'font-weight': $chirp-typography-editorial-p-2-font-weight,
    'line-height': $chirp-typography-editorial-p-2-line-height,
    'font-size': $chirp-typography-editorial-p-2-font-size,
    'letter-spacing': $chirp-typography-editorial-p-2-letter-spacing,
    'text-decoration': $chirp-typography-editorial-p-2-text-decoration,
    'text-case': $chirp-typography-editorial-p-2-text-case
  ),
  'paragraph-1': (
    'font-family': $chirp-typography-paragraph-1-font-family,
    'font-weight': $chirp-typography-paragraph-1-font-weight,
    'line-height': $chirp-typography-paragraph-1-line-height,
    'font-size': $chirp-typography-paragraph-1-font-size,
    'letter-spacing': $chirp-typography-paragraph-1-letter-spacing,
    'text-decoration': $chirp-typography-paragraph-1-text-decoration,
    'text-case': $chirp-typography-paragraph-1-text-case
  ),
  'paragraph-2': (
    'font-family': $chirp-typography-paragraph-2-font-family,
    'font-weight': $chirp-typography-paragraph-2-font-weight,
    'line-height': $chirp-typography-paragraph-2-line-height,
    'font-size': $chirp-typography-paragraph-2-font-size,
    'letter-spacing': $chirp-typography-paragraph-2-letter-spacing,
    'text-decoration': $chirp-typography-paragraph-2-text-decoration,
    'text-case': $chirp-typography-paragraph-2-text-case
  ),
  'caption': (
    'font-family': $chirp-typography-caption-font-family,
    'font-weight': $chirp-typography-caption-font-weight,
    'line-height': $chirp-typography-caption-line-height,
    'font-size': $chirp-typography-caption-font-size,
    'letter-spacing': $chirp-typography-caption-letter-spacing,
    'text-decoration': $chirp-typography-caption-text-decoration,
    'text-case': $chirp-typography-caption-text-case
  ),
  'button': (
    'font-family': $chirp-typography-button-font-family,
    'font-weight': $chirp-typography-button-font-weight,
    'line-height': $chirp-typography-button-line-height,
    'font-size': $chirp-typography-button-font-size,
    'letter-spacing': $chirp-typography-button-letter-spacing,
    'text-decoration': $chirp-typography-button-text-decoration,
    'text-case': $chirp-typography-button-text-case
  ),
  'button-medium': (
    'font-family': $chirp-typography-button-medium-font-family,
    'font-weight': $chirp-typography-button-medium-font-weight,
    'line-height': $chirp-typography-button-medium-line-height,
    'font-size': $chirp-typography-button-medium-font-size,
    'letter-spacing': $chirp-typography-button-medium-letter-spacing,
    'text-decoration': $chirp-typography-button-medium-text-decoration,
    'text-case': $chirp-typography-button-medium-text-case
  ),
  'overline': (
    'font-family': $chirp-typography-overline-font-family,
    'font-weight': $chirp-typography-overline-font-weight,
    'line-height': $chirp-typography-overline-line-height,
    'font-size': $chirp-typography-overline-font-size,
    'letter-spacing': $chirp-typography-overline-letter-spacing,
    'text-decoration': $chirp-typography-overline-text-decoration,
    'text-case': $chirp-typography-overline-text-case
  ),
  'form-grouping': (
    'font-family': $chirp-typography-form-grouping-font-family,
    'font-weight': $chirp-typography-form-grouping-font-weight,
    'line-height': $chirp-typography-form-grouping-line-height,
    'font-size': $chirp-typography-form-grouping-font-size,
    'letter-spacing': $chirp-typography-form-grouping-letter-spacing,
    'text-decoration': $chirp-typography-form-grouping-text-decoration,
    'text-case': $chirp-typography-form-grouping-text-case
  ),
  'form-label': (
    'font-family': $chirp-typography-form-label-font-family,
    'font-weight': $chirp-typography-form-label-font-weight,
    'line-height': $chirp-typography-form-label-line-height,
    'font-size': $chirp-typography-form-label-font-size,
    'letter-spacing': $chirp-typography-form-label-letter-spacing,
    'text-decoration': $chirp-typography-form-label-text-decoration,
    'text-case': $chirp-typography-form-label-text-case
  ),
  'form-dropdown-header': (
    'font-family': $chirp-typography-form-dropdown-header-font-family,
    'font-weight': $chirp-typography-form-dropdown-header-font-weight,
    'line-height': $chirp-typography-form-dropdown-header-line-height,
    'font-size': $chirp-typography-form-dropdown-header-font-size,
    'letter-spacing': $chirp-typography-form-dropdown-header-letter-spacing,
    'text-decoration': $chirp-typography-form-dropdown-header-text-decoration,
    'text-case': $chirp-typography-form-dropdown-header-text-case,
    'font-style': $chirp-typography-form-dropdown-header-font-style
  ),
  'form-text': (
    'font-family': $chirp-typography-form-text-font-family,
    'font-weight': $chirp-typography-form-text-font-weight,
    'line-height': $chirp-typography-form-text-line-height,
    'font-size': $chirp-typography-form-text-font-size,
    'letter-spacing': $chirp-typography-form-text-letter-spacing,
    'text-decoration': $chirp-typography-form-text-text-decoration,
    'text-case': $chirp-typography-form-text-text-case
  ),
  'form-helper': (
    'font-family': $chirp-typography-form-helper-font-family,
    'font-weight': $chirp-typography-form-helper-font-weight,
    'line-height': $chirp-typography-form-helper-line-height,
    'font-size': $chirp-typography-form-helper-font-size,
    'letter-spacing': $chirp-typography-form-helper-letter-spacing,
    'text-decoration': $chirp-typography-form-helper-text-decoration,
    'text-case': $chirp-typography-form-helper-text-case
  ),
  'form-error': (
    'font-family': $chirp-typography-form-error-font-family,
    'font-weight': $chirp-typography-form-error-font-weight,
    'line-height': $chirp-typography-form-error-line-height,
    'font-size': $chirp-typography-form-error-font-size,
    'letter-spacing': $chirp-typography-form-error-letter-spacing,
    'text-decoration': $chirp-typography-form-error-text-decoration,
    'text-case': $chirp-typography-form-error-text-case
  ),
  'utility': (
    'font-family': $chirp-typography-utility-font-family,
    'font-weight': $chirp-typography-utility-font-weight,
    'line-height': $chirp-typography-utility-line-height,
    'font-size': $chirp-typography-utility-font-size,
    'letter-spacing': $chirp-typography-utility-letter-spacing,
    'text-decoration': $chirp-typography-utility-text-decoration,
    'text-case': $chirp-typography-utility-text-case
  ),
  'utility-small': (
    'font-family': $chirp-typography-utility-small-font-family,
    'font-weight': $chirp-typography-utility-small-font-weight,
    'line-height': $chirp-typography-utility-small-line-height,
    'font-size': $chirp-typography-utility-small-font-size,
    'letter-spacing': $chirp-typography-utility-small-letter-spacing,
    'text-decoration': $chirp-typography-utility-small-text-decoration,
    'text-case': $chirp-typography-utility-small-text-case
  ),
  'price-small': (
    'font-family': $chirp-typography-price-small-font-family,
    'font-weight': $chirp-typography-price-small-font-weight,
    'line-height': $chirp-typography-price-small-line-height,
    'font-size': $chirp-typography-price-small-font-size,
    'letter-spacing': $chirp-typography-price-small-letter-spacing,
    'text-decoration': $chirp-typography-price-small-text-decoration,
    'text-case': $chirp-typography-price-small-text-case
  ),
  'price-medium': (
    'font-family': $chirp-typography-price-medium-font-family,
    'font-weight': $chirp-typography-price-medium-font-weight,
    'line-height': $chirp-typography-price-medium-line-height,
    'font-size': $chirp-typography-price-medium-font-size,
    'letter-spacing': $chirp-typography-price-medium-letter-spacing,
    'text-decoration': $chirp-typography-price-medium-text-decoration,
    'text-case': $chirp-typography-price-medium-text-case
  ),
  'price-large': (
    'font-family': $chirp-typography-price-large-font-family,
    'font-weight': $chirp-typography-price-large-font-weight,
    'line-height': $chirp-typography-price-large-line-height,
    'font-size': $chirp-typography-price-large-font-size,
    'letter-spacing': $chirp-typography-price-large-letter-spacing,
    'text-decoration': $chirp-typography-price-large-text-decoration,
    'text-case': $chirp-typography-price-large-text-case
  ),
  'price-x-large': (
    'font-family': $chirp-typography-price-x-large-font-family,
    'font-weight': $chirp-typography-price-x-large-font-weight,
    'line-height': $chirp-typography-price-x-large-line-height,
    'font-size': $chirp-typography-price-x-large-font-size,
    'letter-spacing': $chirp-typography-price-x-large-letter-spacing,
    'text-decoration': $chirp-typography-price-x-large-text-decoration,
    'text-case': $chirp-typography-price-x-large-text-case
  ),
  'price-x-small-strikethrough': (
    'font-family': $chirp-typography-price-x-small-strikethrough-font-family,
    'font-weight': $chirp-typography-price-x-small-strikethrough-font-weight,
    'line-height': $chirp-typography-price-x-small-strikethrough-line-height,
    'font-size': $chirp-typography-price-x-small-strikethrough-font-size,
    'letter-spacing': $chirp-typography-price-x-small-strikethrough-letter-spacing,
    'text-decoration': $chirp-typography-price-x-small-strikethrough-text-decoration,
    'text-case': $chirp-typography-price-x-small-strikethrough-text-case
  ),
  'price-small-strikethrough': (
    'font-family': $chirp-typography-price-small-strikethrough-font-family,
    'font-weight': $chirp-typography-price-small-strikethrough-font-weight,
    'line-height': $chirp-typography-price-small-strikethrough-line-height,
    'font-size': $chirp-typography-price-small-strikethrough-font-size,
    'letter-spacing': $chirp-typography-price-small-strikethrough-letter-spacing,
    'text-decoration': $chirp-typography-price-small-strikethrough-text-decoration,
    'text-case': $chirp-typography-price-small-strikethrough-text-case
  )
);

Description

Modified 'scss/map-deep' template to output custom properties for properties that have references

$chirp-typography-utility-small-text-case: none !default;

Description

Sass variables

$chirp-typography: (
  'display-typeface': $chirp-typography-display-typeface,
  'text-typeface': $chirp-typography-text-typeface,
  'ls-standard': $chirp-typography-ls-standard,
  'ls-loose': $chirp-typography-ls-loose,
  'ls-wide': $chirp-typography-ls-wide,
  'ls-tight': $chirp-typography-ls-tight,
  'weight-normal': $chirp-typography-weight-normal,
  'weight-bold': $chirp-typography-weight-bold,
  'weight-semibold': $chirp-typography-weight-semibold,
  'weight-medium': $chirp-typography-weight-medium,
  'weight-heavy': $chirp-typography-weight-heavy,
  'display-1': (
    'font-family': $chirp-typography-display-1-font-family,
    'font-weight': $chirp-typography-display-1-font-weight,
    'line-height': $chirp-typography-display-1-line-height,
    'letter-spacing': $chirp-typography-display-1-letter-spacing,
    'text-decoration': $chirp-typography-display-1-text-decoration,
    'text-case': $chirp-typography-display-1-text-case,
    'font-size': $chirp-typography-display-1-font-size
  ),
  'display-2': (
    'font-family': $chirp-typography-display-2-font-family,
    'font-weight': $chirp-typography-display-2-font-weight,
    'line-height': $chirp-typography-display-2-line-height,
    'font-size': $chirp-typography-display-2-font-size,
    'letter-spacing': $chirp-typography-display-2-letter-spacing,
    'text-decoration': $chirp-typography-display-2-text-decoration,
    'text-case': $chirp-typography-display-2-text-case
  ),
  'display-3': (
    'font-family': $chirp-typography-display-3-font-family,
    'font-weight': $chirp-typography-display-3-font-weight,
    'line-height': $chirp-typography-display-3-line-height,
    'font-size': $chirp-typography-display-3-font-size,
    'letter-spacing': $chirp-typography-display-3-letter-spacing,
    'text-decoration': $chirp-typography-display-3-text-decoration,
    'text-case': $chirp-typography-display-3-text-case
  ),
  'display-4': (
    'font-family': $chirp-typography-display-4-font-family,
    'font-weight': $chirp-typography-display-4-font-weight,
    'line-height': $chirp-typography-display-4-line-height,
    'font-size': $chirp-typography-display-4-font-size,
    'letter-spacing': $chirp-typography-display-4-letter-spacing,
    'text-decoration': $chirp-typography-display-4-text-decoration,
    'text-case': $chirp-typography-display-4-text-case
  ),
  'display-5': (
    'font-family': $chirp-typography-display-5-font-family,
    'font-weight': $chirp-typography-display-5-font-weight,
    'line-height': $chirp-typography-display-5-line-height,
    'font-size': $chirp-typography-display-5-font-size,
    'letter-spacing': $chirp-typography-display-5-letter-spacing,
    'text-decoration': $chirp-typography-display-5-text-decoration,
    'text-case': $chirp-typography-display-5-text-case
  ),
  'display-6': (
    'font-family': $chirp-typography-display-6-font-family,
    'font-weight': $chirp-typography-display-6-font-weight,
    'line-height': $chirp-typography-display-6-line-height,
    'font-size': $chirp-typography-display-6-font-size,
    'letter-spacing': $chirp-typography-display-6-letter-spacing,
    'text-decoration': $chirp-typography-display-6-text-decoration,
    'text-case': $chirp-typography-display-6-text-case
  ),
  'section-1': (
    'font-family': $chirp-typography-section-1-font-family,
    'font-weight': $chirp-typography-section-1-font-weight,
    'line-height': $chirp-typography-section-1-line-height,
    'font-size': $chirp-typography-section-1-font-size,
    'letter-spacing': $chirp-typography-section-1-letter-spacing,
    'text-decoration': $chirp-typography-section-1-text-decoration,
    'text-case': $chirp-typography-section-1-text-case
  ),
  'section-2': (
    'font-family': $chirp-typography-section-2-font-family,
    'font-weight': $chirp-typography-section-2-font-weight,
    'line-height': $chirp-typography-section-2-line-height,
    'font-size': $chirp-typography-section-2-font-size,
    'letter-spacing': $chirp-typography-section-2-letter-spacing,
    'text-decoration': $chirp-typography-section-2-text-decoration,
    'text-case': $chirp-typography-section-2-text-case
  ),
  'section-3': (
    'font-family': $chirp-typography-section-3-font-family,
    'font-weight': $chirp-typography-section-3-font-weight,
    'line-height': $chirp-typography-section-3-line-height,
    'font-size': $chirp-typography-section-3-font-size,
    'letter-spacing': $chirp-typography-section-3-letter-spacing,
    'text-decoration': $chirp-typography-section-3-text-decoration,
    'text-case': $chirp-typography-section-3-text-case
  ),
  'editorial-p-1': (
    'font-family': $chirp-typography-editorial-p-1-font-family,
    'font-weight': $chirp-typography-editorial-p-1-font-weight,
    'line-height': $chirp-typography-editorial-p-1-line-height,
    'font-size': $chirp-typography-editorial-p-1-font-size,
    'letter-spacing': $chirp-typography-editorial-p-1-letter-spacing,
    'text-decoration': $chirp-typography-editorial-p-1-text-decoration,
    'text-case': $chirp-typography-editorial-p-1-text-case
  ),
  'editorial-p-2': (
    'font-family': $chirp-typography-editorial-p-2-font-family,
    'font-weight': $chirp-typography-editorial-p-2-font-weight,
    'line-height': $chirp-typography-editorial-p-2-line-height,
    'font-size': $chirp-typography-editorial-p-2-font-size,
    'letter-spacing': $chirp-typography-editorial-p-2-letter-spacing,
    'text-decoration': $chirp-typography-editorial-p-2-text-decoration,
    'text-case': $chirp-typography-editorial-p-2-text-case
  ),
  'paragraph-1': (
    'font-family': $chirp-typography-paragraph-1-font-family,
    'font-weight': $chirp-typography-paragraph-1-font-weight,
    'line-height': $chirp-typography-paragraph-1-line-height,
    'font-size': $chirp-typography-paragraph-1-font-size,
    'letter-spacing': $chirp-typography-paragraph-1-letter-spacing,
    'text-decoration': $chirp-typography-paragraph-1-text-decoration,
    'text-case': $chirp-typography-paragraph-1-text-case
  ),
  'paragraph-2': (
    'font-family': $chirp-typography-paragraph-2-font-family,
    'font-weight': $chirp-typography-paragraph-2-font-weight,
    'line-height': $chirp-typography-paragraph-2-line-height,
    'font-size': $chirp-typography-paragraph-2-font-size,
    'letter-spacing': $chirp-typography-paragraph-2-letter-spacing,
    'text-decoration': $chirp-typography-paragraph-2-text-decoration,
    'text-case': $chirp-typography-paragraph-2-text-case
  ),
  'caption': (
    'font-family': $chirp-typography-caption-font-family,
    'font-weight': $chirp-typography-caption-font-weight,
    'line-height': $chirp-typography-caption-line-height,
    'font-size': $chirp-typography-caption-font-size,
    'letter-spacing': $chirp-typography-caption-letter-spacing,
    'text-decoration': $chirp-typography-caption-text-decoration,
    'text-case': $chirp-typography-caption-text-case
  ),
  'button': (
    'font-family': $chirp-typography-button-font-family,
    'font-weight': $chirp-typography-button-font-weight,
    'line-height': $chirp-typography-button-line-height,
    'font-size': $chirp-typography-button-font-size,
    'letter-spacing': $chirp-typography-button-letter-spacing,
    'text-decoration': $chirp-typography-button-text-decoration,
    'text-case': $chirp-typography-button-text-case
  ),
  'button-medium': (
    'font-family': $chirp-typography-button-medium-font-family,
    'font-weight': $chirp-typography-button-medium-font-weight,
    'line-height': $chirp-typography-button-medium-line-height,
    'font-size': $chirp-typography-button-medium-font-size,
    'letter-spacing': $chirp-typography-button-medium-letter-spacing,
    'text-decoration': $chirp-typography-button-medium-text-decoration,
    'text-case': $chirp-typography-button-medium-text-case
  ),
  'overline': (
    'font-family': $chirp-typography-overline-font-family,
    'font-weight': $chirp-typography-overline-font-weight,
    'line-height': $chirp-typography-overline-line-height,
    'font-size': $chirp-typography-overline-font-size,
    'letter-spacing': $chirp-typography-overline-letter-spacing,
    'text-decoration': $chirp-typography-overline-text-decoration,
    'text-case': $chirp-typography-overline-text-case
  ),
  'form-grouping': (
    'font-family': $chirp-typography-form-grouping-font-family,
    'font-weight': $chirp-typography-form-grouping-font-weight,
    'line-height': $chirp-typography-form-grouping-line-height,
    'font-size': $chirp-typography-form-grouping-font-size,
    'letter-spacing': $chirp-typography-form-grouping-letter-spacing,
    'text-decoration': $chirp-typography-form-grouping-text-decoration,
    'text-case': $chirp-typography-form-grouping-text-case
  ),
  'form-label': (
    'font-family': $chirp-typography-form-label-font-family,
    'font-weight': $chirp-typography-form-label-font-weight,
    'line-height': $chirp-typography-form-label-line-height,
    'font-size': $chirp-typography-form-label-font-size,
    'letter-spacing': $chirp-typography-form-label-letter-spacing,
    'text-decoration': $chirp-typography-form-label-text-decoration,
    'text-case': $chirp-typography-form-label-text-case
  ),
  'form-dropdown-header': (
    'font-family': $chirp-typography-form-dropdown-header-font-family,
    'font-weight': $chirp-typography-form-dropdown-header-font-weight,
    'line-height': $chirp-typography-form-dropdown-header-line-height,
    'font-size': $chirp-typography-form-dropdown-header-font-size,
    'letter-spacing': $chirp-typography-form-dropdown-header-letter-spacing,
    'text-decoration': $chirp-typography-form-dropdown-header-text-decoration,
    'text-case': $chirp-typography-form-dropdown-header-text-case,
    'font-style': $chirp-typography-form-dropdown-header-font-style
  ),
  'form-text': (
    'font-family': $chirp-typography-form-text-font-family,
    'font-weight': $chirp-typography-form-text-font-weight,
    'line-height': $chirp-typography-form-text-line-height,
    'font-size': $chirp-typography-form-text-font-size,
    'letter-spacing': $chirp-typography-form-text-letter-spacing,
    'text-decoration': $chirp-typography-form-text-text-decoration,
    'text-case': $chirp-typography-form-text-text-case
  ),
  'form-helper': (
    'font-family': $chirp-typography-form-helper-font-family,
    'font-weight': $chirp-typography-form-helper-font-weight,
    'line-height': $chirp-typography-form-helper-line-height,
    'font-size': $chirp-typography-form-helper-font-size,
    'letter-spacing': $chirp-typography-form-helper-letter-spacing,
    'text-decoration': $chirp-typography-form-helper-text-decoration,
    'text-case': $chirp-typography-form-helper-text-case
  ),
  'form-error': (
    'font-family': $chirp-typography-form-error-font-family,
    'font-weight': $chirp-typography-form-error-font-weight,
    'line-height': $chirp-typography-form-error-line-height,
    'font-size': $chirp-typography-form-error-font-size,
    'letter-spacing': $chirp-typography-form-error-letter-spacing,
    'text-decoration': $chirp-typography-form-error-text-decoration,
    'text-case': $chirp-typography-form-error-text-case
  ),
  'utility': (
    'font-family': $chirp-typography-utility-font-family,
    'font-weight': $chirp-typography-utility-font-weight,
    'line-height': $chirp-typography-utility-line-height,
    'font-size': $chirp-typography-utility-font-size,
    'letter-spacing': $chirp-typography-utility-letter-spacing,
    'text-decoration': $chirp-typography-utility-text-decoration,
    'text-case': $chirp-typography-utility-text-case
  ),
  'utility-small': (
    'font-family': $chirp-typography-utility-small-font-family,
    'font-weight': $chirp-typography-utility-small-font-weight,
    'line-height': $chirp-typography-utility-small-line-height,
    'font-size': $chirp-typography-utility-small-font-size,
    'letter-spacing': $chirp-typography-utility-small-letter-spacing,
    'text-decoration': $chirp-typography-utility-small-text-decoration,
    'text-case': $chirp-typography-utility-small-text-case
  )
);

Description

Modified 'scss/map-deep' template to output custom properties for properties that have references

$chirp-typography-deprecated-hero-4-alternate-text-case: none !default;

Description

Sass variables

$chirp-typography: (
  'display-typeface': $chirp-typography-display-typeface,
  'text-typeface': $chirp-typography-text-typeface,
  'ls-standard': $chirp-typography-ls-standard,
  'ls-loose': $chirp-typography-ls-loose,
  'ls-wide': $chirp-typography-ls-wide,
  'ls-tight': $chirp-typography-ls-tight,
  'weight-normal': $chirp-typography-weight-normal,
  'weight-bold': $chirp-typography-weight-bold,
  'weight-semibold': $chirp-typography-weight-semibold,
  'weight-medium': $chirp-typography-weight-medium,
  'weight-heavy': $chirp-typography-weight-heavy,
  'display-1': (
    'font-family': $chirp-typography-display-1-font-family,
    'font-weight': $chirp-typography-display-1-font-weight,
    'line-height': $chirp-typography-display-1-line-height,
    'font-size': $chirp-typography-display-1-font-size,
    'letter-spacing': $chirp-typography-display-1-letter-spacing,
    'text-decoration': $chirp-typography-display-1-text-decoration,
    'text-case': $chirp-typography-display-1-text-case
  ),
  'display-2': (
    'font-family': $chirp-typography-display-2-font-family,
    'font-weight': $chirp-typography-display-2-font-weight,
    'line-height': $chirp-typography-display-2-line-height,
    'font-size': $chirp-typography-display-2-font-size,
    'letter-spacing': $chirp-typography-display-2-letter-spacing,
    'text-decoration': $chirp-typography-display-2-text-decoration,
    'text-case': $chirp-typography-display-2-text-case
  ),
  'display-3': (
    'font-family': $chirp-typography-display-3-font-family,
    'font-weight': $chirp-typography-display-3-font-weight,
    'line-height': $chirp-typography-display-3-line-height,
    'font-size': $chirp-typography-display-3-font-size,
    'letter-spacing': $chirp-typography-display-3-letter-spacing,
    'text-decoration': $chirp-typography-display-3-text-decoration,
    'text-case': $chirp-typography-display-3-text-case
  ),
  'display-4': (
    'font-family': $chirp-typography-display-4-font-family,
    'font-weight': $chirp-typography-display-4-font-weight,
    'line-height': $chirp-typography-display-4-line-height,
    'font-size': $chirp-typography-display-4-font-size,
    'letter-spacing': $chirp-typography-display-4-letter-spacing,
    'text-decoration': $chirp-typography-display-4-text-decoration,
    'text-case': $chirp-typography-display-4-text-case
  ),
  'display-5': (
    'font-family': $chirp-typography-display-5-font-family,
    'font-weight': $chirp-typography-display-5-font-weight,
    'line-height': $chirp-typography-display-5-line-height,
    'font-size': $chirp-typography-display-5-font-size,
    'letter-spacing': $chirp-typography-display-5-letter-spacing,
    'text-decoration': $chirp-typography-display-5-text-decoration,
    'text-case': $chirp-typography-display-5-text-case
  ),
  'display-6': (
    'font-family': $chirp-typography-display-6-font-family,
    'font-weight': $chirp-typography-display-6-font-weight,
    'line-height': $chirp-typography-display-6-line-height,
    'font-size': $chirp-typography-display-6-font-size,
    'letter-spacing': $chirp-typography-display-6-letter-spacing,
    'text-decoration': $chirp-typography-display-6-text-decoration,
    'text-case': $chirp-typography-display-6-text-case
  ),
  'section-1': (
    'font-family': $chirp-typography-section-1-font-family,
    'font-weight': $chirp-typography-section-1-font-weight,
    'line-height': $chirp-typography-section-1-line-height,
    'font-size': $chirp-typography-section-1-font-size,
    'letter-spacing': $chirp-typography-section-1-letter-spacing,
    'text-decoration': $chirp-typography-section-1-text-decoration,
    'text-case': $chirp-typography-section-1-text-case
  ),
  'section-2': (
    'font-family': $chirp-typography-section-2-font-family,
    'font-weight': $chirp-typography-section-2-font-weight,
    'line-height': $chirp-typography-section-2-line-height,
    'font-size': $chirp-typography-section-2-font-size,
    'letter-spacing': $chirp-typography-section-2-letter-spacing,
    'text-decoration': $chirp-typography-section-2-text-decoration,
    'text-case': $chirp-typography-section-2-text-case
  ),
  'section-3': (
    'font-family': $chirp-typography-section-3-font-family,
    'font-weight': $chirp-typography-section-3-font-weight,
    'line-height': $chirp-typography-section-3-line-height,
    'font-size': $chirp-typography-section-3-font-size,
    'letter-spacing': $chirp-typography-section-3-letter-spacing,
    'text-decoration': $chirp-typography-section-3-text-decoration,
    'text-case': $chirp-typography-section-3-text-case
  ),
  'editorial-p-1': (
    'font-family': $chirp-typography-editorial-p-1-font-family,
    'font-weight': $chirp-typography-editorial-p-1-font-weight,
    'line-height': $chirp-typography-editorial-p-1-line-height,
    'font-size': $chirp-typography-editorial-p-1-font-size,
    'letter-spacing': $chirp-typography-editorial-p-1-letter-spacing,
    'text-decoration': $chirp-typography-editorial-p-1-text-decoration,
    'text-case': $chirp-typography-editorial-p-1-text-case
  ),
  'editorial-p-2': (
    'font-family': $chirp-typography-editorial-p-2-font-family,
    'font-weight': $chirp-typography-editorial-p-2-font-weight,
    'line-height': $chirp-typography-editorial-p-2-line-height,
    'font-size': $chirp-typography-editorial-p-2-font-size,
    'letter-spacing': $chirp-typography-editorial-p-2-letter-spacing,
    'text-decoration': $chirp-typography-editorial-p-2-text-decoration,
    'text-case': $chirp-typography-editorial-p-2-text-case
  ),
  'paragraph-1': (
    'font-family': $chirp-typography-paragraph-1-font-family,
    'font-weight': $chirp-typography-paragraph-1-font-weight,
    'line-height': $chirp-typography-paragraph-1-line-height,
    'font-size': $chirp-typography-paragraph-1-font-size,
    'letter-spacing': $chirp-typography-paragraph-1-letter-spacing,
    'text-decoration': $chirp-typography-paragraph-1-text-decoration,
    'text-case': $chirp-typography-paragraph-1-text-case
  ),
  'paragraph-2': (
    'font-family': $chirp-typography-paragraph-2-font-family,
    'font-weight': $chirp-typography-paragraph-2-font-weight,
    'line-height': $chirp-typography-paragraph-2-line-height,
    'font-size': $chirp-typography-paragraph-2-font-size,
    'letter-spacing': $chirp-typography-paragraph-2-letter-spacing,
    'text-decoration': $chirp-typography-paragraph-2-text-decoration,
    'text-case': $chirp-typography-paragraph-2-text-case
  ),
  'caption': (
    'font-family': $chirp-typography-caption-font-family,
    'font-weight': $chirp-typography-caption-font-weight,
    'line-height': $chirp-typography-caption-line-height,
    'font-size': $chirp-typography-caption-font-size,
    'letter-spacing': $chirp-typography-caption-letter-spacing,
    'text-decoration': $chirp-typography-caption-text-decoration,
    'text-case': $chirp-typography-caption-text-case
  ),
  'button': (
    'font-family': $chirp-typography-button-font-family,
    'font-weight': $chirp-typography-button-font-weight,
    'line-height': $chirp-typography-button-line-height,
    'font-size': $chirp-typography-button-font-size,
    'letter-spacing': $chirp-typography-button-letter-spacing,
    'text-decoration': $chirp-typography-button-text-decoration,
    'text-case': $chirp-typography-button-text-case
  ),
  'button-medium': (
    'font-family': $chirp-typography-button-medium-font-family,
    'font-weight': $chirp-typography-button-medium-font-weight,
    'line-height': $chirp-typography-button-medium-line-height,
    'font-size': $chirp-typography-button-medium-font-size,
    'letter-spacing': $chirp-typography-button-medium-letter-spacing,
    'text-decoration': $chirp-typography-button-medium-text-decoration,
    'text-case': $chirp-typography-button-medium-text-case
  ),
  'overline': (
    'font-family': $chirp-typography-overline-font-family,
    'font-weight': $chirp-typography-overline-font-weight,
    'line-height': $chirp-typography-overline-line-height,
    'font-size': $chirp-typography-overline-font-size,
    'letter-spacing': $chirp-typography-overline-letter-spacing,
    'text-decoration': $chirp-typography-overline-text-decoration,
    'text-case': $chirp-typography-overline-text-case
  ),
  'form-grouping': (
    'font-family': $chirp-typography-form-grouping-font-family,
    'font-weight': $chirp-typography-form-grouping-font-weight,
    'line-height': $chirp-typography-form-grouping-line-height,
    'font-size': $chirp-typography-form-grouping-font-size,
    'letter-spacing': $chirp-typography-form-grouping-letter-spacing,
    'text-decoration': $chirp-typography-form-grouping-text-decoration,
    'text-case': $chirp-typography-form-grouping-text-case
  ),
  'form-label': (
    'font-family': $chirp-typography-form-label-font-family,
    'font-weight': $chirp-typography-form-label-font-weight,
    'line-height': $chirp-typography-form-label-line-height,
    'font-size': $chirp-typography-form-label-font-size,
    'letter-spacing': $chirp-typography-form-label-letter-spacing,
    'text-decoration': $chirp-typography-form-label-text-decoration,
    'text-case': $chirp-typography-form-label-text-case
  ),
  'form-dropdown-header': (
    'font-family': $chirp-typography-form-dropdown-header-font-family,
    'font-weight': $chirp-typography-form-dropdown-header-font-weight,
    'line-height': $chirp-typography-form-dropdown-header-line-height,
    'font-size': $chirp-typography-form-dropdown-header-font-size,
    'letter-spacing': $chirp-typography-form-dropdown-header-letter-spacing,
    'text-decoration': $chirp-typography-form-dropdown-header-text-decoration,
    'text-case': $chirp-typography-form-dropdown-header-text-case,
    'font-style': $chirp-typography-form-dropdown-header-font-style
  ),
  'form-text': (
    'font-family': $chirp-typography-form-text-font-family,
    'font-weight': $chirp-typography-form-text-font-weight,
    'line-height': $chirp-typography-form-text-line-height,
    'font-size': $chirp-typography-form-text-font-size,
    'letter-spacing': $chirp-typography-form-text-letter-spacing,
    'text-decoration': $chirp-typography-form-text-text-decoration,
    'text-case': $chirp-typography-form-text-text-case
  ),
  'form-helper': (
    'font-family': $chirp-typography-form-helper-font-family,
    'font-weight': $chirp-typography-form-helper-font-weight,
    'line-height': $chirp-typography-form-helper-line-height,
    'font-size': $chirp-typography-form-helper-font-size,
    'letter-spacing': $chirp-typography-form-helper-letter-spacing,
    'text-decoration': $chirp-typography-form-helper-text-decoration,
    'text-case': $chirp-typography-form-helper-text-case
  ),
  'form-error': (
    'font-family': $chirp-typography-form-error-font-family,
    'font-weight': $chirp-typography-form-error-font-weight,
    'line-height': $chirp-typography-form-error-line-height,
    'font-size': $chirp-typography-form-error-font-size,
    'letter-spacing': $chirp-typography-form-error-letter-spacing,
    'text-decoration': $chirp-typography-form-error-text-decoration,
    'text-case': $chirp-typography-form-error-text-case
  ),
  'menu-heading': (
    'font-family': $chirp-typography-menu-heading-font-family,
    'font-weight': $chirp-typography-menu-heading-font-weight,
    'line-height': $chirp-typography-menu-heading-line-height,
    'font-size': $chirp-typography-menu-heading-font-size,
    'letter-spacing': $chirp-typography-menu-heading-letter-spacing,
    'text-decoration': $chirp-typography-menu-heading-text-decoration,
    'text-case': $chirp-typography-menu-heading-text-case
  ),
  'menu-sub-heading': (
    'font-family': $chirp-typography-menu-sub-heading-font-family,
    'font-weight': $chirp-typography-menu-sub-heading-font-weight,
    'font-size': $chirp-typography-menu-sub-heading-font-size,
    'letter-spacing': $chirp-typography-menu-sub-heading-letter-spacing,
    'text-decoration': $chirp-typography-menu-sub-heading-text-decoration,
    'text-case': $chirp-typography-menu-sub-heading-text-case,
    'line-height': $chirp-typography-menu-sub-heading-line-height
  ),
  'menu-text': (
    'font-family': $chirp-typography-menu-text-font-family,
    'font-weight': $chirp-typography-menu-text-font-weight,
    'font-size': $chirp-typography-menu-text-font-size,
    'letter-spacing': $chirp-typography-menu-text-letter-spacing,
    'text-decoration': $chirp-typography-menu-text-text-decoration,
    'text-case': $chirp-typography-menu-text-text-case,
    'line-height': $chirp-typography-menu-text-line-height
  ),
  'utility': (
    'font-family': $chirp-typography-utility-font-family,
    'font-weight': $chirp-typography-utility-font-weight,
    'line-height': $chirp-typography-utility-line-height,
    'font-size': $chirp-typography-utility-font-size,
    'letter-spacing': $chirp-typography-utility-letter-spacing,
    'text-decoration': $chirp-typography-utility-text-decoration,
    'text-case': $chirp-typography-utility-text-case
  ),
  'utility-small': (
    'font-family': $chirp-typography-utility-small-font-family,
    'font-weight': $chirp-typography-utility-small-font-weight,
    'line-height': $chirp-typography-utility-small-line-height,
    'font-size': $chirp-typography-utility-small-font-size,
    'letter-spacing': $chirp-typography-utility-small-letter-spacing,
    'text-decoration': $chirp-typography-utility-small-text-decoration,
    'text-case': $chirp-typography-utility-small-text-case
  ),
  'price-small': (
    'font-family': $chirp-typography-price-small-font-family,
    'font-weight': $chirp-typography-price-small-font-weight,
    'line-height': $chirp-typography-price-small-line-height,
    'font-size': $chirp-typography-price-small-font-size,
    'letter-spacing': $chirp-typography-price-small-letter-spacing,
    'text-decoration': $chirp-typography-price-small-text-decoration,
    'text-case': $chirp-typography-price-small-text-case
  ),
  'price-medium': (
    'font-family': $chirp-typography-price-medium-font-family,
    'font-weight': $chirp-typography-price-medium-font-weight,
    'line-height': $chirp-typography-price-medium-line-height,
    'font-size': $chirp-typography-price-medium-font-size,
    'letter-spacing': $chirp-typography-price-medium-letter-spacing,
    'text-decoration': $chirp-typography-price-medium-text-decoration,
    'text-case': $chirp-typography-price-medium-text-case
  ),
  'price-large': (
    'font-family': $chirp-typography-price-large-font-family,
    'font-weight': $chirp-typography-price-large-font-weight,
    'line-height': $chirp-typography-price-large-line-height,
    'font-size': $chirp-typography-price-large-font-size,
    'letter-spacing': $chirp-typography-price-large-letter-spacing,
    'text-decoration': $chirp-typography-price-large-text-decoration,
    'text-case': $chirp-typography-price-large-text-case
  ),
  'price-x-large': (
    'font-family': $chirp-typography-price-x-large-font-family,
    'font-weight': $chirp-typography-price-x-large-font-weight,
    'line-height': $chirp-typography-price-x-large-line-height,
    'font-size': $chirp-typography-price-x-large-font-size,
    'letter-spacing': $chirp-typography-price-x-large-letter-spacing,
    'text-decoration': $chirp-typography-price-x-large-text-decoration,
    'text-case': $chirp-typography-price-x-large-text-case
  ),
  'price-x-small-strikethrough': (
    'font-family': $chirp-typography-price-x-small-strikethrough-font-family,
    'font-weight': $chirp-typography-price-x-small-strikethrough-font-weight,
    'line-height': $chirp-typography-price-x-small-strikethrough-line-height,
    'font-size': $chirp-typography-price-x-small-strikethrough-font-size,
    'letter-spacing': $chirp-typography-price-x-small-strikethrough-letter-spacing,
    'text-decoration': $chirp-typography-price-x-small-strikethrough-text-decoration,
    'text-case': $chirp-typography-price-x-small-strikethrough-text-case
  ),
  'price-xx-small-strikethrough': (
    'font-family': $chirp-typography-price-xx-small-strikethrough-font-family,
    'font-weight': $chirp-typography-price-xx-small-strikethrough-font-weight,
    'line-height': $chirp-typography-price-xx-small-strikethrough-line-height,
    'font-size': $chirp-typography-price-xx-small-strikethrough-font-size,
    'letter-spacing': $chirp-typography-price-xx-small-strikethrough-letter-spacing,
    'text-decoration': $chirp-typography-price-xx-small-strikethrough-text-decoration,
    'text-case': $chirp-typography-price-xx-small-strikethrough-text-case
  ),
  'price-small-strikethrough': (
    'font-family': $chirp-typography-price-small-strikethrough-font-family,
    'font-weight': $chirp-typography-price-small-strikethrough-font-weight,
    'line-height': $chirp-typography-price-small-strikethrough-line-height,
    'font-size': $chirp-typography-price-small-strikethrough-font-size,
    'letter-spacing': $chirp-typography-price-small-strikethrough-letter-spacing,
    'text-decoration': $chirp-typography-price-small-strikethrough-text-decoration,
    'text-case': $chirp-typography-price-small-strikethrough-text-case
  ),
  'deprecated': (
    'display-1': (
      'font-family': $chirp-typography-deprecated-display-1-font-family,
      'font-weight': $chirp-typography-deprecated-display-1-font-weight,
      'line-height': $chirp-typography-deprecated-display-1-line-height,
      'font-size': $chirp-typography-deprecated-display-1-font-size,
      'letter-spacing': $chirp-typography-deprecated-display-1-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-display-1-text-decoration,
      'text-case': $chirp-typography-deprecated-display-1-text-case
    ),
    'display-2': (
      'font-family': $chirp-typography-deprecated-display-2-font-family,
      'font-weight': $chirp-typography-deprecated-display-2-font-weight,
      'line-height': $chirp-typography-deprecated-display-2-line-height,
      'font-size': $chirp-typography-deprecated-display-2-font-size,
      'letter-spacing': $chirp-typography-deprecated-display-2-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-display-2-text-decoration,
      'text-case': $chirp-typography-deprecated-display-2-text-case
    ),
    'display-3': (
      'font-family': $chirp-typography-deprecated-display-3-font-family,
      'font-weight': $chirp-typography-deprecated-display-3-font-weight,
      'line-height': $chirp-typography-deprecated-display-3-line-height,
      'font-size': $chirp-typography-deprecated-display-3-font-size,
      'letter-spacing': $chirp-typography-deprecated-display-3-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-display-3-text-decoration,
      'text-case': $chirp-typography-deprecated-display-3-text-case
    ),
    'display-4': (
      'font-family': $chirp-typography-deprecated-display-4-font-family,
      'font-weight': $chirp-typography-deprecated-display-4-font-weight,
      'line-height': $chirp-typography-deprecated-display-4-line-height,
      'font-size': $chirp-typography-deprecated-display-4-font-size,
      'letter-spacing': $chirp-typography-deprecated-display-4-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-display-4-text-decoration,
      'text-case': $chirp-typography-deprecated-display-4-text-case
    ),
    'display-5': (
      'font-family': $chirp-typography-deprecated-display-5-font-family,
      'font-weight': $chirp-typography-deprecated-display-5-font-weight,
      'line-height': $chirp-typography-deprecated-display-5-line-height,
      'font-size': $chirp-typography-deprecated-display-5-font-size,
      'letter-spacing': $chirp-typography-deprecated-display-5-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-display-5-text-decoration,
      'text-case': $chirp-typography-deprecated-display-5-text-case
    ),
    'display-6': (
      'font-family': $chirp-typography-deprecated-display-6-font-family,
      'font-weight': $chirp-typography-deprecated-display-6-font-weight,
      'line-height': $chirp-typography-deprecated-display-6-line-height,
      'font-size': $chirp-typography-deprecated-display-6-font-size,
      'letter-spacing': $chirp-typography-deprecated-display-6-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-display-6-text-decoration,
      'text-case': $chirp-typography-deprecated-display-6-text-case
    ),
    'section-1': (
      'font-family': $chirp-typography-deprecated-section-1-font-family,
      'font-weight': $chirp-typography-deprecated-section-1-font-weight,
      'line-height': $chirp-typography-deprecated-section-1-line-height,
      'font-size': $chirp-typography-deprecated-section-1-font-size,
      'letter-spacing': $chirp-typography-deprecated-section-1-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-section-1-text-decoration,
      'text-case': $chirp-typography-deprecated-section-1-text-case
    ),
    'section-2': (
      'font-family': $chirp-typography-deprecated-section-2-font-family,
      'font-weight': $chirp-typography-deprecated-section-2-font-weight,
      'line-height': $chirp-typography-deprecated-section-2-line-height,
      'font-size': $chirp-typography-deprecated-section-2-font-size,
      'letter-spacing': $chirp-typography-deprecated-section-2-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-section-2-text-decoration,
      'text-case': $chirp-typography-deprecated-section-2-text-case
    ),
    'paragraph-1': (
      'font-family': $chirp-typography-deprecated-paragraph-1-font-family,
      'font-weight': $chirp-typography-deprecated-paragraph-1-font-weight,
      'line-height': $chirp-typography-deprecated-paragraph-1-line-height,
      'font-size': $chirp-typography-deprecated-paragraph-1-font-size,
      'letter-spacing': $chirp-typography-deprecated-paragraph-1-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-paragraph-1-text-decoration,
      'text-case': $chirp-typography-deprecated-paragraph-1-text-case
    ),
    'paragraph-2': (
      'font-family': $chirp-typography-deprecated-paragraph-2-font-family,
      'font-weight': $chirp-typography-deprecated-paragraph-2-font-weight,
      'line-height': $chirp-typography-deprecated-paragraph-2-line-height,
      'font-size': $chirp-typography-deprecated-paragraph-2-font-size,
      'letter-spacing': $chirp-typography-deprecated-paragraph-2-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-paragraph-2-text-decoration,
      'text-case': $chirp-typography-deprecated-paragraph-2-text-case
    ),
    'caption': (
      'font-family': $chirp-typography-deprecated-caption-font-family,
      'font-weight': $chirp-typography-deprecated-caption-font-weight,
      'line-height': $chirp-typography-deprecated-caption-line-height,
      'font-size': $chirp-typography-deprecated-caption-font-size,
      'letter-spacing': $chirp-typography-deprecated-caption-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-caption-text-decoration,
      'text-case': $chirp-typography-deprecated-caption-text-case
    ),
    'button': (
      'font-family': $chirp-typography-deprecated-button-font-family,
      'font-weight': $chirp-typography-deprecated-button-font-weight,
      'line-height': $chirp-typography-deprecated-button-line-height,
      'font-size': $chirp-typography-deprecated-button-font-size,
      'letter-spacing': $chirp-typography-deprecated-button-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-button-text-decoration,
      'text-case': $chirp-typography-deprecated-button-text-case
    ),
    'overline': (
      'font-family': $chirp-typography-deprecated-overline-font-family,
      'font-weight': $chirp-typography-deprecated-overline-font-weight,
      'line-height': $chirp-typography-deprecated-overline-line-height,
      'font-size': $chirp-typography-deprecated-overline-font-size,
      'letter-spacing': $chirp-typography-deprecated-overline-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-overline-text-decoration,
      'text-case': $chirp-typography-deprecated-overline-text-case
    ),
    'hero-1': (
      'font-family': $chirp-typography-deprecated-hero-1-font-family,
      'font-weight': $chirp-typography-deprecated-hero-1-font-weight,
      'line-height': $chirp-typography-deprecated-hero-1-line-height,
      'font-size': $chirp-typography-deprecated-hero-1-font-size,
      'letter-spacing': $chirp-typography-deprecated-hero-1-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-hero-1-text-decoration,
      'text-case': $chirp-typography-deprecated-hero-1-text-case
    ),
    'hero-2': (
      'font-family': $chirp-typography-deprecated-hero-2-font-family,
      'font-weight': $chirp-typography-deprecated-hero-2-font-weight,
      'line-height': $chirp-typography-deprecated-hero-2-line-height,
      'font-size': $chirp-typography-deprecated-hero-2-font-size,
      'letter-spacing': $chirp-typography-deprecated-hero-2-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-hero-2-text-decoration,
      'text-case': $chirp-typography-deprecated-hero-2-text-case
    ),
    'hero-3': (
      'font-family': $chirp-typography-deprecated-hero-3-font-family,
      'font-weight': $chirp-typography-deprecated-hero-3-font-weight,
      'line-height': $chirp-typography-deprecated-hero-3-line-height,
      'font-size': $chirp-typography-deprecated-hero-3-font-size,
      'letter-spacing': $chirp-typography-deprecated-hero-3-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-hero-3-text-decoration,
      'text-case': $chirp-typography-deprecated-hero-3-text-case
    ),
    'hero-4': (
      'font-family': $chirp-typography-deprecated-hero-4-font-family,
      'font-weight': $chirp-typography-deprecated-hero-4-font-weight,
      'line-height': $chirp-typography-deprecated-hero-4-line-height,
      'font-size': $chirp-typography-deprecated-hero-4-font-size,
      'letter-spacing': $chirp-typography-deprecated-hero-4-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-hero-4-text-decoration,
      'text-case': $chirp-typography-deprecated-hero-4-text-case
    ),
    'hero-1-alternate': (
      'font-family': $chirp-typography-deprecated-hero-1-alternate-font-family,
      'font-weight': $chirp-typography-deprecated-hero-1-alternate-font-weight,
      'line-height': $chirp-typography-deprecated-hero-1-alternate-line-height,
      'font-size': $chirp-typography-deprecated-hero-1-alternate-font-size,
      'letter-spacing': $chirp-typography-deprecated-hero-1-alternate-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-hero-1-alternate-text-decoration,
      'text-case': $chirp-typography-deprecated-hero-1-alternate-text-case
    ),
    'hero-2-alternate': (
      'font-family': $chirp-typography-deprecated-hero-2-alternate-font-family,
      'font-weight': $chirp-typography-deprecated-hero-2-alternate-font-weight,
      'line-height': $chirp-typography-deprecated-hero-2-alternate-line-height,
      'font-size': $chirp-typography-deprecated-hero-2-alternate-font-size,
      'letter-spacing': $chirp-typography-deprecated-hero-2-alternate-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-hero-2-alternate-text-decoration,
      'text-case': $chirp-typography-deprecated-hero-2-alternate-text-case
    ),
    'hero-3-alternate': (
      'font-family': $chirp-typography-deprecated-hero-3-alternate-font-family,
      'font-weight': $chirp-typography-deprecated-hero-3-alternate-font-weight,
      'line-height': $chirp-typography-deprecated-hero-3-alternate-line-height,
      'font-size': $chirp-typography-deprecated-hero-3-alternate-font-size,
      'letter-spacing': $chirp-typography-deprecated-hero-3-alternate-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-hero-3-alternate-text-decoration,
      'text-case': $chirp-typography-deprecated-hero-3-alternate-text-case
    ),
    'hero-4-alternate': (
      'font-family': $chirp-typography-deprecated-hero-4-alternate-font-family,
      'font-weight': $chirp-typography-deprecated-hero-4-alternate-font-weight,
      'line-height': $chirp-typography-deprecated-hero-4-alternate-line-height,
      'font-size': $chirp-typography-deprecated-hero-4-alternate-font-size,
      'letter-spacing': $chirp-typography-deprecated-hero-4-alternate-letter-spacing,
      'text-decoration': $chirp-typography-deprecated-hero-4-alternate-text-decoration,
      'text-case': $chirp-typography-deprecated-hero-4-alternate-text-case
    )
  )
);

Description

Modified 'scss/map-deep' template to output custom properties for properties that have references

Mixins

@mixin custom-properties($deprecated) { ... }@mixin custom-properties($deprecated) { 
  --chirp-typography-price-small-strikethrough-text-case: none;
  --chirp-typography-price-small-strikethrough-text-decoration: line-through;
  --chirp-typography-price-small-strikethrough-font-size: 1.6rem;
  --chirp-typography-price-small-strikethrough-line-height: 1.25;
  --chirp-typography-price-x-small-strikethrough-text-case: none;
  --chirp-typography-price-x-small-strikethrough-text-decoration: line-through;
  --chirp-typography-price-x-small-strikethrough-font-size: 1.4rem;
  --chirp-typography-price-x-small-strikethrough-line-height: 1.29;
  --chirp-typography-price-x-large-text-case: none;
  --chirp-typography-price-x-large-text-decoration: none;
  --chirp-typography-price-x-large-font-size: 2.4rem;
  --chirp-typography-price-x-large-line-height: 1.17;
  --chirp-typography-price-large-text-case: none;
  --chirp-typography-price-large-text-decoration: none;
  --chirp-typography-price-large-font-size: 2rem;
  --chirp-typography-price-large-line-height: 1.20;
  --chirp-typography-price-medium-text-case: none;
  --chirp-typography-price-medium-text-decoration: none;
  --chirp-typography-price-medium-font-size: 1.8rem;
  --chirp-typography-price-medium-line-height: 1.22;
  --chirp-typography-price-small-text-case: none;
  --chirp-typography-price-small-text-decoration: none;
  --chirp-typography-price-small-font-size: 1.6rem;
  --chirp-typography-price-small-line-height: 1.25;
  --chirp-typography-price-x-small-text-case: none;
  --chirp-typography-price-x-small-text-decoration: none;
  --chirp-typography-price-x-small-font-size: 1.4rem;
  --chirp-typography-price-x-small-line-height: 1.29;
  --chirp-typography-utility-small-text-case: none;
  --chirp-typography-utility-small-text-decoration: none;
  --chirp-typography-utility-small-font-size: 1.2rem;
  --chirp-typography-utility-small-line-height: 1.50;
  --chirp-typography-utility-text-case: none;
  --chirp-typography-utility-text-decoration: none;
  --chirp-typography-utility-font-size: 1.4rem;
  --chirp-typography-utility-line-height: 1.43;
  --chirp-typography-form-error-text-case: none;
  --chirp-typography-form-error-text-decoration: none;
  --chirp-typography-form-error-font-size: 1.2rem;
  --chirp-typography-form-error-line-height: 1.33;
  --chirp-typography-form-helper-text-case: none;
  --chirp-typography-form-helper-text-decoration: none;
  --chirp-typography-form-helper-font-size: 1.2rem;
  --chirp-typography-form-helper-line-height: 1.33;
  --chirp-typography-form-text-text-case: none;
  --chirp-typography-form-text-text-decoration: none;
  --chirp-typography-form-text-font-size: 1.4rem;
  --chirp-typography-form-text-line-height: 1.43;
  --chirp-typography-form-dropdown-header-font-style: italic;
  --chirp-typography-form-dropdown-header-text-case: none;
  --chirp-typography-form-dropdown-header-text-decoration: none;
  --chirp-typography-form-dropdown-header-font-size: 1.2rem;
  --chirp-typography-form-dropdown-header-line-height: 1.33;
  --chirp-typography-form-label-text-case: none;
  --chirp-typography-form-label-text-decoration: none;
  --chirp-typography-form-label-font-size: 1.4rem;
  --chirp-typography-form-label-line-height: 1.14;
  --chirp-typography-form-grouping-text-case: none;
  --chirp-typography-form-grouping-text-decoration: none;
  --chirp-typography-form-grouping-font-size: 1.6rem;
  --chirp-typography-form-grouping-line-height: 1.13;
  --chirp-typography-overline-text-case: uppercase;
  --chirp-typography-overline-text-decoration: none;
  --chirp-typography-overline-font-size: 1.2rem;
  --chirp-typography-overline-line-height: 1.50;
  --chirp-typography-button-medium-text-case: none;
  --chirp-typography-button-medium-text-decoration: none;
  --chirp-typography-button-medium-font-size: 1.4rem;
  --chirp-typography-button-medium-line-height: 1.43;
  --chirp-typography-button-text-case: none;
  --chirp-typography-button-text-decoration: none;
  --chirp-typography-button-font-size: 1.6rem;
  --chirp-typography-button-line-height: 1.50;
  --chirp-typography-caption-text-case: none;
  --chirp-typography-caption-text-decoration: none;
  --chirp-typography-caption-font-size: 1.2rem;
  --chirp-typography-caption-line-height: 1.50;
  --chirp-typography-paragraph-2-text-case: none;
  --chirp-typography-paragraph-2-text-decoration: none;
  --chirp-typography-paragraph-2-font-size: 1.4rem;
  --chirp-typography-paragraph-2-line-height: 1.43;
  --chirp-typography-paragraph-1-text-case: none;
  --chirp-typography-paragraph-1-text-decoration: none;
  --chirp-typography-paragraph-1-font-size: 1.6rem;
  --chirp-typography-paragraph-1-line-height: 1.38;
  --chirp-typography-section-3-text-case: none;
  --chirp-typography-section-3-text-decoration: none;
  --chirp-typography-section-3-font-size: 1.4rem;
  --chirp-typography-section-3-line-height: 1.43;
  --chirp-typography-section-2-text-case: none;
  --chirp-typography-section-2-text-decoration: none;
  --chirp-typography-section-2-font-size: 1.6rem;
  --chirp-typography-section-2-line-height: 1.50;
  --chirp-typography-section-1-text-case: none;
  --chirp-typography-section-1-text-decoration: none;
  --chirp-typography-section-1-font-size: 1.8rem;
  --chirp-typography-section-1-line-height: 1.56;
  --chirp-typography-display-6-text-case: none;
  --chirp-typography-display-6-text-decoration: none;
  --chirp-typography-display-6-font-size: 1.4rem;
  --chirp-typography-display-6-line-height: 1.43;
  --chirp-typography-display-5-text-case: none;
  --chirp-typography-display-5-text-decoration: none;
  --chirp-typography-display-5-font-size: 1.6rem;
  --chirp-typography-display-5-line-height: 1.38;
  --chirp-typography-display-4-text-case: none;
  --chirp-typography-display-4-text-decoration: none;
  --chirp-typography-display-4-font-size: 1.8rem;
  --chirp-typography-display-4-line-height: 1.56;
  --chirp-typography-display-3-text-case: none;
  --chirp-typography-display-3-text-decoration: none;
  --chirp-typography-display-3-font-size: 2rem;
  --chirp-typography-display-3-line-height: 1.50;
  --chirp-typography-display-2-text-case: none;
  --chirp-typography-display-2-text-decoration: none;
  --chirp-typography-display-2-font-size: 2.4rem;
  --chirp-typography-display-2-line-height: 1.42;
  --chirp-typography-display-1-text-case: none;
  --chirp-typography-display-1-text-decoration: none;
  --chirp-typography-display-1-font-size: 3.2rem;
  --chirp-typography-display-1-line-height: 1.31;
  --chirp-typography-weight-heavy: 800;
  --chirp-typography-weight-medium: 500;
  --chirp-typography-weight-semibold: 600;
  --chirp-typography-weight-bold: 700;
  --chirp-typography-weight-normal: 400;
  --chirp-typography-ls-tight: -0.03em;
  --chirp-typography-ls-wide: 0.16em;
  --chirp-typography-ls-loose: 0.01em;
  --chirp-typography-ls-standard: 0;
  --chirp-typography-text-typeface: Roboto, Verdana, 'Lucida Sans', 'Helvetica Neue', Arial, Roboto, sans-serif;
  --chirp-typography-display-typeface: Roboto, Verdana, 'Lucida Sans', 'Helvetica Neue', Arial, Roboto, sans-serif;
  --chirp-typography-price-small-strikethrough-letter-spacing: 0;
  --chirp-typography-price-small-strikethrough-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-price-small-strikethrough-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-x-small-strikethrough-letter-spacing: 0;
  --chirp-typography-price-x-small-strikethrough-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-price-x-small-strikethrough-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-x-large-letter-spacing: 0;
  --chirp-typography-price-x-large-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-price-x-large-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-large-letter-spacing: 0;
  --chirp-typography-price-large-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-price-large-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-medium-letter-spacing: 0;
  --chirp-typography-price-medium-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-price-medium-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-small-letter-spacing: 0;
  --chirp-typography-price-small-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-price-small-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-x-small-letter-spacing: 0;
  --chirp-typography-price-x-small-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-price-x-small-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-utility-small-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-utility-small-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-utility-small-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-utility-letter-spacing: 0;
  --chirp-typography-utility-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-utility-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-error-letter-spacing: 0;
  --chirp-typography-form-error-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-form-error-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-helper-letter-spacing: 0;
  --chirp-typography-form-helper-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-form-helper-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-text-letter-spacing: 0;
  --chirp-typography-form-text-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-form-text-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-dropdown-header-letter-spacing: 0;
  --chirp-typography-form-dropdown-header-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-form-dropdown-header-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-label-letter-spacing: 0;
  --chirp-typography-form-label-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-form-label-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-grouping-letter-spacing: 0;
  --chirp-typography-form-grouping-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-form-grouping-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-overline-letter-spacing: var(--chirp-typography-ls-wide);
  --chirp-typography-overline-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-overline-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-button-medium-letter-spacing: 0;
  --chirp-typography-button-medium-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-button-medium-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-button-letter-spacing: 0;
  --chirp-typography-button-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-button-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-caption-letter-spacing: 0;
  --chirp-typography-caption-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-caption-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-paragraph-2-letter-spacing: 0;
  --chirp-typography-paragraph-2-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-paragraph-2-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-paragraph-1-letter-spacing: 0;
  --chirp-typography-paragraph-1-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-paragraph-1-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-section-3-letter-spacing: 0;
  --chirp-typography-section-3-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-section-3-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-section-2-letter-spacing: 0;
  --chirp-typography-section-2-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-section-2-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-section-1-letter-spacing: 0;
  --chirp-typography-section-1-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-section-1-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-6-letter-spacing: 0;
  --chirp-typography-display-6-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-6-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-5-letter-spacing: 0;
  --chirp-typography-display-5-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-5-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-4-letter-spacing: 0;
  --chirp-typography-display-4-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-4-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-3-letter-spacing: 0;
  --chirp-typography-display-3-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-3-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-2-letter-spacing: 0;
  --chirp-typography-display-2-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-2-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-1-letter-spacing: 0;
  --chirp-typography-display-1-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-1-font-family: var(--chirp-typography-display-typeface);

  @if $deprecated {

  }
 }

Description

Mixin to output CSS custom properties for this token set

Parameters

Parameters
parameter Name	parameter Description	parameter Type	parameter Default value
`$deprecated`	include deprecated tokens in the output	`Boolean`	— none

@mixin custom-properties($deprecated) { ... }@mixin custom-properties($deprecated) { 
  --chirp-typography-price-small-strikethrough-text-case: none;
  --chirp-typography-price-small-strikethrough-text-decoration: line-through;
  --chirp-typography-price-small-strikethrough-font-size: 1.6rem;
  --chirp-typography-price-small-strikethrough-line-height: 1.25;
  --chirp-typography-price-x-small-strikethrough-text-case: none;
  --chirp-typography-price-x-small-strikethrough-text-decoration: line-through;
  --chirp-typography-price-x-small-strikethrough-font-size: 1.4rem;
  --chirp-typography-price-x-small-strikethrough-line-height: 1.29;
  --chirp-typography-price-x-large-text-case: none;
  --chirp-typography-price-x-large-text-decoration: none;
  --chirp-typography-price-x-large-font-size: 2.4rem;
  --chirp-typography-price-x-large-line-height: 1.17;
  --chirp-typography-price-large-text-case: none;
  --chirp-typography-price-large-text-decoration: none;
  --chirp-typography-price-large-font-size: 2rem;
  --chirp-typography-price-large-line-height: 1.20;
  --chirp-typography-price-medium-text-case: none;
  --chirp-typography-price-medium-text-decoration: none;
  --chirp-typography-price-medium-font-size: 1.8rem;
  --chirp-typography-price-medium-line-height: 1.22;
  --chirp-typography-price-small-text-case: none;
  --chirp-typography-price-small-text-decoration: none;
  --chirp-typography-price-small-font-size: 1.6rem;
  --chirp-typography-price-small-line-height: 1.25;
  --chirp-typography-utility-small-text-case: none;
  --chirp-typography-utility-small-text-decoration: none;
  --chirp-typography-utility-small-font-size: 1.2rem;
  --chirp-typography-utility-small-line-height: 1.50;
  --chirp-typography-utility-text-case: none;
  --chirp-typography-utility-text-decoration: none;
  --chirp-typography-utility-font-size: 1.4rem;
  --chirp-typography-utility-line-height: 1.43;
  --chirp-typography-form-error-text-case: none;
  --chirp-typography-form-error-text-decoration: none;
  --chirp-typography-form-error-font-size: 1.2rem;
  --chirp-typography-form-error-line-height: 1.33;
  --chirp-typography-form-helper-text-case: none;
  --chirp-typography-form-helper-text-decoration: none;
  --chirp-typography-form-helper-font-size: 1.4rem;
  --chirp-typography-form-helper-line-height: 1.29;
  --chirp-typography-form-text-text-case: none;
  --chirp-typography-form-text-text-decoration: none;
  --chirp-typography-form-text-font-size: 1.6rem;
  --chirp-typography-form-text-line-height: 1.50;
  --chirp-typography-form-dropdown-header-font-style: italic;
  --chirp-typography-form-dropdown-header-text-case: none;
  --chirp-typography-form-dropdown-header-text-decoration: none;
  --chirp-typography-form-dropdown-header-font-size: 1.2rem;
  --chirp-typography-form-dropdown-header-line-height: 1.33;
  --chirp-typography-form-label-text-case: none;
  --chirp-typography-form-label-text-decoration: none;
  --chirp-typography-form-label-font-size: 1.6rem;
  --chirp-typography-form-label-line-height: 1.38;
  --chirp-typography-form-grouping-text-case: none;
  --chirp-typography-form-grouping-text-decoration: none;
  --chirp-typography-form-grouping-font-size: 1.8rem;
  --chirp-typography-form-grouping-line-height: 1.22;
  --chirp-typography-overline-text-case: uppercase;
  --chirp-typography-overline-text-decoration: none;
  --chirp-typography-overline-font-size: 1.1rem;
  --chirp-typography-overline-line-height: 1.27;
  --chirp-typography-button-medium-text-case: none;
  --chirp-typography-button-medium-text-decoration: none;
  --chirp-typography-button-medium-font-size: 1.4rem;
  --chirp-typography-button-medium-line-height: 1.43;
  --chirp-typography-button-text-case: none;
  --chirp-typography-button-text-decoration: none;
  --chirp-typography-button-font-size: 1.4rem;
  --chirp-typography-button-line-height: 1.43;
  --chirp-typography-caption-text-case: none;
  --chirp-typography-caption-text-decoration: none;
  --chirp-typography-caption-font-size: 1.2rem;
  --chirp-typography-caption-line-height: 1.25;
  --chirp-typography-paragraph-2-text-case: none;
  --chirp-typography-paragraph-2-text-decoration: none;
  --chirp-typography-paragraph-2-font-size: 1.4rem;
  --chirp-typography-paragraph-2-line-height: 1.29;
  --chirp-typography-paragraph-1-text-case: none;
  --chirp-typography-paragraph-1-text-decoration: none;
  --chirp-typography-paragraph-1-font-size: 1.6rem;
  --chirp-typography-paragraph-1-line-height: 1.25;
  --chirp-typography-editorial-p-2-text-case: none;
  --chirp-typography-editorial-p-2-text-decoration: none;
  --chirp-typography-editorial-p-2-font-size: 1.4rem;
  --chirp-typography-editorial-p-2-line-height: 1.50;
  --chirp-typography-editorial-p-1-text-case: none;
  --chirp-typography-editorial-p-1-text-decoration: none;
  --chirp-typography-editorial-p-1-font-size: 1.6rem;
  --chirp-typography-editorial-p-1-line-height: 1.50;
  --chirp-typography-section-3-text-case: none;
  --chirp-typography-section-3-text-decoration: none;
  --chirp-typography-section-3-font-size: 1.4rem;
  --chirp-typography-section-3-line-height: 1.29;
  --chirp-typography-section-2-text-case: none;
  --chirp-typography-section-2-text-decoration: none;
  --chirp-typography-section-2-font-size: 1.6rem;
  --chirp-typography-section-2-line-height: 1.50;
  --chirp-typography-section-1-text-case: none;
  --chirp-typography-section-1-text-decoration: none;
  --chirp-typography-section-1-font-size: 2rem;
  --chirp-typography-section-1-line-height: 1.50;
  --chirp-typography-display-6-text-case: none;
  --chirp-typography-display-6-text-decoration: none;
  --chirp-typography-display-6-font-size: 2rem;
  --chirp-typography-display-6-line-height: 1.25;
  --chirp-typography-display-5-text-case: none;
  --chirp-typography-display-5-text-decoration: none;
  --chirp-typography-display-5-font-size: 2.4rem;
  --chirp-typography-display-5-line-height: 1.25;
  --chirp-typography-display-4-text-case: none;
  --chirp-typography-display-4-text-decoration: none;
  --chirp-typography-display-4-font-size: 2.8rem;
  --chirp-typography-display-4-line-height: 1.25;
  --chirp-typography-display-3-text-case: none;
  --chirp-typography-display-3-text-decoration: none;
  --chirp-typography-display-3-font-size: 3.2rem;
  --chirp-typography-display-3-line-height: 1.25;
  --chirp-typography-display-2-text-case: none;
  --chirp-typography-display-2-text-decoration: none;
  --chirp-typography-display-2-font-size: 3.6rem;
  --chirp-typography-display-2-line-height: 1.25;
  --chirp-typography-display-1-text-case: none;
  --chirp-typography-display-1-text-decoration: none;
  --chirp-typography-display-1-font-size: 4rem;
  --chirp-typography-display-1-line-height: 1.25;
  --chirp-typography-weight-medium: 500;
  --chirp-typography-weight-normal: 400;
  --chirp-typography-ls-tight: -0.03em;
  --chirp-typography-ls-loose: 0.01em;
  --chirp-typography-ls-standard: 0;
  --chirp-typography-weight-semibold: 500;
  --chirp-typography-weight-bold: 700;
  --chirp-typography-weight-heavy: 800;
  --chirp-typography-text-typeface: Gordita, Verdana, 'Lucida Sans', 'Helvetica Neue', Arial, Roboto, sans-serif;
  --chirp-typography-ls-wide: 0.08em;
  --chirp-typography-display-typeface: Gordita, Verdana, 'Lucida Sans', 'Helvetica Neue', Arial, Roboto, sans-serif;
  --chirp-typography-price-small-strikethrough-letter-spacing: 0;
  --chirp-typography-price-small-strikethrough-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-price-small-strikethrough-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-x-small-strikethrough-letter-spacing: 0;
  --chirp-typography-price-x-small-strikethrough-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-price-x-small-strikethrough-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-x-large-letter-spacing: 0;
  --chirp-typography-price-x-large-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-price-x-large-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-large-letter-spacing: 0;
  --chirp-typography-price-large-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-price-large-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-medium-letter-spacing: 0;
  --chirp-typography-price-medium-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-price-medium-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-small-letter-spacing: 0;
  --chirp-typography-price-small-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-price-small-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-utility-small-letter-spacing: 0;
  --chirp-typography-utility-small-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-utility-small-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-utility-letter-spacing: 0;
  --chirp-typography-utility-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-utility-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-error-letter-spacing: 0;
  --chirp-typography-form-error-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-form-error-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-helper-letter-spacing: 0;
  --chirp-typography-form-helper-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-form-helper-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-text-letter-spacing: 0;
  --chirp-typography-form-text-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-form-text-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-dropdown-header-letter-spacing: 0;
  --chirp-typography-form-dropdown-header-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-form-dropdown-header-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-label-letter-spacing: 0;
  --chirp-typography-form-label-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-form-label-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-grouping-letter-spacing: 0;
  --chirp-typography-form-grouping-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-form-grouping-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-overline-letter-spacing: var(--chirp-typography-ls-wide);
  --chirp-typography-overline-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-overline-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-button-medium-letter-spacing: 0;
  --chirp-typography-button-medium-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-button-medium-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-button-letter-spacing: 0;
  --chirp-typography-button-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-button-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-caption-letter-spacing: 0;
  --chirp-typography-caption-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-caption-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-paragraph-2-letter-spacing: 0;
  --chirp-typography-paragraph-2-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-paragraph-2-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-paragraph-1-letter-spacing: 0;
  --chirp-typography-paragraph-1-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-paragraph-1-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-editorial-p-2-letter-spacing: 0;
  --chirp-typography-editorial-p-2-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-editorial-p-2-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-editorial-p-1-letter-spacing: 0;
  --chirp-typography-editorial-p-1-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-editorial-p-1-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-section-3-letter-spacing: 0;
  --chirp-typography-section-3-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-section-3-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-section-2-letter-spacing: 0;
  --chirp-typography-section-2-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-section-2-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-section-1-letter-spacing: 0;
  --chirp-typography-section-1-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-section-1-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-6-letter-spacing: 0;
  --chirp-typography-display-6-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-6-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-5-letter-spacing: 0;
  --chirp-typography-display-5-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-5-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-4-letter-spacing: 0;
  --chirp-typography-display-4-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-4-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-3-letter-spacing: 0;
  --chirp-typography-display-3-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-3-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-2-letter-spacing: 0;
  --chirp-typography-display-2-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-2-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-1-letter-spacing: 0;
  --chirp-typography-display-1-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-1-font-family: var(--chirp-typography-display-typeface);

  @if $deprecated {

  }
 }

Description

Mixin to output CSS custom properties for this token set

Parameters

Parameters
parameter Name	parameter Description	parameter Type	parameter Default value
`$deprecated`	include deprecated tokens in the output	`Boolean`	— none

@mixin custom-properties($deprecated) { ... }@mixin custom-properties($deprecated) { 
  --chirp-typography-utility-small-text-case: none;
  --chirp-typography-utility-small-text-decoration: none;
  --chirp-typography-utility-small-font-size: 1.2rem;
  --chirp-typography-utility-small-line-height: 1.50;
  --chirp-typography-utility-text-case: none;
  --chirp-typography-utility-text-decoration: none;
  --chirp-typography-utility-font-size: 1.4rem;
  --chirp-typography-utility-line-height: 1.43;
  --chirp-typography-form-error-text-case: none;
  --chirp-typography-form-error-text-decoration: none;
  --chirp-typography-form-error-font-size: 1.2rem;
  --chirp-typography-form-error-line-height: 1.33;
  --chirp-typography-form-helper-text-case: none;
  --chirp-typography-form-helper-text-decoration: none;
  --chirp-typography-form-helper-font-size: 1.4rem;
  --chirp-typography-form-helper-line-height: 1.29;
  --chirp-typography-form-text-text-case: none;
  --chirp-typography-form-text-text-decoration: none;
  --chirp-typography-form-text-font-size: 1.6rem;
  --chirp-typography-form-text-line-height: 1.25;
  --chirp-typography-form-dropdown-header-font-style: italic;
  --chirp-typography-form-dropdown-header-text-case: none;
  --chirp-typography-form-dropdown-header-text-decoration: none;
  --chirp-typography-form-dropdown-header-font-size: 1.2rem;
  --chirp-typography-form-dropdown-header-line-height: 1.33;
  --chirp-typography-form-label-text-case: none;
  --chirp-typography-form-label-text-decoration: none;
  --chirp-typography-form-label-font-size: 1.6rem;
  --chirp-typography-form-label-line-height: 1.25;
  --chirp-typography-form-grouping-text-case: none;
  --chirp-typography-form-grouping-text-decoration: none;
  --chirp-typography-form-grouping-font-size: 1.8rem;
  --chirp-typography-form-grouping-line-height: 1.22;
  --chirp-typography-overline-text-case: uppercase;
  --chirp-typography-overline-text-decoration: none;
  --chirp-typography-overline-font-size: 1.1rem;
  --chirp-typography-overline-line-height: 1.27;
  --chirp-typography-button-medium-text-case: none;
  --chirp-typography-button-medium-text-decoration: none;
  --chirp-typography-button-medium-font-size: 1.4rem;
  --chirp-typography-button-medium-line-height: 1.43;
  --chirp-typography-button-text-case: none;
  --chirp-typography-button-text-decoration: none;
  --chirp-typography-button-font-size: 1.4rem;
  --chirp-typography-button-line-height: 1.43;
  --chirp-typography-caption-text-case: none;
  --chirp-typography-caption-text-decoration: none;
  --chirp-typography-caption-font-size: 1.2rem;
  --chirp-typography-caption-line-height: 1.25;
  --chirp-typography-paragraph-2-text-case: none;
  --chirp-typography-paragraph-2-text-decoration: none;
  --chirp-typography-paragraph-2-font-size: 1.4rem;
  --chirp-typography-paragraph-2-line-height: 1.29;
  --chirp-typography-paragraph-1-text-case: none;
  --chirp-typography-paragraph-1-text-decoration: none;
  --chirp-typography-paragraph-1-font-size: 1.6rem;
  --chirp-typography-paragraph-1-line-height: 1.25;
  --chirp-typography-editorial-p-2-text-case: none;
  --chirp-typography-editorial-p-2-text-decoration: none;
  --chirp-typography-editorial-p-2-font-size: 1.4rem;
  --chirp-typography-editorial-p-2-line-height: 1.50;
  --chirp-typography-editorial-p-1-text-case: none;
  --chirp-typography-editorial-p-1-text-decoration: none;
  --chirp-typography-editorial-p-1-font-size: 1.6rem;
  --chirp-typography-editorial-p-1-line-height: 1.50;
  --chirp-typography-section-3-text-case: none;
  --chirp-typography-section-3-text-decoration: none;
  --chirp-typography-section-3-font-size: 1.4rem;
  --chirp-typography-section-3-line-height: 1.29;
  --chirp-typography-section-2-text-case: none;
  --chirp-typography-section-2-text-decoration: none;
  --chirp-typography-section-2-font-size: 1.6rem;
  --chirp-typography-section-2-line-height: 1.25;
  --chirp-typography-section-1-text-case: none;
  --chirp-typography-section-1-text-decoration: none;
  --chirp-typography-section-1-font-size: 2rem;
  --chirp-typography-section-1-line-height: 1.30;
  --chirp-typography-display-6-text-case: none;
  --chirp-typography-display-6-text-decoration: none;
  --chirp-typography-display-6-font-size: 2rem;
  --chirp-typography-display-6-line-height: 1.30;
  --chirp-typography-display-5-text-case: none;
  --chirp-typography-display-5-text-decoration: none;
  --chirp-typography-display-5-font-size: 2.4rem;
  --chirp-typography-display-5-line-height: 1.33;
  --chirp-typography-display-4-text-case: none;
  --chirp-typography-display-4-text-decoration: none;
  --chirp-typography-display-4-font-size: 2.8rem;
  --chirp-typography-display-4-line-height: 1.29;
  --chirp-typography-display-3-text-case: none;
  --chirp-typography-display-3-text-decoration: none;
  --chirp-typography-display-3-font-size: 3.2rem;
  --chirp-typography-display-3-line-height: 1.25;
  --chirp-typography-display-2-text-case: normal;
  --chirp-typography-display-2-text-decoration: none;
  --chirp-typography-display-2-font-size: 4rem;
  --chirp-typography-display-2-line-height: 1.25;
  --chirp-typography-display-1-font-size: 5.2rem;
  --chirp-typography-display-1-text-case: none;
  --chirp-typography-display-1-text-decoration: none;
  --chirp-typography-display-1-line-height: 1.15;
  --chirp-typography-weight-heavy: 800;
  --chirp-typography-weight-medium: 500;
  --chirp-typography-weight-semibold: 600;
  --chirp-typography-weight-bold: 700;
  --chirp-typography-weight-normal: 400;
  --chirp-typography-ls-tight: -0.03em;
  --chirp-typography-ls-wide: 0.16em;
  --chirp-typography-ls-loose: 0.01em;
  --chirp-typography-ls-standard: 0;
  --chirp-typography-text-typeface: Gordita, Verdana, 'Lucida Sans', 'Helvetica Neue', Arial, Roboto, sans-serif;
  --chirp-typography-display-typeface: 'Canela Deck', Verdana, 'Lucida Sans', 'Helvetica Neue', Arial, Roboto, sans-serif;
  --chirp-typography-utility-small-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-utility-small-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-utility-small-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-utility-letter-spacing: 0;
  --chirp-typography-utility-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-utility-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-form-error-letter-spacing: 0;
  --chirp-typography-form-error-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-form-error-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-form-helper-letter-spacing: 0;
  --chirp-typography-form-helper-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-form-helper-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-form-text-letter-spacing: 0;
  --chirp-typography-form-text-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-form-text-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-form-dropdown-header-letter-spacing: 0;
  --chirp-typography-form-dropdown-header-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-form-dropdown-header-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-form-label-letter-spacing: 0;
  --chirp-typography-form-label-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-form-label-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-form-grouping-letter-spacing: 0;
  --chirp-typography-form-grouping-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-form-grouping-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-overline-letter-spacing: var(--chirp-typography-ls-wide);
  --chirp-typography-overline-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-overline-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-button-medium-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-button-medium-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-button-medium-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-button-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-button-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-button-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-caption-letter-spacing: 0;
  --chirp-typography-caption-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-caption-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-paragraph-2-letter-spacing: 0;
  --chirp-typography-paragraph-2-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-paragraph-2-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-paragraph-1-letter-spacing: 0;
  --chirp-typography-paragraph-1-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-paragraph-1-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-editorial-p-2-letter-spacing: 0;
  --chirp-typography-editorial-p-2-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-editorial-p-2-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-editorial-p-1-letter-spacing: 0;
  --chirp-typography-editorial-p-1-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-editorial-p-1-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-section-3-letter-spacing: 0;
  --chirp-typography-section-3-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-section-3-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-section-2-letter-spacing: 0;
  --chirp-typography-section-2-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-section-2-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-section-1-letter-spacing: 0;
  --chirp-typography-section-1-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-section-1-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-display-6-letter-spacing: 0;
  --chirp-typography-display-6-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-display-6-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-5-letter-spacing: 0;
  --chirp-typography-display-5-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-display-5-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-4-letter-spacing: 0;
  --chirp-typography-display-4-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-display-4-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-3-letter-spacing: 0;
  --chirp-typography-display-3-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-display-3-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-2-letter-spacing: 0;
  --chirp-typography-display-2-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-display-2-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-1-letter-spacing: 0;
  --chirp-typography-display-1-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-display-1-font-family: var(--chirp-typography-display-typeface);

  @if $deprecated {

  }
 }

Description

Mixin to output CSS custom properties for this token set

Parameters

Parameters
parameter Name	parameter Description	parameter Type	parameter Default value
`$deprecated`	include deprecated tokens in the output	`Boolean`	— none

@mixin custom-properties($deprecated) { ... }@mixin custom-properties($deprecated) { 
  --chirp-typography-price-small-strikethrough-text-case: none;
  --chirp-typography-price-small-strikethrough-text-decoration: line-through;
  --chirp-typography-price-small-strikethrough-font-size: 1.6rem;
  --chirp-typography-price-small-strikethrough-line-height: 1.25;
  --chirp-typography-price-xx-small-strikethrough-text-case: none;
  --chirp-typography-price-xx-small-strikethrough-text-decoration: line-through;
  --chirp-typography-price-xx-small-strikethrough-font-size: 1.2rem;
  --chirp-typography-price-xx-small-strikethrough-line-height: 1.25;
  --chirp-typography-price-x-small-strikethrough-text-case: none;
  --chirp-typography-price-x-small-strikethrough-text-decoration: line-through;
  --chirp-typography-price-x-small-strikethrough-font-size: 1.4rem;
  --chirp-typography-price-x-small-strikethrough-line-height: 1.29;
  --chirp-typography-price-x-large-text-case: none;
  --chirp-typography-price-x-large-text-decoration: none;
  --chirp-typography-price-x-large-font-size: 2.4rem;
  --chirp-typography-price-x-large-line-height: 1.17;
  --chirp-typography-price-large-text-case: none;
  --chirp-typography-price-large-text-decoration: none;
  --chirp-typography-price-large-font-size: 2rem;
  --chirp-typography-price-large-line-height: 1.20;
  --chirp-typography-price-medium-text-case: none;
  --chirp-typography-price-medium-text-decoration: none;
  --chirp-typography-price-medium-font-size: 1.8rem;
  --chirp-typography-price-medium-line-height: 1.22;
  --chirp-typography-price-small-text-case: none;
  --chirp-typography-price-small-text-decoration: none;
  --chirp-typography-price-small-font-size: 1.6rem;
  --chirp-typography-price-small-line-height: 1.25;
  --chirp-typography-utility-small-text-case: none;
  --chirp-typography-utility-small-text-decoration: none;
  --chirp-typography-utility-small-font-size: 1.2rem;
  --chirp-typography-utility-small-line-height: 1.50;
  --chirp-typography-utility-text-case: none;
  --chirp-typography-utility-text-decoration: none;
  --chirp-typography-utility-font-size: 1.4rem;
  --chirp-typography-utility-line-height: 1.43;
  --chirp-typography-menu-text-line-height: 1.43;
  --chirp-typography-menu-text-text-case: none;
  --chirp-typography-menu-text-text-decoration: none;
  --chirp-typography-menu-text-font-size: 1.4rem;
  --chirp-typography-menu-sub-heading-line-height: 1.20;
  --chirp-typography-menu-sub-heading-text-case: none;
  --chirp-typography-menu-sub-heading-text-decoration: none;
  --chirp-typography-menu-sub-heading-font-size: 1.6rem;
  --chirp-typography-menu-heading-text-case: none;
  --chirp-typography-menu-heading-text-decoration: none;
  --chirp-typography-menu-heading-font-size: 1.8rem;
  --chirp-typography-menu-heading-line-height: 1.44;
  --chirp-typography-form-error-text-case: none;
  --chirp-typography-form-error-text-decoration: none;
  --chirp-typography-form-error-font-size: 1.2rem;
  --chirp-typography-form-error-line-height: 1.33;
  --chirp-typography-form-helper-text-case: none;
  --chirp-typography-form-helper-text-decoration: none;
  --chirp-typography-form-helper-font-size: 1.3rem;
  --chirp-typography-form-helper-line-height: 1.54;
  --chirp-typography-form-text-text-case: none;
  --chirp-typography-form-text-text-decoration: none;
  --chirp-typography-form-text-font-size: 1.4rem;
  --chirp-typography-form-text-line-height: 1.43;
  --chirp-typography-form-dropdown-header-font-style: italic;
  --chirp-typography-form-dropdown-header-text-case: none;
  --chirp-typography-form-dropdown-header-text-decoration: none;
  --chirp-typography-form-dropdown-header-font-size: 1.2rem;
  --chirp-typography-form-dropdown-header-line-height: 1.33;
  --chirp-typography-form-label-text-case: none;
  --chirp-typography-form-label-text-decoration: none;
  --chirp-typography-form-label-font-size: 1.4rem;
  --chirp-typography-form-label-line-height: 1.14;
  --chirp-typography-form-grouping-text-case: none;
  --chirp-typography-form-grouping-text-decoration: none;
  --chirp-typography-form-grouping-font-size: 1.6rem;
  --chirp-typography-form-grouping-line-height: 1.25;
  --chirp-typography-overline-text-case: uppercase;
  --chirp-typography-overline-text-decoration: none;
  --chirp-typography-overline-font-size: 1.1rem;
  --chirp-typography-overline-line-height: 1.27;
  --chirp-typography-button-medium-text-case: none;
  --chirp-typography-button-medium-text-decoration: none;
  --chirp-typography-button-medium-font-size: 1.4rem;
  --chirp-typography-button-medium-line-height: 1.43;
  --chirp-typography-button-text-case: none;
  --chirp-typography-button-text-decoration: none;
  --chirp-typography-button-font-size: 1.4rem;
  --chirp-typography-button-line-height: 1.43;
  --chirp-typography-caption-text-case: none;
  --chirp-typography-caption-text-decoration: none;
  --chirp-typography-caption-font-size: 1.2rem;
  --chirp-typography-caption-line-height: 1.25;
  --chirp-typography-paragraph-2-text-case: none;
  --chirp-typography-paragraph-2-text-decoration: none;
  --chirp-typography-paragraph-2-font-size: 1.4rem;
  --chirp-typography-paragraph-2-line-height: 1.29;
  --chirp-typography-paragraph-1-text-case: none;
  --chirp-typography-paragraph-1-text-decoration: none;
  --chirp-typography-paragraph-1-font-size: 1.6rem;
  --chirp-typography-paragraph-1-line-height: 1.25;
  --chirp-typography-editorial-p-2-text-case: none;
  --chirp-typography-editorial-p-2-text-decoration: none;
  --chirp-typography-editorial-p-2-font-size: 1.4rem;
  --chirp-typography-editorial-p-2-line-height: 1.50;
  --chirp-typography-editorial-p-1-text-case: none;
  --chirp-typography-editorial-p-1-text-decoration: none;
  --chirp-typography-editorial-p-1-font-size: 1.6rem;
  --chirp-typography-editorial-p-1-line-height: 1.50;
  --chirp-typography-section-3-text-case: none;
  --chirp-typography-section-3-text-decoration: none;
  --chirp-typography-section-3-font-size: 1.4rem;
  --chirp-typography-section-3-line-height: 1.29;
  --chirp-typography-section-2-text-case: none;
  --chirp-typography-section-2-text-decoration: none;
  --chirp-typography-section-2-font-size: 1.6rem;
  --chirp-typography-section-2-line-height: 1.25;
  --chirp-typography-section-1-text-case: none;
  --chirp-typography-section-1-text-decoration: none;
  --chirp-typography-section-1-font-size: 2rem;
  --chirp-typography-section-1-line-height: 1.25;
  --chirp-typography-display-6-text-case: none;
  --chirp-typography-display-6-text-decoration: none;
  --chirp-typography-display-6-font-size: 2rem;
  --chirp-typography-display-6-line-height: 1.25;
  --chirp-typography-display-5-text-case: none;
  --chirp-typography-display-5-text-decoration: none;
  --chirp-typography-display-5-font-size: 2.4rem;
  --chirp-typography-display-5-line-height: 1.25;
  --chirp-typography-display-4-text-case: none;
  --chirp-typography-display-4-text-decoration: none;
  --chirp-typography-display-4-font-size: 2.8rem;
  --chirp-typography-display-4-line-height: 1.25;
  --chirp-typography-display-3-text-case: none;
  --chirp-typography-display-3-text-decoration: none;
  --chirp-typography-display-3-font-size: 3.2rem;
  --chirp-typography-display-3-line-height: 1.25;
  --chirp-typography-display-2-text-case: none;
  --chirp-typography-display-2-text-decoration: none;
  --chirp-typography-display-2-font-size: 3.6rem;
  --chirp-typography-display-2-line-height: 1.25;
  --chirp-typography-display-1-text-case: none;
  --chirp-typography-display-1-text-decoration: none;
  --chirp-typography-display-1-font-size: 4rem;
  --chirp-typography-display-1-line-height: 1.25;
  --chirp-typography-weight-heavy: 800;
  --chirp-typography-weight-medium: 500;
  --chirp-typography-weight-semibold: 600;
  --chirp-typography-weight-bold: 700;
  --chirp-typography-weight-normal: 400;
  --chirp-typography-ls-tight: -0.03em;
  --chirp-typography-ls-wide: 0.16em;
  --chirp-typography-ls-loose: 0.01em;
  --chirp-typography-ls-standard: 0;
  --chirp-typography-text-typeface: 'Work Sans', Verdana, 'Lucida Sans', 'Helvetica Neue', Arial, Roboto, sans-serif;
  --chirp-typography-display-typeface: Poppins, Verdana, 'Lucida Sans', 'Helvetica Neue', Arial, Roboto, sans-serif;
  --chirp-typography-price-small-strikethrough-letter-spacing: var(--chirp-typography-ls-tight);
  --chirp-typography-price-small-strikethrough-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-price-small-strikethrough-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-xx-small-strikethrough-letter-spacing: var(--chirp-typography-ls-tight);
  --chirp-typography-price-xx-small-strikethrough-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-price-xx-small-strikethrough-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-x-small-strikethrough-letter-spacing: var(--chirp-typography-ls-tight);
  --chirp-typography-price-x-small-strikethrough-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-price-x-small-strikethrough-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-x-large-letter-spacing: var(--chirp-typography-ls-tight);
  --chirp-typography-price-x-large-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-price-x-large-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-large-letter-spacing: var(--chirp-typography-ls-tight);
  --chirp-typography-price-large-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-price-large-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-medium-letter-spacing: var(--chirp-typography-ls-tight);
  --chirp-typography-price-medium-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-price-medium-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-price-small-letter-spacing: var(--chirp-typography-ls-tight);
  --chirp-typography-price-small-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-price-small-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-utility-small-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-utility-small-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-utility-small-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-utility-letter-spacing: 0;
  --chirp-typography-utility-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-utility-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-menu-text-letter-spacing: 0;
  --chirp-typography-menu-text-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-menu-text-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-menu-sub-heading-letter-spacing: 0;
  --chirp-typography-menu-sub-heading-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-menu-sub-heading-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-menu-heading-letter-spacing: 0;
  --chirp-typography-menu-heading-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-menu-heading-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-error-letter-spacing: 0;
  --chirp-typography-form-error-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-form-error-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-helper-letter-spacing: 0;
  --chirp-typography-form-helper-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-form-helper-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-text-letter-spacing: 0;
  --chirp-typography-form-text-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-form-text-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-dropdown-header-letter-spacing: 0;
  --chirp-typography-form-dropdown-header-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-form-dropdown-header-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-label-letter-spacing: 0;
  --chirp-typography-form-label-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-form-label-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-form-grouping-letter-spacing: 0;
  --chirp-typography-form-grouping-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-form-grouping-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-overline-letter-spacing: var(--chirp-typography-ls-wide);
  --chirp-typography-overline-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-overline-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-button-medium-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-button-medium-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-button-medium-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-button-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-button-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-button-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-caption-letter-spacing: var(--chirp-typography-ls-tight);
  --chirp-typography-caption-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-caption-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-paragraph-2-letter-spacing: var(--chirp-typography-ls-tight);
  --chirp-typography-paragraph-2-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-paragraph-2-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-paragraph-1-letter-spacing: var(--chirp-typography-ls-tight);
  --chirp-typography-paragraph-1-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-paragraph-1-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-editorial-p-2-letter-spacing: 0;
  --chirp-typography-editorial-p-2-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-editorial-p-2-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-editorial-p-1-letter-spacing: 0;
  --chirp-typography-editorial-p-1-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-editorial-p-1-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-section-3-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-section-3-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-section-3-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-section-2-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-section-2-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-section-2-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-section-1-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-section-1-font-weight: var(--chirp-typography-weight-semibold);
  --chirp-typography-section-1-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-6-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-display-6-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-6-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-5-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-display-5-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-5-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-4-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-display-4-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-4-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-3-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-display-3-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-3-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-2-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-display-2-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-2-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-display-1-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-display-1-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-display-1-font-family: var(--chirp-typography-display-typeface);

  @if $deprecated {
  --chirp-typography-deprecated-hero-4-alternate-text-case: none;
  --chirp-typography-deprecated-hero-4-alternate-text-decoration: none;
  --chirp-typography-deprecated-hero-4-alternate-font-size: 5rem;
  --chirp-typography-deprecated-hero-4-alternate-line-height: 1.12;
  --chirp-typography-deprecated-hero-3-alternate-text-case: none;
  --chirp-typography-deprecated-hero-3-alternate-text-decoration: none;
  --chirp-typography-deprecated-hero-3-alternate-font-size: 6rem;
  --chirp-typography-deprecated-hero-3-alternate-line-height: 1.10;
  --chirp-typography-deprecated-hero-2-alternate-text-case: none;
  --chirp-typography-deprecated-hero-2-alternate-text-decoration: none;
  --chirp-typography-deprecated-hero-2-alternate-font-size: 7.2rem;
  --chirp-typography-deprecated-hero-2-alternate-line-height: 1.08;
  --chirp-typography-deprecated-hero-1-alternate-text-case: none;
  --chirp-typography-deprecated-hero-1-alternate-text-decoration: none;
  --chirp-typography-deprecated-hero-1-alternate-font-size: 9.6rem;
  --chirp-typography-deprecated-hero-1-alternate-line-height: 1.06;
  --chirp-typography-deprecated-hero-4-text-case: none;
  --chirp-typography-deprecated-hero-4-text-decoration: none;
  --chirp-typography-deprecated-hero-4-font-size: 5rem;
  --chirp-typography-deprecated-hero-4-line-height: 1.12;
  --chirp-typography-deprecated-hero-3-text-case: none;
  --chirp-typography-deprecated-hero-3-text-decoration: none;
  --chirp-typography-deprecated-hero-3-font-size: 6rem;
  --chirp-typography-deprecated-hero-3-line-height: 1.10;
  --chirp-typography-deprecated-hero-2-text-case: none;
  --chirp-typography-deprecated-hero-2-text-decoration: none;
  --chirp-typography-deprecated-hero-2-font-size: 7.2rem;
  --chirp-typography-deprecated-hero-2-line-height: 1.08;
  --chirp-typography-deprecated-hero-1-text-case: none;
  --chirp-typography-deprecated-hero-1-text-decoration: none;
  --chirp-typography-deprecated-hero-1-font-size: 9.6rem;
  --chirp-typography-deprecated-hero-1-line-height: 1.06;
  --chirp-typography-deprecated-overline-text-case: uppercase;
  --chirp-typography-deprecated-overline-text-decoration: none;
  --chirp-typography-deprecated-overline-font-size: 1.1rem;
  --chirp-typography-deprecated-overline-line-height: 1.27;
  --chirp-typography-deprecated-button-text-case: none;
  --chirp-typography-deprecated-button-text-decoration: none;
  --chirp-typography-deprecated-button-font-size: 1.4rem;
  --chirp-typography-deprecated-button-line-height: 1.43;
  --chirp-typography-deprecated-caption-text-case: none;
  --chirp-typography-deprecated-caption-text-decoration: none;
  --chirp-typography-deprecated-caption-font-size: 1.2rem;
  --chirp-typography-deprecated-caption-line-height: 1.25;
  --chirp-typography-deprecated-paragraph-2-text-case: none;
  --chirp-typography-deprecated-paragraph-2-text-decoration: none;
  --chirp-typography-deprecated-paragraph-2-font-size: 1.4rem;
  --chirp-typography-deprecated-paragraph-2-line-height: 1.29;
  --chirp-typography-deprecated-paragraph-1-text-case: none;
  --chirp-typography-deprecated-paragraph-1-text-decoration: none;
  --chirp-typography-deprecated-paragraph-1-font-size: 1.6rem;
  --chirp-typography-deprecated-paragraph-1-line-height: 1.25;
  --chirp-typography-deprecated-section-2-text-case: none;
  --chirp-typography-deprecated-section-2-text-decoration: none;
  --chirp-typography-deprecated-section-2-font-size: 1.6rem;
  --chirp-typography-deprecated-section-2-line-height: 1.25;
  --chirp-typography-deprecated-section-1-text-case: none;
  --chirp-typography-deprecated-section-1-text-decoration: none;
  --chirp-typography-deprecated-section-1-font-size: 2rem;
  --chirp-typography-deprecated-section-1-line-height: 1.25;
  --chirp-typography-deprecated-display-6-text-case: none;
  --chirp-typography-deprecated-display-6-text-decoration: none;
  --chirp-typography-deprecated-display-6-font-size: 2rem;
  --chirp-typography-deprecated-display-6-line-height: 1.25;
  --chirp-typography-deprecated-display-5-text-case: none;
  --chirp-typography-deprecated-display-5-text-decoration: none;
  --chirp-typography-deprecated-display-5-font-size: 2.4rem;
  --chirp-typography-deprecated-display-5-line-height: 1.25;
  --chirp-typography-deprecated-display-4-text-case: none;
  --chirp-typography-deprecated-display-4-text-decoration: none;
  --chirp-typography-deprecated-display-4-font-size: 2.8rem;
  --chirp-typography-deprecated-display-4-line-height: 1.25;
  --chirp-typography-deprecated-display-3-text-case: none;
  --chirp-typography-deprecated-display-3-text-decoration: none;
  --chirp-typography-deprecated-display-3-font-size: 3.2rem;
  --chirp-typography-deprecated-display-3-line-height: 1.25;
  --chirp-typography-deprecated-display-2-text-case: none;
  --chirp-typography-deprecated-display-2-text-decoration: none;
  --chirp-typography-deprecated-display-2-font-size: 3.6rem;
  --chirp-typography-deprecated-display-2-line-height: 1.25;
  --chirp-typography-deprecated-display-1-text-case: none;
  --chirp-typography-deprecated-display-1-text-decoration: none;
  --chirp-typography-deprecated-display-1-font-size: 4rem;
  --chirp-typography-deprecated-display-1-line-height: 1.25;
  --chirp-typography-deprecated-hero-4-alternate-letter-spacing: 0;
  --chirp-typography-deprecated-hero-4-alternate-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-deprecated-hero-4-alternate-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-hero-3-alternate-letter-spacing: 0;
  --chirp-typography-deprecated-hero-3-alternate-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-deprecated-hero-3-alternate-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-hero-2-alternate-letter-spacing: 0;
  --chirp-typography-deprecated-hero-2-alternate-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-deprecated-hero-2-alternate-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-hero-1-alternate-letter-spacing: 0;
  --chirp-typography-deprecated-hero-1-alternate-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-deprecated-hero-1-alternate-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-hero-4-letter-spacing: 0;
  --chirp-typography-deprecated-hero-4-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-deprecated-hero-4-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-hero-3-letter-spacing: 0;
  --chirp-typography-deprecated-hero-3-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-deprecated-hero-3-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-hero-2-letter-spacing: 0;
  --chirp-typography-deprecated-hero-2-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-deprecated-hero-2-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-hero-1-letter-spacing: 0;
  --chirp-typography-deprecated-hero-1-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-deprecated-hero-1-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-overline-letter-spacing: var(--chirp-typography-ls-wide);
  --chirp-typography-deprecated-overline-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-deprecated-overline-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-button-letter-spacing: var(--chirp-typography-ls-loose);
  --chirp-typography-deprecated-button-font-weight: var(--chirp-typography-weight-normal);
  --chirp-typography-deprecated-button-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-caption-letter-spacing: 0;
  --chirp-typography-deprecated-caption-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-deprecated-caption-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-deprecated-paragraph-2-letter-spacing: 0;
  --chirp-typography-deprecated-paragraph-2-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-deprecated-paragraph-2-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-deprecated-paragraph-1-letter-spacing: 0;
  --chirp-typography-deprecated-paragraph-1-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-deprecated-paragraph-1-font-family: var(--chirp-typography-text-typeface);
  --chirp-typography-deprecated-section-2-letter-spacing: 0;
  --chirp-typography-deprecated-section-2-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-deprecated-section-2-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-section-1-letter-spacing: 0;
  --chirp-typography-deprecated-section-1-font-weight: var(--chirp-typography-weight-bold);
  --chirp-typography-deprecated-section-1-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-display-6-letter-spacing: 0;
  --chirp-typography-deprecated-display-6-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-deprecated-display-6-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-display-5-letter-spacing: 0;
  --chirp-typography-deprecated-display-5-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-deprecated-display-5-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-display-4-letter-spacing: 0;
  --chirp-typography-deprecated-display-4-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-deprecated-display-4-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-display-3-letter-spacing: 0;
  --chirp-typography-deprecated-display-3-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-deprecated-display-3-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-display-2-letter-spacing: 0;
  --chirp-typography-deprecated-display-2-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-deprecated-display-2-font-family: var(--chirp-typography-display-typeface);
  --chirp-typography-deprecated-display-1-letter-spacing: 0;
  --chirp-typography-deprecated-display-1-font-weight: var(--chirp-typography-weight-medium);
  --chirp-typography-deprecated-display-1-font-family: var(--chirp-typography-display-typeface);
  }
 }

Description

Mixin to output CSS custom properties for this token set

Parameters

Parameters
parameter Name	parameter Description	parameter Type	parameter Default value
`$deprecated`	include deprecated tokens in the output	`Boolean`	— none

General

Css

& .kib-input-text__icon, & .kib-field__icon--action

Description

.kib-input-text__icon &__adornment

Description

.kib-input-text__icon &__adornment-icon

Description

.kib-field__action &__adornment

Description

.kib-field__action .Mui-disabled &__adornment-icon

Description

&--xs

Functions

-get-spacing-value

Description

Parameters

Returns

Throws

Requires

Used by

get-properties

Description

Parameters

Returns

Requires

get

Description

Parameters

Returns

Example

Requires

Variables

preferred-theme

Description

Type

themes

Description

Type

aliases

Description

Type

Used by

chirp-typography-price-small-strikethrough-text-case

Description

chirp-typography

Description

chirp-typography-price-small-strikethrough-text-case

Description

chirp-typography

Description

chirp-typography-utility-small-text-case

Description

chirp-typography

Description

chirp-typography-deprecated-hero-4-alternate-text-case

Description

chirp-typography

Description

Mixins

custom-properties

Description

Parameters

custom-properties

Description

Parameters

custom-properties

Description

Parameters

custom-properties

Description

Parameters

& .kib-input-texticon, & .kib-fieldicon--action

.kib-input-texticon &adornment

.kib-input-texticon &adornment-icon

.kib-fieldaction &adornment

.kib-fieldaction .Mui-disabled &adornment-icon