From cc2f21adbf789491c0a1f2f6aaead77e1719ac1a Mon Sep 17 00:00:00 2001 From: Miriam Suzanne Date: Fri, 3 Dec 2021 15:27:41 -0700 Subject: [PATCH] Fix broken config issues, and bump v4.0.0-beta.2 --- CHANGELOG.md | 4 +- docs/CHANGELOG.html | 5 +- docs/CONTRIBUTING.html | 2 +- docs/LICENSE.html | 2 +- docs/animate-change-vars.html | 2 +- docs/animate-change.html | 2 +- docs/animate-ease-vars.html | 2 +- docs/animate-ease.html | 2 +- docs/animate-time-vars.html | 2 +- docs/animate-times.html | 2 +- docs/animate.html | 2 +- docs/color-config.html | 2 +- docs/color-contrast.html | 664 ++++++++++++++++----------------- docs/color-themes.html | 2 +- docs/color-tokens.html | 2 +- docs/color-utils.html | 2 +- docs/color-vars.html | 2 +- docs/color.html | 2 +- docs/index.html | 2 +- docs/layout-queries.html | 2 +- docs/layout-z-index.html | 4 +- docs/layout.html | 2 +- docs/ratio-tokens.html | 2 +- docs/ratio-vars.html | 2 +- docs/ratios.html | 2 +- docs/scale-sizes.html | 2 +- docs/scale-units.html | 2 +- docs/scale-vars.html | 2 +- docs/scale.html | 2 +- docs/search-data.json | 2 +- docs/search.html | 2 +- docs/token-api.html | 2 +- docs/token-config.html | 2 +- docs/token-inspect.html | 2 +- docs/token-internal.html | 2 +- docs/token-register.html | 2 +- docs/token-vars.html | 2 +- docs/tokens.html | 2 +- docs/type-a11y.html | 2 +- docs/type-font-vars.html | 2 +- docs/type-fonts.html | 2 +- docs/type-helpers.html | 2 +- docs/type-pseudo.html | 2 +- docs/type.html | 2 +- docs/utils.html | 2 +- docs/vars.html | 2 +- package.json | 2 +- sass/_tools.scss | 8 +- sass/color/_contrast-vars.scss | 132 +++++++ sass/color/_contrast.scss | 127 ------- sass/color/_index.scss | 1 + sass/layout/_z-index.scss | 2 +- sass/scale/_index.scss | 2 +- test/color/_contrast-vars.scss | 46 +++ test/color/_contrast.scss | 35 -- test/color/_index.scss | 1 + test/index.scss | 25 +- 57 files changed, 595 insertions(+), 547 deletions(-) create mode 100644 sass/color/_contrast-vars.scss create mode 100644 test/color/_contrast-vars.scss diff --git a/CHANGELOG.md b/CHANGELOG.md index 09e90a2e..4f9195db 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,11 +2,13 @@ ## 4.0.0 - UNRELEASED -### 4.0.0-beta.1 - 12/03/21 +### 4.0.0-beta.2 - 12/03/21 This is a major update, moving over to Sass modules, and removing some features that no longer seem necessary. +(previous betas had major breaking issues) + - BREAKING: Requires Sass modules, and other recent features of Dart Sass. Legacy versions of Sass (Node & Ruby) are no longer supported - BREAKING: The old "init" module, which provided light-weight diff --git a/docs/CHANGELOG.html b/docs/CHANGELOG.html index b9f34faa..7affd49b 100644 --- a/docs/CHANGELOG.html +++ b/docs/CHANGELOG.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
@@ -384,9 +384,10 @@

Accoutrement Changelog

4.0.0 - UNRELEASED

-

4.0.0-beta.1 - 12/03/21

+

4.0.0-beta.2 - 12/03/21

This is a major update, moving over to Sass modules, and removing some features that no longer seem necessary.

+

(previous betas had major breaking issues)

  • BREAKING: Requires Sass modules, and other recent features of Dart Sass. diff --git a/docs/CONTRIBUTING.html b/docs/CONTRIBUTING.html index f297395b..79d06848 100644 --- a/docs/CONTRIBUTING.html +++ b/docs/CONTRIBUTING.html @@ -42,7 +42,7 @@

    Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
    diff --git a/docs/LICENSE.html b/docs/LICENSE.html index bfed70e5..7b240059 100644 --- a/docs/LICENSE.html +++ b/docs/LICENSE.html @@ -42,7 +42,7 @@
    Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
    diff --git a/docs/animate-change-vars.html b/docs/animate-change-vars.html index 6ae6a8c5..5683b740 100644 --- a/docs/animate-change-vars.html +++ b/docs/animate-change-vars.html @@ -42,7 +42,7 @@
    Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
    diff --git a/docs/animate-change.html b/docs/animate-change.html index c64b6f5e..a3eaa3f1 100644 --- a/docs/animate-change.html +++ b/docs/animate-change.html @@ -42,7 +42,7 @@
    Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
    diff --git a/docs/animate-ease-vars.html b/docs/animate-ease-vars.html index 420879cd..40afbba0 100644 --- a/docs/animate-ease-vars.html +++ b/docs/animate-ease-vars.html @@ -42,7 +42,7 @@
    Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
    diff --git a/docs/animate-ease.html b/docs/animate-ease.html index c7ea1090..400cc799 100644 --- a/docs/animate-ease.html +++ b/docs/animate-ease.html @@ -42,7 +42,7 @@
    Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
    diff --git a/docs/animate-time-vars.html b/docs/animate-time-vars.html index 23a5cd45..b72b96d7 100644 --- a/docs/animate-time-vars.html +++ b/docs/animate-time-vars.html @@ -42,7 +42,7 @@
    Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
    diff --git a/docs/animate-times.html b/docs/animate-times.html index 601ff6ab..bf145d76 100644 --- a/docs/animate-times.html +++ b/docs/animate-times.html @@ -42,7 +42,7 @@
    Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
    diff --git a/docs/animate.html b/docs/animate.html index 6f264afb..314e7c9b 100644 --- a/docs/animate.html +++ b/docs/animate.html @@ -42,7 +42,7 @@
    Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
    diff --git a/docs/color-config.html b/docs/color-config.html index 417edba4..3db69774 100644 --- a/docs/color-config.html +++ b/docs/color-config.html @@ -42,7 +42,7 @@
    Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
    diff --git a/docs/color-contrast.html b/docs/color-contrast.html index 96ff0f4e..3a707d08 100644 --- a/docs/color-contrast.html +++ b/docs/color-contrast.html @@ -42,7 +42,7 @@
    Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
    @@ -394,82 +394,7 @@

    -
    - - - - - - - - -
    -

    Contrast & Accessibility

    - - - - - - - - - - -
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    - - - - - - - - - - - - - - -
    +
    @@ -487,7 +412,7 @@

    - contrast() + var-contrast() @@ -508,15 +433,22 @@

    -

    For any color, select the best contrast among a set of options. -For best results, pass in a combination of light and dark colors -to contrast against – -or define default contrast-light and contrast-dark values -(with or without a private _ prefix) -in your global $colors map.

    +

    An extension of the contrast function, +designed to output CSS variables +rather than simple color values.

    + +
    +

    Since 2.1.0:

    +
      +
    • NEW: Provides access to contrast colors as CSS-variables, when defined
      • +
    +
    +
    + + @@ -628,15 +560,16 @@

    @return - (color) + (color | var())

    -

    Whichever color-option has the highest contrast-ratio to $color, -or the minimum needed contrast to meet a given accessibility ratio.

    +

    CSS Variable for the color-option +that has the highest contrast-ratio to $color, +or the color if no variable exists.

    @@ -694,7 +627,7 @@

    - max contrast + max contrast / no variable names

    @@ -708,7 +641,7 @@

    'dark': #111, ); html { - color: tools.contrast( + color: tools.var-contrast( 'background', 'light', 'dark', black, white ); @@ -774,7 +707,7 @@

    - min contrast + min contrast / variable names

@@ -788,7 +721,7 @@

'dark': #111, ); html { - color: tools.contrast( + color: tools.var-contrast( 'background', 'light', 'dark', black, white, 'AAA' @@ -816,7 +749,7 @@ 

html {
-  color: #eee;
+  color: var(--color-light, #eee);
 }
@@ -883,6 +816,151 @@

+ + + + + + + + + + + + + + + + + +
+

+ @function + + get() + + + + [private] +

+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
+

+ @function + + is-private-token() + + + + +

+ + +
+ + + + + + + + + + + + + + + + + + + + + +
+

+ @function + + ident() + + + + +

+ + +
+ + + + + + + + + + + + + + + + + + + + + +
+

+ + + $color-var-prefix + + + (string) + +

+ + +
+ + + + @@ -919,7 +997,7 @@

@mixin contrasted() + color-contrast.html#mixin--var-contrasted" class="item-name">var-contrasted() @@ -965,7 +1043,7 @@

-
+
@@ -979,11 +1057,11 @@

- @function + @mixin - var-contrast() + var-contrasted() @@ -1004,9 +1082,11 @@

-

An extension of the contrast function, -designed to output CSS variables -rather than simple color values.

+

Apply any background color as a CSS variable, +along with the highest-contrast text color from a set of options. +This works the same as the var-contrast function, +but applies the resulting values to background-color +and text color properties.

@@ -1014,7 +1094,7 @@

Since 2.1.0:

    -
  • NEW: Provides access to contrast colors as CSS-variables, when defined
    • +
  • NEW: Applies contrasting colors as CSS-variables, when defined
@@ -1046,7 +1126,7 @@

Since 2.1.0:

- Parameters & Return + Parameters & Output

@@ -1062,7 +1142,7 @@

- $color: + $background: (string | list) @@ -1072,7 +1152,7 @@

-

The name or value of a color.

+

The name or value of your desired background color.

@@ -1123,24 +1203,29 @@

+ + +

- @return + {CSS output} - (color | var()) + (code block)

-

CSS Variable for the color-option -that has the highest contrast-ratio to $color, -or the color if no variable exists.

+
    +
  • Sets the background-color to $background +and the foreground color to +whichever option has better contrast against the given background.
    • +
@@ -1151,9 +1236,6 @@

- - -

@@ -1198,7 +1280,7 @@

- max contrast / no variable names + max contrast

@@ -1212,7 +1294,7 @@

'dark': #111, ); html { - color: tools.var-contrast( + @include tools.var-contrasted( 'background', 'light', 'dark', black, white ); @@ -1239,6 +1321,7 @@ 

html {
+  background-color: var(--color-background, blue);
   color: white;
 }

@@ -1278,7 +1361,7 @@

- min contrast / variable names + min contrast

@@ -1292,7 +1375,7 @@

'dark': #111, ); html { - color: tools.var-contrast( + @include tools.var-contrasted( 'background', 'light', 'dark', black, white, 'AAA' @@ -1314,118 +1397,44 @@

compiled - - - - - - 
html {
-  color: var(--color-light, #eee);
-}
- - - - - - - - - - - - - - - - - -
- - -
- -

- Requires - -

- - - - - - - - - - - - - - - - - - - - - - -
-

- @function - - best-contrast() - - - - [private] -

- - -
- - - - - - - - - - - - - - - - - - - - - -
-

- @function - - get() +

+ - [private] -

+ 
html {
+  background-color: var(--color-background, blue);
+  color: var(--color-light, #eee);
+}
+ + + + - - - - - + + + + + + + + + +
+ +

+ Requires +

+ + + + @@ -1449,7 +1458,7 @@

@function is-private-token() + color-vars.html#function--var-color" class="item-name">var-color() @@ -1484,7 +1493,7 @@

@function ident() + color-contrast.html#function--var-contrast" class="item-name">var-contrast() @@ -1497,64 +1506,66 @@

- - - + +

- - - - + + + + + -
-

- - - $color-var-prefix - - - (string) - -

+ + +
+ + - - - + + + + + + + + +
+ - + + + + +
+

Contrast & Accessibility

+ - -
- -

- Used By - -

- - + + - + + +
+ + + - - - @@ -1563,30 +1574,20 @@

-
-

- @mixin - - var-contrasted() - - - - -

- -
+ + - - - -

+ + + + + + - @@ -1614,7 +1615,7 @@

-
+
@@ -1628,11 +1629,11 @@

- @mixin + @function - contrasted() + contrast() @@ -1653,11 +1654,12 @@

-

Apply any background color, -along with the highest-contrast text color from a set of options. -This works the same as the contrast function, -but applies the resulting values to background-color -and text color properties.

+

For any color, select the best contrast among a set of options. +For best results, pass in a combination of light and dark colors +to contrast against – +or define default contrast-light and contrast-dark values +(with or without a private _ prefix) +in your global $colors map.

@@ -1687,7 +1689,7 @@

- Parameters & Output + Parameters & Return

@@ -1703,7 +1705,7 @@

- $background: + $color: (string | list) @@ -1713,7 +1715,7 @@

-

The name or value of your desired background color.

+

The name or value of a color.

@@ -1764,30 +1766,23 @@

- - -

- {CSS output} + @return - (code block) + (color)

-
    -
  • Sets the background-color to $background -and color to the option with -highest contrast against that background, -or minimum contrast that still meets a given accessibility ratio.
    • -
+

Whichever color-option has the highest contrast-ratio to $color, +or the minimum needed contrast to meet a given accessibility ratio.

@@ -1798,6 +1793,9 @@

+ + +

@@ -1856,7 +1854,7 @@

'dark': #111, ); html { - @include tools.contrasted( + color: tools.contrast( 'background', 'light', 'dark', black, white ); @@ -1883,7 +1881,6 @@ 

html {
-  background-color: blue;
   color: white;
 }

@@ -1937,7 +1934,7 @@

'dark': #111, ); html { - @include tools.contrasted( + color: tools.contrast( 'background', 'light', 'dark', black, white, 'AAA' @@ -1965,7 +1962,6 @@ 

html {
-  background-color: blue;
   color: #eee;
 }

@@ -1985,7 +1981,8 @@

- +
+
@@ -2019,12 +2016,11 @@

@function - color() - + best-contrast() + [private]

@@ -2033,8 +2029,24 @@

+ +

+ + + + + +
+ +

+ Used By - +

+ + + + + @@ -2046,16 +2058,14 @@

- -

- @function + @mixin contrast() + color-contrast.html#mixin--contrasted" class="item-name">contrasted() @@ -2072,9 +2082,8 @@

- - +

@@ -2102,7 +2111,7 @@

-
+
@@ -2120,7 +2129,7 @@

- var-contrasted() + contrasted() @@ -2141,24 +2150,14 @@

-

Apply any background color as a CSS variable, +

Apply any background color, along with the highest-contrast text color from a set of options. -This works the same as the var-contrast function, +This works the same as the contrast function, but applies the resulting values to background-color and text color properties.

- -
-

Since 2.1.0:

-
    -
  • NEW: Applies contrasting colors as CSS-variables, when defined
    • -
-
-
- - @@ -2282,8 +2281,9 @@

  • Sets the background-color to $background -and the foreground color to -whichever option has better contrast against the given background.
    • +and color to the option with +highest contrast against that background, +or minimum contrast that still meets a given accessibility ratio.
@@ -2353,7 +2353,7 @@

'dark': #111, ); html { - @include tools.var-contrasted( + @include tools.contrasted( 'background', 'light', 'dark', black, white ); @@ -2380,7 +2380,7 @@ 

html {
-  background-color: var(--color-background, blue);
+  background-color: blue;
   color: white;
 }

@@ -2434,7 +2434,7 @@

'dark': #111, ); html { - @include tools.var-contrasted( + @include tools.contrasted( 'background', 'light', 'dark', black, white, 'AAA' @@ -2462,8 +2462,8 @@ 

html {
-  background-color: var(--color-background, blue);
-  color: var(--color-light, #eee);
+  background-color: blue;
+  color: #eee;
 }

@@ -2517,7 +2517,7 @@

@function var-color() + color-tokens.html#function--color" class="item-name">color() @@ -2552,7 +2552,7 @@

@function var-contrast() + color-contrast.html#function--contrast" class="item-name">contrast() diff --git a/docs/color-themes.html b/docs/color-themes.html index d3159d23..331d5e85 100644 --- a/docs/color-themes.html +++ b/docs/color-themes.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/color-tokens.html b/docs/color-tokens.html index 3b82ac97..3e6d6d91 100644 --- a/docs/color-tokens.html +++ b/docs/color-tokens.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/color-utils.html b/docs/color-utils.html index ee68cdb4..7cb2de69 100644 --- a/docs/color-utils.html +++ b/docs/color-utils.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/color-vars.html b/docs/color-vars.html index d697dc15..297ddb3d 100644 --- a/docs/color-vars.html +++ b/docs/color-vars.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/color.html b/docs/color.html index d340f35c..5a05645e 100644 --- a/docs/color.html +++ b/docs/color.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/index.html b/docs/index.html index c2aa10ce..ed98787a 100644 --- a/docs/index.html +++ b/docs/index.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/layout-queries.html b/docs/layout-queries.html index 0d5faf27..179eaf9a 100644 --- a/docs/layout-queries.html +++ b/docs/layout-queries.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/layout-z-index.html b/docs/layout-z-index.html index a4b83196..f1ec6e09 100644 --- a/docs/layout-z-index.html +++ b/docs/layout-z-index.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
@@ -443,7 +443,7 @@

- 
$z-index: ();
+ 
$z-index: () !default;

diff --git a/docs/layout.html b/docs/layout.html index 10ef44c1..1dfd1fa1 100644 --- a/docs/layout.html +++ b/docs/layout.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/ratio-tokens.html b/docs/ratio-tokens.html index 48e20d3b..3d6378b6 100644 --- a/docs/ratio-tokens.html +++ b/docs/ratio-tokens.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/ratio-vars.html b/docs/ratio-vars.html index 06309520..1fff7d94 100644 --- a/docs/ratio-vars.html +++ b/docs/ratio-vars.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/ratios.html b/docs/ratios.html index 1737ff35..876327e0 100644 --- a/docs/ratios.html +++ b/docs/ratios.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/scale-sizes.html b/docs/scale-sizes.html index 0e0c0a01..4736fd9b 100644 --- a/docs/scale-sizes.html +++ b/docs/scale-sizes.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/scale-units.html b/docs/scale-units.html index 84f6469f..eb7edfd4 100644 --- a/docs/scale-units.html +++ b/docs/scale-units.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/scale-vars.html b/docs/scale-vars.html index 5e096924..cab340a9 100644 --- a/docs/scale-vars.html +++ b/docs/scale-vars.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/scale.html b/docs/scale.html index c372653d..b599a137 100644 --- a/docs/scale.html +++ b/docs/scale.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/search-data.json b/docs/search-data.json index a0a27e1d..5f9b2b9f 100644 --- a/docs/search-data.json +++ b/docs/search-data.json @@ -1 +1 @@ -{"idx":{"version":"2.3.9","fields":["title","contents"],"fieldVectors":[["title/animate-change-vars.html",[0,0.889,1,0.12,2,0.047,3,0.268]],["contents/animate-change-vars.html",[0,2.374,1,0.319,2,0.119,3,0.671,4,2.144,5,1.389,6,0.449,7,0.58,8,0.408,9,0.513,10,0.944,11,1.184,12,0.021,13,2.02,14,0.867,15,0.483,16,0.117,17,0.867,18,1.664,19,1.664,20,0.674,21,0.981,22,1.799,23,1.442,24,1.184,25,1.088,26,0.522,27,1.262,28,1.111,29,1.557,30,1.412,31,0.891,32,1.546,33,1.617,34,0.551,35,2.212,36,2.212,37,0.691,38,4.977,39,3.005,40,1.664,41,1.52,42,0.899,43,5.569,44,0.659,45,1.799,46,0.449,47,0.187,48,0.815,49,0.437,50,1.184,51,0.923,52,1.348,53,0.285,54,1.105,55,1.184,56,1.111,57,1.341,58,0.59,59,0.481,60,1.111,61,0.923,62,1.348,63,0.461,64,1.323,65,0.936,66,1.089,67,0.59,68,0.718,69,0.944,70,1.442,71,3.44,72,3.163,73,3.982,74,1.681,75,2.179,76,3.751,77,3.758,78,0.508,79,0.551,80,2.858,81,1.072,82,1.006,83,1.72,84,0.884,85,2.167,86,1.215,87,1.072,88,2.02,89,2.167,90,0.631,91,3.005,92,2.74,93,0.256,94,1.262,95,1.111,96,1.546,97,0.483,98,0.477,99,1.888,100,3.178,101,3.178,102,2.02]],["title/animate-change.html",[0,1.024,16,0.054,103,2.103]],["contents/animate-change.html",[0,2.365,1,0.318,2,0.112,3,0.529,6,0.434,7,0.529,8,0.603,9,0.758,10,1.134,12,0.02,15,0.372,16,0.121,21,1.059,28,2.176,31,0.813,34,0.529,37,0.675,38,3.984,42,0.758,44,0.555,46,0.502,47,0.199,49,0.488,53,0.308,54,1.235,57,0.826,58,0.871,59,0.448,63,0.516,64,1.134,65,0.704,66,0.727,67,0.993,68,1.21,69,0.995,78,0.569,79,0.927,87,0.826,90,1.062,93,0.464,97,0.58,98,0.704,103,3.168,104,3.519,105,4.136,106,0.936,107,2.734,108,2.284,109,3.43,110,2.284,111,1.278,112,2.111,113,2.912,114,2.111,115,1.796,116,1.942,117,1.864,118,3.43,119,1.362,120,2.657,121,2.912,122,1.362,123,2.912,124,4.694,125,3.43,126,3.984,127,3.522,128,3.168,129,3.43,130,2.57,131,4.662,132,3.43,133,2.912,134,3.672,135,4.542,136,2.912,137,4.694,138,3.43,139,2.57,140,2.111,141,1.796,142,2.111,143,2.315,144,1.669,145,4.009,146,3.43,147,2.13,148,2.315,149,2.315,150,2.111,151,2.315,152,1.455,153,1.127,154,0.996,155,1.45,156,1.2,157,1.748,158,1.864,159,1.455,160,1.127,161,1.556,162,1.796,163,1.556,164,1.2,165,1.669,166,3.294,167,2.245,168,1.278,169,1.2,170,1.796,171,1.669,172,1.796,173,2.315,174,2.57,175,1.556,176,1.556,177,0.996,178,1.556,179,1.669,180,5.754,181,2.284,182,3.43,183,3.43]],["title/animate-ease-vars.html",[1,0.12,2,0.047,3,0.268,107,1.228]],["contents/animate-ease-vars.html",[1,0.318,2,0.118,3,0.668,4,2.136,5,1.38,6,0.445,7,0.573,8,0.396,9,0.497,10,0.923,11,1.147,12,0.021,13,1.975,14,0.84,15,0.472,16,0.116,17,0.84,18,1.612,19,1.612,20,0.653,21,0.951,22,1.743,23,1.397,24,1.147,25,1.076,26,0.531,27,1.223,28,1.077,29,1.523,30,1.396,31,0.875,32,1.498,33,1.594,34,0.543,35,2.181,36,2.181,37,0.685,40,1.612,41,1.499,42,0.887,44,0.65,45,1.743,46,0.443,47,0.185,48,0.79,49,0.462,50,1.147,51,0.894,52,1.306,53,0.276,54,1.09,55,1.147,56,1.077,57,1.323,58,0.572,59,0.483,60,1.077,61,0.894,62,1.306,63,0.453,64,1.311,65,0.928,66,1.071,67,0.572,68,0.696,69,0.923,70,1.397,78,0.5,79,0.534,80,2.843,81,1.049,82,0.984,83,1.696,84,0.864,85,2.119,86,1.188,87,1.049,88,1.975,89,2.119,90,0.611,93,0.248,94,1.223,95,1.077,96,1.498,97,0.472,98,0.462,99,1.306,104,2.28,105,2.68,107,3.276,127,1.743,134,2.464,142,1.895,148,4.487,184,5.794,185,2.307,186,5.491,187,4.633,188,2.613,189,2.613,190,2.613,191,2.613,192,6.015,193,4.507,194,4.507,195,4.059,196,3.405,197,2.457,198,4.059,199,4.354,200,3.696,201,3.079,202,4.354,203,3.079,204,3.079]],["title/animate-ease.html",[16,0.064,107,1.667]],["contents/animate-ease.html",[1,0.323,2,0.094,3,0.569,4,0.933,5,0.91,6,0.217,7,0.425,8,0.642,9,0.929,10,1.154,12,0.02,15,0.328,16,0.119,17,0.824,21,1.326,25,0.797,26,0.244,27,1.199,31,0.744,34,0.538,37,0.328,44,0.357,46,0.439,47,0.207,49,0.472,51,0.877,53,0.271,54,0.853,58,0.797,59,0.43,63,0.385,64,1.059,65,0.453,66,0.64,67,0.561,68,0.683,78,0.425,79,0.744,81,1.034,87,0.727,90,0.992,93,0.403,97,0.542,98,0.453,107,3.266,110,1.469,115,1.581,116,1.709,117,1.199,119,1.706,127,3.956,128,3.373,131,2.263,134,1.709,142,3.351,145,4.079,147,3.006,148,2.038,149,2.038,150,1.859,151,2.038,152,1.281,153,0.992,154,0.877,155,1.326,156,1.056,157,1.6,158,1.706,159,1.281,160,0.992,162,1.581,163,1.37,164,1.056,165,1.469,167,2.142,168,1.6,169,1.056,170,1.581,171,1.469,172,1.581,175,1.37,176,1.37,177,0.877,178,1.37,179,1.469,185,2.263,187,5.302,188,2.563,189,3.646,190,2.563,191,2.563,193,2.263,194,2.263,195,2.038,196,1.709,205,3.646,206,1.949,207,2.563,208,1.125,209,1.859,210,3.02,211,2.263,212,2.563,213,4.295,214,3.02,215,3.02,216,3.02,217,3.02,218,3.02,219,3.02,220,4.998,221,3.02,222,4.295,223,3.02,224,4.295,225,4.998,226,3.02,227,4.998,228,3.02,229,3.02,230,4.998,231,3.02,232,3.882,233,3.02,234,3.02,235,4.998,236,3.02,237,3.02,238,3.02,239,4.998,240,4.295,241,3.02,242,3.02,243,3.02,244,3.02,245,3.02,246,4.295,247,3.02,248,3.02,249,3.02,250,3.02,251,3.02,252,3.02,253,4.295,254,3.02,255,3.02,256,3.02,257,3.02,258,4.295,259,3.02,260,3.02,261,3.02,262,3.02,263,3.02,264,3.02,265,3.02,266,3.02,267,3.02,268,3.02,269,3.02,270,3.02,271,3.02,272,3.02,273,3.02,274,3.02,275,3.02,276,3.02,277,3.02,278,3.02,279,3.02,280,3.02,281,3.02,282,3.02,283,3.02,284,3.02,285,1.709,286,2.563,287,2.038,288,3.02,289,3.02,290,1.469,291,2.563,292,0.91,293,1.859,294,1.859,295,1.859,296,3.646,297,1.37,298,1.859]],["title/animate-time-vars.html",[1,0.12,2,0.047,3,0.268,106,0.738]],["contents/animate-time-vars.html",[0,1.469,1,0.319,2,0.119,3,0.672,4,2.146,5,1.391,6,0.45,7,0.581,8,0.411,9,0.516,10,0.948,11,1.191,12,0.021,13,2.029,14,0.872,15,0.485,16,0.117,17,0.872,18,1.674,19,1.674,20,0.678,21,0.987,22,1.81,23,1.451,24,1.191,25,1.091,26,0.523,27,1.27,28,1.118,29,1.564,30,1.415,31,0.894,32,1.556,33,1.621,34,0.552,35,2.218,36,2.218,37,0.692,40,1.674,41,1.524,42,0.902,44,0.661,45,1.81,46,0.451,47,0.188,48,0.82,49,0.438,50,1.191,51,0.928,52,1.356,53,0.287,54,1.108,55,1.191,56,1.118,57,1.345,58,0.594,59,0.482,60,1.118,61,0.928,62,1.356,63,0.462,64,1.325,65,0.938,66,1.093,67,0.594,68,0.723,69,0.948,70,1.451,71,2.531,74,1.683,78,0.51,79,0.554,80,2.861,81,1.077,82,1.011,83,1.724,84,0.888,85,2.176,86,1.22,87,1.077,88,2.029,89,2.176,90,0.635,93,0.258,94,1.27,95,1.118,96,1.556,97,0.485,98,0.48,99,1.896,105,2.752,106,1.968,134,3.667,135,3.795,136,2.714,200,3.795,299,5.876,300,5.584,301,5.584,302,5.876,303,3.35,304,4.471,305,1.184,306,4.471,307,4.471,308,3.197,309,3.795]],["title/animate-times.html",[16,0.064,106,1.002]],["contents/animate-times.html",[1,0.306,2,0.092,3,0.583,6,0.3,7,0.412,8,0.687,9,0.862,10,1.318,12,0.018,15,0.452,16,0.123,21,1.287,30,1.497,31,0.926,34,0.583,46,0.431,47,0.213,49,0.463,53,0.374,54,1.06,58,1.193,59,0.473,61,1.21,63,0.479,64,1.249,65,0.802,66,0.884,67,0.774,68,0.942,78,0.528,79,0.926,81,1.004,86,1.138,87,1.004,90,1.234,93,0.431,97,0.674,98,0.626,106,1.978,110,2.029,112,2.566,115,2.183,117,1.656,119,1.656,149,2.813,150,2.566,151,2.813,152,2.265,153,1.37,154,1.21,155,1.65,156,1.458,157,1.99,158,2.552,159,1.768,160,1.37,162,2.183,163,1.891,164,1.458,165,2.599,167,2.394,168,1.553,169,1.458,170,2.183,171,2.029,172,2.183,173,2.813,175,1.891,176,1.891,177,1.21,178,1.891,179,2.029,310,5.004,311,5.004,312,1.37,313,3.124,314,1.458,315,4.534,316,4.169,317,3.539,318,1.768,319,4.169,320,2.029,321,1.768]],["title/animate.html",[104,1.924,322,1.368]],["contents/animate.html",[0,2.09,1,0.317,12,0.021,15,0.481,16,0.077,37,0.658,42,0.98,46,0.49,47,0.203,61,1.289,67,0.824,90,0.881,93,0.449,104,3.55,105,4.256,106,1.887,107,3.159,116,2.512,121,3.768,126,4.718,127,3.435,128,4.095,131,4.765,133,5.151,134,3.707,147,2.522,152,1.882,153,1.458,181,2.705,187,3.326,193,3.326,194,3.326,195,2.996,196,2.512,290,2.16,296,3.768,305,1.416,309,3.768,310,3.768,311,4.718,312,1.458,314,1.552,315,4.718,318,1.882,321,1.882,322,1.653,323,1.458,324,2.41,325,2.324,326,2.512,327,2.512,328,1.458,329,1.763,330,4.439,331,2.16,332,1.458,333,3.326,334,2.014,335,4.164,336,6.069,337,4.439,338,2.357,339,3.768,340,4.439,341,4.439,342,4.439,343,2.324,344,4.439,345,4.439]],["title/CHANGELOG.html",[346,3.352]],["contents/CHANGELOG.html",[0,1.876,1,0.297,2,0.103,3,0.602,4,1.698,5,1.139,6,0.387,8,0.734,9,0.584,10,0.507,11,0.89,12,0.021,14,1.328,15,0.567,16,0.116,17,0.652,20,1.247,23,0.646,24,2.09,25,0.573,26,0.541,28,0.836,29,1.08,30,0.343,31,0.699,33,0.694,34,0.687,36,0.949,37,0.154,41,0.389,42,0.705,44,0.283,46,0.393,47,0.214,48,1.034,49,0.376,50,1.15,51,1.413,52,0.604,53,0.454,54,0.718,57,0.971,58,0.939,59,0.396,63,0.277,64,1.211,65,0.696,66,1.166,69,0.854,70,0.646,75,1.534,78,0.236,79,0.414,81,0.871,82,0.322,84,0.866,87,1.117,90,0.474,93,0.408,95,0.498,97,0.473,98,0.214,103,0.961,104,1.894,106,1.265,107,2.104,111,0.53,114,1.471,116,0.806,117,0.949,120,1.353,122,0.949,127,1.353,128,1.613,139,1.791,140,0.876,141,1.617,154,1.267,155,0.738,156,1.265,157,2.218,158,2.304,159,1.851,161,1.641,163,0.646,164,0.498,167,1.15,168,1.347,169,0.498,175,1.084,176,1.401,177,0.413,178,0.646,181,1.503,185,1.067,197,1.967,198,0.961,206,1.084,208,0.89,209,3.515,232,0.961,285,0.806,292,1.108,293,1.471,294,1.471,297,1.829,305,1.301,318,0.604,320,2.123,321,0.604,323,1.015,324,1.933,328,1.932,329,1.436,332,2.049,338,1.014,343,1.617,346,2.314,347,1.424,348,3.089,349,1.424,350,3.07,351,3.422,352,2.754,353,1.901,354,3.041,355,1.424,356,1.067,357,3.064,358,1.209,359,4.031,360,2.029,361,1.209,362,2.39,363,1.424,364,2.71,365,2.39,366,2.123,367,2.39,368,0.876,369,1.617,370,1.067,371,1.424,372,3.241,373,2.39,374,1.829,375,1.067,376,1.613,377,2.314,378,2.141,379,1.209,380,2.591,381,3.474,382,2.71,383,1.613,384,1.209,385,1.748,386,1.471,387,1.613,388,1.209,389,1.067,390,1.209,391,1.209,392,1.791,393,0.876,394,1.067,395,1.209,396,2.959,397,2.048,398,3.02,399,1.209,400,1.791,401,1.791,402,1.353,403,2.047,404,2.084,405,0.746,406,1.503,407,1.471,408,1.209,409,1.084,410,3.114,411,1.014,412,2.029,413,1.961,414,2.084,415,1.067,416,1.424,417,1.563,418,1.424,419,2.39,420,1.791,421,1.424,422,1.424,423,1.424,424,1.424,425,1.851,426,3.617,427,3.07,428,3.07,429,3.704,430,3.936,431,2.029,432,1.209,433,1.424,434,2.104,435,2.39,436,2.029,437,2.39,438,1.424,439,1.209,440,1.067,441,5.499,442,3.617,443,3.617,444,3.617,445,1.424,446,1.782,447,1.791,448,1.209,449,1.424,450,1.424,451,1.424,452,3.916,453,1.209,454,1.424,455,1.424,456,1.209,457,1.424,458,1.209,459,1.424,460,1.424,461,1.424,462,1.424,463,2.622,464,2.296,465,1.471,466,1.424,467,1.424,468,1.163,469,1.424,470,2.365,471,1.067,472,1.424,473,2.39,474,2.029,475,1.424,476,1.424,477,2.39,478,1.067,479,1.424,480,1.424,481,1.424,482,1.424,483,1.209,484,2.029,485,1.209,486,1.209,487,1.424,488,2.029,489,2.314,490,1.209,491,1.424,492,3.474,493,1.209,494,1.424,495,1.209,496,1.209,497,1.424,498,1.067,499,1.424,500,1.424,501,1.424,502,0.961,503,1.424,504,1.424,505,1.424,506,1.424,507,1.424,508,1.424,509,1.424,510,2.084,511,1.424,512,1.617,513,1.424,514,1.424,515,1.424,516,1.424,517,1.424,518,1.791,519,1.424,520,4.011,521,1.209,522,0.961,523,0.961,524,1.209,525,1.067,526,1.209,527,2.029,528,0.961,529,1.424,530,0.961,531,1.067,532,2.111,533,1.067,534,1.424,535,1.791,536,1.067,537,1.613,538,1.209,539,1.067,540,0.806,541,1.424,542,1.424,543,0.961,544,1.209,545,1.067,546,1.209,547,1.424,548,1.424,549,1.424,550,1.424,551,1.209,552,1.424,553,0.961,554,1.424,555,1.424,556,1.067,557,1.613,558,1.209,559,1.209,560,0.566,561,2.71,562,1.353,563,1.424,564,1.424,565,4.364,566,1.067,567,1.067,568,0.961,569,1.748,570,2.39,571,2.441,572,1.067,573,1.424,574,3.089,575,1.209,576,1.424,577,1.424,578,1.424,579,1.424,580,1.424,581,2.084,582,1.791,583,0.961,584,1.067,585,0.876,586,0.693,587,1.209,588,0.693,589,1.424,590,2.39,591,1.209,592,1.353,593,1.209,594,1.424,595,1.424,596,4.031,597,1.067,598,0.876,599,1.424,600,1.209,601,1.617,602,1.209,603,1.901,604,1.617,605,2.029,606,2.029,607,1.209,608,1.901,609,1.424,610,1.424,611,1.209,612,1.424,613,1.424,614,1.424,615,1.424,616,2.39,617,1.424,618,0.876,619,1.424,620,1.424,621,3.07,622,3.07,623,2.029,624,0.961,625,0.961,626,1.209,627,2.029,628,2.047,629,1.613,630,1.613,631,3.089,632,2.029,633,1.791,634,1.353,635,2.441,636,3.07,637,2.72,638,1.17,639,1.424,640,1.424,641,1.613,642,1.424,643,0.961,644,1.424,645,1.424,646,1.067,647,1.067,648,1.424,649,0.806,650,1.067,651,0.746,652,1.067,653,1.791,654,1.067,655,1.209,656,2.622,657,0.746,658,1.209,659,1.209,660,1.424,661,1.067,662,2.39,663,1.209,664,2.441,665,2.029,666,1.613,667,0.876,668,1.424,669,2.314,670,1.791,671,1.424,672,1.209,673,1.209,674,1.613,675,1.424,676,2.481,677,2.39,678,2.39,679,1.067,680,1.209,681,1.209,682,1.209,683,1.067,684,2.39,685,2.029,686,0.961,687,1.424,688,1.424]],["title/color-config.html",[160,1.207,305,0.779]],["contents/color-config.html",[1,0.267,7,0.594,8,0.885,12,0.023,46,0.407,47,0.22,53,0.539,75,2.138,83,1.557,102,2.912,112,3.103,160,1.656,169,1.763,181,2.453,292,1.069,305,1.497,312,1.656,328,1.656,331,3.123,366,3.234,376,3.402,383,3.402,470,2.818,532,3.48,597,3.777,598,3.103,634,2.854,649,3.633]],["title/color-contrast.html",[1,0.138,93,0.251,470,1.238]],["contents/color-contrast.html",[1,0.323,2,0.111,3,0.559,4,1.896,5,0.696,6,0.377,7,0.574,8,0.635,9,0.937,10,0.447,12,0.017,16,0.036,25,1.077,26,0.368,28,1.727,30,0.972,34,0.325,37,0.536,41,1.752,42,0.736,44,0.687,46,0.368,47,0.219,49,0.418,51,0.612,53,0.542,54,0.98,56,0.737,59,0.462,63,0.469,65,0.996,67,0.61,68,0.742,69,0.696,74,1.168,75,0.894,78,0.574,82,0.912,86,0.896,87,0.791,90,0.98,93,0.456,95,1.149,97,0.69,99,1.932,102,2.743,103,1.423,116,1.193,141,1.104,177,1.434,197,0.894,232,3.074,292,1.047,295,2.021,298,2.021,305,1.53,318,2.945,338,1.393,366,3.273,378,2.069,386,1.297,409,1.831,411,0.894,470,2.862,478,3.023,493,1.789,512,2.586,518,2.461,522,3.074,523,1.423,524,4.192,525,4.092,526,5.345,527,5.345,528,3.686,530,4.005,532,3.491,540,2.579,558,3.867,560,0.837,566,1.579,568,1.423,583,3.074,584,4.233,634,1.859,638,1.685,649,3.564,689,2.108,690,5.037,691,3.812,692,4.556,693,3.413,694,3.284,695,4.192,696,3.284,697,4.795,698,4.601,699,5.212,700,5.649,701,5.231,702,1.859,703,2.108,704,2.108,705,1.789,706,2.461,707,2.216,708,2.108,709,2.108,710,2.108,711,2.108,712,3.023,713,4.092,714,2.108,715,3.284,716,2.108,717,1.579,718,2.788,719,1.026]],["title/color-themes.html",[533,3.352]],["contents/color-themes.html",[1,0.321,2,0.1,6,0.341,7,0.534,9,0.562,10,0.738,12,0.02,15,0.378,16,0.108,30,1.299,34,0.534,37,0.585,42,0.935,44,0.638,46,0.383,47,0.204,49,0.341,53,0.312,59,0.341,63,0.484,75,2.288,78,0.534,84,1.203,86,0.951,90,1.071,92,3.564,97,0.515,108,2.308,114,2.144,119,1.383,147,2.627,153,1.144,161,1.58,164,1.659,177,1.566,232,3.908,287,3.64,295,2.144,297,1.58,305,1.526,318,2.569,334,2.749,366,2.948,405,1.824,518,4.041,531,2.61,532,3.173,533,4.54,535,4.684,536,2.61,538,4.916,539,3.554,543,3.64,598,3.848,600,2.957,604,3.033,651,1.824,698,4.54,713,2.61,720,4.744,721,4.744,722,3.483,723,1.972,724,3.483,725,2.957,726,2.144,727,2.957,728,3.483,729,5.049,730,5.72,731,3.201,732,3.483,733,3.483,734,3.483,735,3.483,736,3.483,737,4.744,738,4.744,739,4.744,740,4.744,741,4.744,742,4.026,743,4.744,744,5.143,745,4.744,746,3.483,747,5.791,748,4.916,749,4.916,750,5.791,751,5.791,752,4.744,753,4.744,754,5.791,755,5.791,756,5.791,757,5.791,758,5.791,759,5.791,760,4.026,761,4.744,762,3.483,763,3.483]],["title/color-tokens.html",[26,0.296,305,0.779]],["contents/color-tokens.html",[1,0.314,2,0.097,3,0.511,5,0.68,6,0.231,7,0.603,8,0.821,9,0.834,10,1.326,12,0.02,16,0.121,21,0.991,25,0.596,30,1.417,31,0.777,33,0.932,34,0.444,37,0.56,39,3.971,41,1.224,42,0.518,44,0.531,46,0.451,47,0.222,49,0.439,51,0.932,53,0.502,54,0.89,55,1.196,56,1.123,58,1.204,59,0.439,63,0.402,64,1.186,65,0.775,67,0.596,68,0.726,74,1.509,75,1.902,78,0.444,79,0.556,81,0.773,84,0.637,86,0.876,87,1.08,90,1.267,93,0.475,97,0.607,98,0.482,102,1.457,110,1.562,115,1.681,117,1.275,119,1.275,122,1.275,149,2.166,150,1.976,151,2.166,152,1.902,153,1.473,154,1.624,155,1.385,156,1.123,157,1.196,158,2.222,159,1.361,160,1.055,162,1.681,163,1.457,167,2.192,168,1.196,169,1.123,170,1.681,171,1.562,172,1.681,173,2.166,175,1.457,176,1.457,177,0.932,178,1.457,179,1.562,290,1.562,292,0.68,293,1.976,305,1.543,314,1.123,317,2.725,318,2.496,320,1.562,321,1.361,323,1.055,332,1.055,357,2.538,366,2.722,383,2.166,405,1.681,411,1.361,425,2.191,434,1.457,470,2.485,502,3.775,532,3.193,535,3.872,543,2.166,586,1.562,588,1.562,598,1.976,637,2.166,638,0.932,649,1.817,667,1.976,669,2.405,690,2.725,699,2.725,707,2.166,713,2.405,717,2.405,729,2.405,731,2.166,764,3.821,765,3.21,766,3.21,767,3.21,768,3.21,769,2.725,770,2.725,771,2.725,772,3.806,773,3.806,774,3.806,775,3.21,776,5.167,777,2.725,778,3.21,779,3.21,780,4.484,781,3.21,782,1.817,783,1.976,784,1.817,785,2.725,786,1.562,787,2.725,788,3.21,789,3.21,790,3.21,791,3.21,792,3.21,793,2.725,794,3.21,795,2.725,796,3.21,797,3.21]],["title/color-utils.html",[58,0.83]],["contents/color-utils.html",[1,0.294,2,0.094,6,0.452,8,0.864,9,0.877,10,1.151,12,0.022,30,1.308,31,0.941,33,1.576,34,0.537,47,0.219,49,0.452,53,0.487,58,1.008,59,0.452,63,0.487,65,0.815,75,2.661,78,0.537,86,1.482,90,1.246,97,0.681,102,2.463,112,3.341,153,1.784,157,2.022,294,3.341,305,1.53,357,2.463,366,3.312,374,1.94,470,2.749,532,3.564,540,3.073,597,5.099,598,4.074,637,3.664,638,1.576,649,3.073,786,2.642,798,6.275,799,4.608,800,5.429,801,6.805,802,5.429,803,5.429]],["title/color-vars.html",[1,0.106,2,0.041,3,0.237,26,0.193,305,0.507]],["contents/color-vars.html",[1,0.318,2,0.119,3,0.67,4,2.156,5,1.387,6,0.448,7,0.578,8,0.406,9,0.51,10,0.939,11,1.175,12,0.022,13,2.01,14,0.861,15,0.481,16,0.117,17,0.861,18,1.653,19,1.653,20,0.669,21,0.974,22,1.786,23,1.432,24,1.175,25,1.086,26,0.521,27,1.253,28,1.104,29,1.549,30,1.408,31,0.887,32,1.536,33,1.612,34,0.549,35,2.205,36,2.205,37,0.689,39,2.99,40,1.653,41,1.515,42,0.896,44,0.657,45,1.786,46,0.472,47,0.194,48,0.809,49,0.436,50,1.175,51,0.916,52,1.338,53,0.283,54,1.102,55,1.175,56,1.104,57,1.337,58,0.586,59,0.481,60,1.104,61,0.916,62,1.338,63,0.459,64,1.32,65,0.935,66,1.085,67,0.586,68,0.713,69,0.939,70,1.432,71,3.432,72,3.151,73,3.976,74,1.679,75,2.171,76,3.746,77,3.747,78,0.506,79,0.547,80,2.855,81,1.067,82,1.002,83,1.714,84,0.879,85,2.156,86,1.209,87,1.067,88,2.01,89,2.156,90,0.626,91,2.99,92,2.727,93,0.255,94,1.253,95,1.104,96,1.536,97,0.481,98,0.474,99,1.879,102,2.01,305,1.531,470,1.76,697,4.964,795,2.679,804,5.552,805,2.679]],["title/color.html",[305,0.779,322,1.368]],["contents/color.html",[1,0.314,3,0.512,5,0.842,8,0.511,9,0.642,10,1.098,12,0.022,16,0.112,17,1.085,25,1.205,26,0.511,27,1.579,37,0.431,39,4.12,42,0.93,46,0.465,47,0.184,49,0.286,51,1.154,53,0.356,58,0.738,59,0.286,61,1.154,65,0.596,67,0.738,74,1.019,75,2.197,76,3.584,79,0.689,84,0.789,86,1.085,90,1.257,93,0.321,97,0.431,98,0.596,102,1.803,116,2.25,117,1.579,141,2.081,144,1.934,152,2.197,153,1.306,154,1.504,155,1.955,160,1.306,167,1.48,170,2.081,181,1.934,290,1.934,305,1.524,312,1.306,314,1.811,318,2.443,321,1.686,322,1.48,323,1.702,324,2.288,325,2.081,326,2.25,327,2.25,328,1.306,329,1.579,331,1.934,332,1.702,335,2.978,338,2.443,366,3.159,383,2.682,409,1.803,411,1.686,470,2.736,502,3.495,525,4.317,532,3.399,560,1.579,569,2.25,634,2.25,649,3.261,651,2.712,670,2.978,764,3.943,772,4.397,773,4.397,774,4.397,784,2.25,785,3.374,786,1.934,805,3.374,806,2.25,807,3.374,808,5.18,809,5.18,810,5.18,811,2.682,812,3.374,813,2.446,814,3.975,815,3.975,816,3.975,817,3.975,818,5.18,819,3.975]],["title/CONTRIBUTING.html",[567,3.352]],["contents/CONTRIBUTING.html",[0,1.847,1,0.25,12,0.021,15,0.49,18,2.368,19,2.368,20,0.958,24,1.684,25,0.839,44,0.535,56,1.581,60,1.581,67,1.136,83,1.396,87,1.089,111,1.684,153,1.485,155,1.89,166,4.053,168,1.684,169,1.966,176,2.051,178,2.551,197,1.917,198,3.051,285,2.559,292,0.958,314,1.966,346,3.388,353,3.461,414,3.794,428,3.838,429,5.194,430,4.773,431,3.838,440,3.388,464,2.051,465,4.131,510,4.13,530,3.051,540,2.559,567,3.388,634,2.559,651,3.205,679,3.388,705,3.838,782,2.559,786,2.2,793,3.838,799,3.838,811,3.051,812,3.838,813,2.783,820,6.12,821,5.623,822,5.623,823,3.051,824,5.623,825,2.783,826,4.522,827,4.522,828,4.522,829,2.783,830,5.623,831,4.522,832,4.522,833,4.522,834,4.522,835,4.522,836,4.522,837,4.773,838,4.522,839,5.623,840,4.522,841,5.778,842,3.051,843,4.522,844,6.585,845,5.623,846,4.522,847,3.838,848,4.522,849,5.623,850,5.434,851,5.623,852,3.838,853,4.522,854,4.522,855,4.522,856,4.522,857,3.388,858,4.522,859,4.522]],["title/index.html",[15,0.398,314,1.285]],["contents/index.html",[1,0.318,2,0.102,3,0.582,6,0.261,8,0.466,9,0.585,11,1.35,12,0.023,14,1.329,15,0.638,16,0.117,17,0.989,20,1.392,26,0.537,47,0.206,48,1.249,58,0.904,59,0.261,61,1.052,64,1.167,66,1.167,67,1.022,69,0.768,74,0.929,78,0.358,79,0.628,83,1.119,84,1.093,93,0.292,98,0.544,104,2.551,105,2.23,114,2.23,115,1.897,122,1.439,147,1.644,152,2.066,154,1.414,155,1.119,168,1.35,171,2.371,175,2.21,181,1.763,206,1.644,209,2.23,292,1.248,305,1.167,312,2.123,313,2.715,314,1.267,323,1.601,328,2.123,329,2.186,332,1.934,338,1.537,339,4.135,353,2.23,354,2.051,369,1.897,372,2.551,374,2.21,375,2.715,376,2.445,377,2.715,378,1.934,379,3.075,380,2.497,382,2.715,385,2.757,403,2.757,407,2.23,413,1.763,417,1.504,425,2.334,427,4.135,434,1.644,446,1.052,464,1.644,468,2.678,470,1.439,492,2.715,510,2.445,520,2.23,539,3.65,560,1.935,568,4.268,571,2.445,586,1.763,588,1.763,592,2.051,601,1.897,604,2.882,608,2.23,638,1.052,647,2.715,657,1.897,686,2.445,702,2.051,769,3.075,782,2.051,783,2.23,784,2.757,786,1.763,806,3.476,807,3.075,841,4.135,860,3.623,861,3.075,862,4.672,863,4.672,864,3.623,865,3.075,866,3.623,867,3.623,868,3.623,869,3.623,870,2.445,871,3.623,872,3.65,873,3.623,874,3.623,875,5.504,876,3.623,877,4.872,878,3.623,879,3.623,880,3.623,881,3.623,882,3.075,883,3.65,884,3.075,885,3.075,886,3.075,887,2.371,888,3.288,889,2.23,890,2.445,891,3.075,892,2.445,893,3.623,894,3.623,895,3.075,896,3.075,897,2.715,898,3.623,899,3.623,900,3.623,901,3.075,902,3.623,903,2.23,904,3.075,905,3.075,906,2.23,907,3.075,908,3.075,909,3.075,910,2.445,911,3.075,912,3.623,913,3.075,914,3.075,915,3.075]],["title/layout-queries.html",[16,0.054,585,1.918,916,2.335]],["contents/layout-queries.html",[1,0.321,2,0.101,3,0.252,6,0.387,7,0.617,8,0.771,9,0.412,10,1.237,12,0.022,15,0.545,16,0.113,17,1.238,25,1.158,28,1.758,31,0.658,33,1.46,34,0.593,37,0.545,41,1.749,42,0.91,44,0.691,46,0.455,47,0.199,48,0.654,49,0.42,53,0.482,55,0.95,58,1.294,59,0.466,60,0.892,61,0.741,63,0.451,64,0.962,65,0.383,66,0.541,69,0.962,78,0.497,81,1.093,82,1.026,83,0.788,84,0.901,90,0.754,92,3.468,93,0.206,97,0.545,98,0.383,106,0.696,154,1.103,156,0.892,157,1.69,158,1.802,159,1.082,161,2.059,162,1.336,163,1.157,164,0.892,165,3.081,167,0.95,181,2.447,197,1.611,294,1.57,314,1.758,318,2.719,331,1.241,332,1.248,333,2.846,338,1.611,352,2.569,357,2.831,368,1.57,374,1.157,380,2.721,387,1.722,389,3.4,397,0.95,405,1.336,413,1.241,414,1.722,415,1.911,417,1.803,425,1.082,464,2.281,465,2.793,512,1.989,520,2.338,522,1.722,523,2.563,530,1.722,540,2.569,562,2.569,571,3.393,581,4.672,582,4.803,583,4.509,584,5.034,585,3.773,586,2.208,587,5.203,624,2.563,625,1.722,635,2.563,667,1.57,669,1.911,672,2.165,686,3.063,691,3.063,718,3.224,723,1.444,748,4.268,749,4.955,771,3.852,786,1.241,823,1.722,889,1.57,892,1.722,903,1.57,916,4.899,917,1.911,918,2.551,919,1.911,920,5.376,921,3.4,922,6.13,923,2.551,924,1.57,925,1.722,926,2.165,927,2.793,928,2.551,929,2.376,930,3.852,931,4.631,932,3.767,933,4.538,934,4.538,935,5.028,936,4.538,937,3.19,938,2.551,939,3.798,940,2.551,941,5.376,942,3.798,943,2.551,944,5.376,945,2.551,946,2.551,947,3.798,948,2.551,949,2.551,950,1.911]],["title/layout-z-index.html",[951,2.752,952,2.479]],["contents/layout-z-index.html",[1,0.31,2,0.097,3,0.552,6,0.402,7,0.552,12,0.019,14,1.22,30,1.345,34,0.442,37,0.485,46,0.451,47,0.194,49,0.459,54,1.266,59,0.472,63,0.501,67,0.83,68,1.011,69,1.183,78,0.552,82,1.262,94,1.775,97,0.66,111,1.665,145,3.349,147,2.533,148,3.017,156,1.563,160,2.156,177,1.621,198,3.017,297,2.028,320,2.717,331,2.175,334,2.533,354,2.53,393,2.751,409,2.028,413,2.175,420,4.183,458,4.739,521,3.794,601,2.341,638,1.943,695,3.794,712,3.349,726,2.751,813,2.751,951,5.371,952,4.87,953,6.864,954,3.794,955,3.794,956,4.47,957,3.794,958,4.47,959,3.794,960,4.47,961,4.47,962,4.47]],["title/layout.html",[322,1.368,381,2.752]],["contents/layout.html",[1,0.317,2,0.085,12,0.02,15,0.532,16,0.085,42,0.954,46,0.395,49,0.353,55,1.825,59,0.353,68,1.108,74,1.626,93,0.477,153,1.61,174,3.672,290,2.385,312,1.941,321,2.078,322,1.825,323,1.61,324,2.518,325,2.566,326,2.774,327,2.774,328,1.61,329,1.946,331,2.385,352,2.774,380,2.223,381,4.751,417,1.824,447,4.426,510,3.307,562,2.774,581,4.546,582,3.672,583,3.307,585,4.051,586,2.385,638,1.423,657,2.566,916,4.932,927,3.016,931,3.307,932,3.672,951,3.672,952,3.307,957,5.014,963,4.901,964,4.901,965,4.901,966,4.901,967,4.901,968,4.901,969,3.672,970,4.901,971,4.901,972,4.901]],["title/LICENSE.html",[973,3.118,974,2.752]],["contents/LICENSE.html",[1,0.218,12,0.02,42,1.024,94,1.946,127,2.774,167,1.825,286,4.16,292,1.039,314,1.714,411,2.689,456,4.16,744,4.16,825,3.016,829,3.016,872,3.672,896,4.16,919,3.672,927,3.016,973,4.16,974,3.672,975,6.341,976,4.901,977,5.907,978,4.901,979,4.901,980,4.901,981,4.901,982,5.907,983,6.583,984,7.03,985,5.907,986,4.901,987,5.014,988,4.901,989,4.901,990,4.901,991,4.901,992,4.901,993,4.901,994,4.901,995,4.901,996,4.901,997,4.901,998,5.907,999,5.907,1000,4.901,1001,4.901,1002,5.907,1003,4.901,1004,4.901,1005,4.901,1006,4.901,1007,4.901,1008,4.901,1009,4.901,1010,4.901,1011,4.16,1012,4.901,1013,4.901,1014,4.901,1015,4.901,1016,4.901,1017,3.672,1018,4.901,1019,4.901,1020,4.901,1021,4.901]],["title/ratio-tokens.html",[26,0.296,378,1.207]],["contents/ratio-tokens.html",[1,0.321,2,0.096,3,0.488,5,0.781,6,0.355,7,0.586,8,0.714,9,0.796,10,1.045,12,0.022,14,1.006,15,0.535,16,0.121,26,0.524,31,0.854,34,0.586,37,0.602,44,0.583,46,0.398,47,0.211,48,1.264,49,0.458,51,1.07,53,0.442,54,0.978,57,0.888,58,0.915,59,0.458,63,0.498,64,1.256,65,0.833,66,0.781,67,0.684,68,0.833,78,0.549,83,1.138,84,0.732,87,0.888,90,1.102,93,0.298,97,0.67,98,0.74,152,1.563,155,1.522,156,1.289,157,1.836,158,1.957,159,1.563,160,1.211,162,1.931,163,1.673,164,1.724,167,2.208,168,1.373,177,1.793,178,1.673,179,1.794,196,3.143,206,1.673,208,1.373,287,4.169,290,1.794,292,1.256,297,2.519,314,1.289,323,1.211,332,1.211,334,2.236,338,1.563,378,2.371,380,2.236,397,1.836,403,2.087,409,2.519,410,2.269,413,1.794,425,1.563,512,2.908,523,3.326,543,2.488,560,1.464,588,1.794,625,2.488,629,2.488,698,3.693,712,3.693,726,2.269,782,2.087,783,2.269,784,2.087,903,2.269,924,2.269,926,3.129,937,2.087,1022,3.129,1023,2.269,1024,3.129,1025,3.687,1026,3.687,1027,3.687,1028,3.129,1029,3.687,1030,3.687,1031,5.927,1032,3.687,1033,4.184,1034,3.687,1035,3.687,1036,5.031,1037,3.687,1038,3.687,1039,3.687,1040,3.687]],["title/ratio-vars.html",[1,0.106,2,0.041,3,0.237,26,0.193,378,0.786]],["contents/ratio-vars.html",[1,0.32,2,0.118,3,0.658,4,2.132,5,1.377,6,0.451,7,0.584,8,0.416,10,0.685,12,0.021,13,1.467,15,0.351,16,0.115,25,1.095,26,0.536,27,1.284,28,1.131,29,1.576,30,1.421,31,0.899,32,1.573,33,1.629,34,0.555,35,2.228,36,2.228,37,0.694,40,1.693,41,1.531,42,0.906,44,0.664,45,1.83,46,0.453,47,0.188,48,0.829,49,0.468,50,1.204,51,0.939,52,1.371,53,0.29,54,1.114,55,1.204,56,1.131,57,1.351,58,0.6,59,0.483,60,1.131,61,0.939,62,1.371,63,0.465,64,1.329,65,0.941,66,1.099,67,0.6,68,0.731,69,0.955,70,1.467,78,0.513,79,0.56,80,2.866,81,1.085,82,1.019,83,1.733,84,0.895,85,2.193,86,1.23,87,1.085,88,2.045,89,2.193,90,0.642,93,0.261,94,1.284,95,1.131,96,1.573,97,0.489,98,0.485,99,1.911,378,2.37,592,2.936,760,3.825,888,3.041,891,4.403,937,3.724,969,3.376,1022,5.008,1023,3.998,1024,3.825,1041,4.506,1042,5.611,1043,5.428,1044,5.008,1045,3.376,1046,4.506,1047,3.233,1048,4.506,1049,3.233,1050,3.825]],["title/ratios.html",[206,1.667,378,1.207]],["contents/ratios.html",[1,0.325,2,0.08,3,0.458,4,1.431,5,1.21,7,0.458,12,0.021,26,0.374,34,0.458,37,0.503,44,0.548,46,0.461,47,0.182,49,0.445,51,1.657,59,0.445,81,1.116,88,2.103,119,1.841,168,1.726,205,3.934,206,2.59,208,1.726,209,2.852,211,3.472,212,3.934,292,0.982,321,1.965,332,1.523,334,2.103,350,5.482,378,2.219,411,1.965,545,4.278,591,5.482,592,3.231,611,3.934,924,3.514,1043,3.934,1044,3.934,1045,3.472,1050,3.934,1051,4.634,1052,4.634,1053,5.709,1054,4.634,1055,5.709,1056,5.709,1057,4.634,1058,4.634,1059,4.634,1060,5.709,1061,4.634,1062,5.709,1063,4.634,1064,4.634,1065,4.634,1066,4.634,1067,4.634,1068,4.634]],["title/scale-sizes.html",[16,0.064,417,1.134]],["contents/scale-sizes.html",[0,1.531,1,0.307,2,0.089,3,0.389,6,0.37,7,0.461,8,0.505,9,0.753,10,0.988,11,0.994,12,0.022,13,1.782,15,0.558,16,0.122,20,0.566,21,0.824,25,0.729,28,0.934,29,0.934,30,0.946,31,0.993,34,0.508,37,0.426,41,0.729,42,0.753,44,0.316,46,0.415,47,0.215,48,1.64,49,0.447,53,0.239,54,1.02,55,0.994,58,1.187,59,0.466,60,1.374,63,0.461,64,1.315,65,0.699,66,0.988,67,0.729,68,0.888,69,0.988,74,1.195,78,0.542,79,0.891,81,0.643,82,0.888,84,0.53,86,1.272,87,0.643,90,1.206,93,0.317,97,0.659,98,0.822,106,1.072,108,1.299,110,1.299,111,0.994,112,1.643,114,2.418,115,1.398,120,1.511,152,1.132,154,0.775,155,1.213,156,1.63,157,1.736,158,2.464,159,1.977,160,1.882,161,2.599,162,2.441,163,2.115,164,1.63,165,3.069,166,2.418,167,2.04,168,0.994,169,0.934,170,1.398,171,1.299,172,1.398,175,1.211,176,2.485,177,0.775,178,1.211,179,1.299,290,1.299,292,0.988,303,2,314,1.798,332,0.877,334,2.599,343,2.441,356,3.492,357,2.332,358,2.266,361,2.266,368,1.643,370,3.492,378,0.877,380,1.782,417,2.21,425,1.666,446,1.14,464,3.183,468,3.149,546,2.266,572,2.943,588,1.299,592,2.224,593,3.335,601,2.441,618,2.418,626,3.956,627,3.956,628,2.638,629,3.146,630,3.997,632,3.956,633,3.851,634,2.638,635,3.997,636,4.863,637,3.866,638,1.663,646,2,654,2.943,655,3.956,656,5.266,674,2.651,676,2.869,680,3.335,706,3.492,719,2.268,725,2.266,731,1.802,782,1.511,783,1.643,784,1.511,825,2.869,883,2,887,1.299,890,2.651,903,1.643,925,1.802,929,1.398,931,2.651,937,2.909,1023,2.418,1028,2.266,1069,2.67,1070,3.646,1071,2.651,1072,2.266,1073,2.67,1074,2.67,1075,2.67,1076,2.266,1077,2.651,1078,2.67,1079,4.661,1080,4.661,1081,2.67,1082,3.929,1083,3.929,1084,3.929]],["title/scale-units.html",[464,1.667,630,2.479]],["contents/scale-units.html",[1,0.294,6,0.464,8,0.793,12,0.016,15,0.669,16,0.107,25,0.855,31,0.798,34,0.456,47,0.215,48,1.805,49,0.332,53,0.594,54,0.915,59,0.41,63,0.51,78,0.456,97,0.5,154,1.651,156,1.611,161,2.09,165,3.408,177,1.337,197,2.412,295,2.836,368,3.798,369,2.413,404,3.839,406,2.768,417,2.045,446,1.651,464,3.208,468,2.768,512,2.979,560,1.83,575,4.829,581,3.109,585,2.836,586,2.242,635,3.839,702,2.608,706,3.452,719,3.003,870,3.109,887,2.242,925,4.165,929,2.413,954,5.62,1085,4.607,1086,4.607,1087,4.607,1088,4.607,1089,4.607,1090,4.607,1091,4.607,1092,4.607]],["title/scale-vars.html",[1,0.12,2,0.047,3,0.268,417,0.836]],["contents/scale-vars.html",[1,0.319,2,0.119,3,0.672,4,2.146,5,1.391,6,0.45,7,0.581,8,0.411,9,0.516,10,0.948,11,1.191,12,0.021,13,2.029,14,0.872,15,0.485,16,0.117,17,0.872,18,1.674,19,1.674,20,0.678,21,0.987,22,1.81,23,1.451,24,1.191,25,1.091,26,0.523,27,1.27,28,1.118,29,1.564,30,1.415,31,0.894,32,1.556,33,1.621,34,0.552,35,2.218,36,2.218,37,0.692,40,1.674,41,1.524,42,0.902,44,0.661,45,1.81,46,0.451,47,0.188,48,0.82,49,0.438,50,1.191,51,0.928,52,1.356,53,0.287,54,1.108,55,1.191,56,1.118,57,1.345,58,0.594,59,0.482,60,1.118,61,0.928,62,1.356,63,0.462,64,1.325,65,0.938,66,1.093,67,0.594,68,0.723,69,0.948,70,1.451,78,0.51,79,0.554,80,2.861,81,1.077,82,1.011,83,1.724,84,0.888,85,2.176,86,1.22,87,1.077,88,2.029,89,2.176,90,0.635,93,0.258,94,1.27,95,1.118,96,1.556,97,0.485,98,0.48,99,1.896,106,1.407,417,2.227,887,2.509,924,3.173,937,2.531,969,4.184,1023,4.083,1070,3.437,1093,5.876,1094,3.795,1095,5.584,1096,6.089,1097,4.918,1098,4.471,1099,3.197,1100,3.197,1101,4.471]],["title/scale.html",[322,1.368,380,1.667]],["contents/scale.html",[1,0.32,2,0.067,7,0.384,8,0.5,9,0.824,12,0.022,15,0.422,16,0.105,20,0.824,26,0.46,28,1.785,30,1.229,34,0.505,37,0.554,44,0.46,47,0.213,48,1.462,49,0.41,53,0.458,54,0.771,56,1.359,58,0.721,59,0.464,63,0.348,64,0.824,65,0.583,74,0.997,78,0.384,79,0.674,82,0.879,84,0.771,90,1.013,93,0.46,95,1.359,97,0.554,98,0.583,141,2.673,144,1.891,147,2.586,153,1.277,154,1.128,159,2.165,164,1.785,174,2.912,177,1.909,196,3.226,197,2.165,208,1.448,285,3.226,287,4.438,292,1.082,297,1.763,312,1.277,322,1.448,323,1.277,324,2.264,325,2.035,326,2.2,327,2.2,328,1.277,329,1.544,331,1.891,334,2.316,351,4.333,378,2.282,380,3.166,397,1.448,402,2.2,405,2.673,409,1.763,411,1.648,412,4.838,414,2.623,415,2.912,417,2.133,446,1.128,464,2.586,468,3.2,560,1.544,569,2.2,586,1.891,618,2.392,630,2.623,654,2.912,676,3.141,719,2.484,726,2.392,823,2.623,889,2.392,892,2.623,925,2.623,930,3.299,931,2.623,1033,3.299,1045,2.912,1070,2.392,1071,2.623,1077,2.623,1097,2.912,1102,3.299,1103,3.887,1104,3.887,1105,3.887,1106,2.912,1107,3.299,1108,3.887,1109,3.887,1110,3.887,1111,3.887,1112,3.887,1113,5.7,1114,3.887,1115,3.887,1116,3.887,1117,3.887,1118,3.887,1119,3.299]],["title/token-api.html",[26,0.296,93,0.296]],["contents/token-api.html",[0,0.791,1,0.323,2,0.091,5,0.51,6,0.377,7,0.483,9,0.389,11,0.897,12,0.021,14,1.196,15,0.598,16,0.124,17,0.657,21,0.743,25,0.447,26,0.55,27,0.956,29,0.842,31,0.417,33,1.056,34,0.608,35,0.956,37,0.475,42,0.389,44,0.728,47,0.218,48,1.468,49,0.352,52,1.021,53,0.47,57,1.263,58,1.201,59,0.502,61,1.056,63,0.326,65,0.361,74,0.933,78,0.36,79,0.417,82,0.822,84,0.969,87,0.58,93,0.476,94,1.444,95,0.842,97,0.598,98,0.658,104,1.26,106,1.678,108,2.133,117,1.444,119,1.94,120,2.764,122,1.444,123,3.72,139,1.803,140,1.481,142,1.481,143,1.624,144,1.171,154,1.878,156,0.842,157,0.897,158,2.082,159,1.021,161,1.092,163,1.65,164,1.834,169,1.272,195,2.454,196,1.362,207,2.043,208,1.354,285,1.362,292,1.214,297,1.65,305,0.771,312,1.195,320,2.786,321,1.859,328,0.791,331,1.171,332,1.937,334,2.502,338,1.021,343,2.295,353,1.481,354,1.362,357,1.988,372,1.904,374,1.092,380,2.502,387,1.624,393,3.227,396,1.362,397,2.43,400,2.725,401,3.659,402,1.362,403,3.241,404,1.624,405,1.904,407,2.238,410,1.481,411,2.071,413,1.171,417,1.353,425,1.542,434,1.65,436,2.043,439,2.043,446,0.699,464,2.379,468,3.328,471,1.803,486,3.72,489,2.725,490,2.043,498,1.803,520,2.697,528,3.296,545,2.725,553,2.454,560,1.444,562,1.362,569,1.362,572,1.803,586,1.171,592,2.058,604,1.904,618,1.481,625,1.624,628,1.362,646,1.803,652,1.803,653,3.659,661,1.803,670,1.803,676,3.394,691,2.454,702,2.764,717,3.284,719,1.171,723,1.362,729,1.803,777,2.043,786,1.171,813,2.697,825,1.481,850,2.043,857,1.803,883,1.803,887,3.081,888,3.864,889,1.481,892,3.721,905,2.043,906,1.481,924,3.227,927,1.481,937,2.481,950,1.803,1023,2.697,1070,2.697,1071,2.454,1072,2.043,1077,1.624,1094,3.087,1097,2.725,1106,3.284,1120,2.043,1121,2.407,1122,2.043,1123,3.087,1124,2.407,1125,2.043,1126,2.043,1127,4.145,1128,2.407,1129,4.145,1130,3.087,1131,2.407,1132,2.043,1133,2.407,1134,2.407,1135,2.407,1136,3.636,1137,2.407,1138,2.043,1139,3.087,1140,2.407,1141,1.803,1142,2.407,1143,2.407,1144,2.958,1145,2.407,1146,2.407,1147,3.087,1148,3.087,1149,3.636,1150,2.407,1151,2.407,1152,3.636,1153,2.407,1154,2.407,1155,2.407]],["title/token-config.html",[26,0.296,160,1.207]],["contents/token-config.html",[1,0.223,6,0.362,7,0.497,8,0.771,12,0.017,16,0.087,20,1.359,26,0.484,31,1.15,34,0.497,44,0.595,47,0.212,53,0.538,57,1.444,65,0.996,93,0.406,97,0.545,122,2.382,160,1.651,197,2.718,206,2.721,208,1.872,292,1.065,312,1.651,352,2.845,357,2.28,396,3.394,397,2.387,398,4.493,434,2.721,440,4.493,463,5.441,465,3.093,471,3.765,478,3.765,483,4.266,484,5.09,485,4.266,495,4.266,496,4.266,536,3.765,847,4.266,1011,5.09,1076,4.266,1144,4.047,1156,5.026]],["title/token-inspect.html",[26,0.296,557,2.479]],["contents/token-inspect.html",[1,0.324,2,0.092,4,1.046,5,0.718,6,0.335,7,0.526,8,0.435,12,0.021,15,0.367,16,0.112,20,0.718,26,0.571,31,0.587,33,1.351,34,0.526,35,1.848,36,1.848,37,0.577,44,0.629,46,0.462,47,0.217,49,0.432,50,1.261,51,0.983,53,0.62,57,1.628,59,0.244,63,0.477,64,0.986,65,0.508,71,3.594,72,2.863,73,3.522,74,1.703,76,3.396,78,0.46,82,1.052,83,1.997,91,3.862,97,0.689,111,1.733,122,1.345,130,2.537,140,2.084,141,2.436,142,3.271,144,1.648,154,1.351,164,2.098,166,2.084,173,4.285,208,1.261,285,2.633,292,0.986,305,0.986,318,2.692,320,2.264,321,1.436,323,1.112,324,1.848,329,2.111,332,1.529,396,1.917,397,2.365,406,1.648,409,2.111,425,1.436,434,1.536,446,1.543,470,1.848,512,3.436,537,2.285,557,3.14,559,3.949,588,1.648,601,1.773,604,1.773,608,2.863,624,3.14,638,0.983,691,3.14,723,1.917,742,2.874,764,3.396,806,1.917,825,2.084,919,2.537,1036,5.261,1120,3.949,1141,2.537,1144,3.14,1157,2.874,1158,3.386,1159,2.874,1160,3.386,1161,3.386,1162,3.486,1163,2.874,1164,3.386,1165,4.653,1166,5.315,1167,5.723,1168,2.874,1169,3.386,1170,5.723,1171,4.288]],["title/token-internal.html",[47,0.1,298,1.918,385,1.764]],["contents/token-internal.html",[1,0.323,2,0.106,5,1.304,6,0.476,7,0.608,12,0.018,15,0.724,16,0.114,17,0.901,20,0.7,26,0.266,37,0.667,42,0.533,44,0.728,47,0.217,49,0.48,59,0.428,63,0.533,74,1.739,81,1.432,86,1.545,93,0.48,97,0.724,106,1.431,111,1.23,117,2.083,143,2.228,144,1.606,147,1.498,155,1.412,161,1.498,165,3.404,168,1.23,177,1.866,206,1.498,292,0.7,298,2.032,303,3.93,312,1.085,328,1.723,333,4.242,334,2.38,374,1.498,384,2.802,385,2.588,402,3.365,417,2.129,540,3.204,562,1.868,638,0.958,657,1.729,674,2.228,707,4.012,726,2.032,887,3.068,921,4.242,932,2.473,950,4.242,1070,2.032,1119,2.802,1122,2.802,1138,4.452,1147,4.452,1172,3.301,1173,3.301,1174,3.301,1175,5.661,1176,4.572,1177,6.306,1178,6.526,1179,6.526,1180,5.661,1181,5.661,1182,3.301,1183,5.945,1184,5.661,1185,3.301,1186,3.301,1187,6.427,1188,4.572,1189,5.661,1190,3.301,1191,5.661,1192,4.572,1193,5.945]],["title/token-register.html",[47,0.117,392,2.752]],["contents/token-register.html",[1,0.295,2,0.08,6,0.412,7,0.46,8,0.597,12,0.022,15,0.672,16,0.123,20,0.985,24,1.731,25,0.863,34,0.46,46,0.462,47,0.231,49,0.412,53,0.513,54,1.135,57,1.599,63,0.417,67,0.863,68,1.051,69,0.985,78,0.566,79,0.805,81,1.12,93,0.375,106,1.268,108,2.262,110,2.262,111,1.731,119,1.846,122,1.846,144,2.262,154,1.66,177,1.349,292,1.313,312,1.527,323,1.527,328,1.527,332,1.879,372,2.434,377,3.482,385,3.825,392,3.482,393,3.52,394,4.285,397,1.731,406,3.015,553,3.137,557,3.137,667,2.861,681,4.855,786,2.262,890,3.86,1157,3.945,1194,4.648,1195,3.945,1196,3.945,1197,4.648,1198,4.648]],["title/token-vars.html",[1,0.12,26,0.218,66,0.574,69,0.574]],["contents/token-vars.html",[0,1.064,1,0.318,2,0.115,3,0.651,4,2.141,5,1.33,6,0.425,7,0.514,12,0.021,15,0.609,16,0.118,17,0.884,20,0.687,25,0.838,26,0.575,29,1.133,30,1.353,31,1.109,33,1.507,34,0.556,35,2.062,36,2.062,37,0.68,41,1.231,42,0.838,44,0.614,46,0.476,47,0.221,48,1.157,49,0.461,50,1.207,51,0.941,52,1.374,53,0.504,54,1.115,55,1.207,56,1.133,57,1.353,58,0.601,59,0.483,60,1.133,61,0.941,62,1.374,63,0.466,64,1.19,65,0.941,66,1.252,67,0.601,68,0.732,69,1.252,70,1.47,71,3.461,72,3.196,73,4,74,1.705,76,3.798,77,3.79,78,0.514,79,0.561,80,2.867,81,1.087,82,1.02,83,1.734,84,0.896,85,1.577,86,1.231,87,1.087,88,2.047,89,2.196,91,3.046,92,2.777,93,0.261,94,1.287,95,1.133,96,1.577,97,0.489,98,0.486,99,1.914,102,2.047,106,0.884,107,1.47,169,1.133,305,1.47,323,1.064,366,2.527,378,1.064,386,2.777,417,1.001,446,0.941,498,2.428,551,2.75,906,1.994,1171,3.381,1199,5.193,1200,4.408,1201,3.24,1202,3.24]],["title/tokens.html",[26,0.296,322,1.368]],["contents/tokens.html",[1,0.316,2,0.107,3,0.645,4,1.563,5,1.073,6,0.223,7,0.306,8,0.561,9,0.888,12,0.022,14,0.843,15,0.474,16,0.115,20,1.381,21,0.954,24,1.626,25,0.574,26,0.57,29,1.527,30,0.744,31,0.536,34,0.544,37,0.335,41,1.381,42,0.937,44,0.599,46,0.249,47,0.22,49,0.418,57,1.398,58,0.81,59,0.418,61,1.597,62,1.311,65,0.464,66,0.925,71,2.471,72,2.687,73,3.707,74,1.649,75,1.852,76,3.409,77,3.712,79,0.536,80,1.311,81,0.744,82,0.699,84,1.005,86,0.843,93,0.409,98,0.655,99,1.852,102,1.402,106,0.843,108,2.463,110,2.463,111,1.151,119,1.228,122,1.734,130,2.316,134,2.471,140,1.902,150,2.687,153,1.015,154,0.897,155,0.954,157,1.626,171,2.125,181,1.504,206,1.981,208,1.151,209,1.902,292,1.381,293,1.902,297,1.402,298,1.902,305,1.381,314,1.527,318,1.311,320,2.125,322,1.151,323,1.434,324,2.392,325,1.619,326,1.749,327,1.749,328,1.979,329,1.734,332,2.077,338,1.852,343,1.619,353,1.902,354,3.114,356,2.316,357,2.496,360,2.624,369,1.619,370,2.316,372,2.286,374,1.402,376,2.086,378,1.015,382,2.316,385,2.865,393,1.902,394,2.316,395,2.624,396,1.749,397,1.151,398,2.316,399,2.624,400,3.271,401,3.271,402,1.749,403,1.749,404,2.086,405,1.619,406,2.125,407,2.687,408,2.624,409,1.402,410,3.116,417,0.954,425,1.311,446,0.897,468,1.504,520,1.902,544,2.624,556,2.316,561,3.271,568,2.946,569,2.471,571,2.086,629,2.086,638,0.897,647,2.316,651,1.619,657,1.619,674,2.086,686,2.946,730,3.706,764,3.284,770,3.706,806,1.749,811,2.086,852,2.624,861,2.624,862,3.706,863,2.624,865,2.624,872,2.316,882,2.624,886,2.624,887,1.504,888,2.086,889,1.902,890,2.086,897,2.316,901,2.624,904,2.624,909,2.624,910,2.946,911,2.624,913,2.624,914,2.624,915,3.706,927,1.902,1123,2.624,1125,2.624,1168,2.624,1171,3.271,1196,3.706,1200,2.624,1203,3.091,1204,3.091,1205,3.091,1206,3.091,1207,3.091,1208,3.091,1209,3.091,1210,3.091,1211,4.366,1212,3.091,1213,3.091,1214,3.091,1215,3.091,1216,3.091,1217,4.366,1218,4.366,1219,4.366,1220,3.091,1221,3.091,1222,2.624,1223,2.624,1224,3.091,1225,3.091,1226,3.091,1227,3.091,1228,3.091]],["title/type-a11y.html",[93,0.361]],["contents/type-a11y.html",[1,0.237,12,0.021,25,0.991,46,0.531,53,0.557,56,1.867,63,0.479,74,1.369,78,0.528,93,0.502,374,2.423,420,4.926,434,2.423,870,3.604,929,2.797,1129,4.533,1229,5.34,1230,5.34,1231,6.574,1232,6.215,1233,6.77,1234,5.58,1235,6.215]],["title/type-font-vars.html",[1,0.12,2,0.047,3,0.268,446,0.786]],["contents/type-font-vars.html",[1,0.32,2,0.117,3,0.665,4,2.101,5,1.372,6,0.466,7,0.567,8,0.385,9,0.483,10,0.905,11,1.115,12,0.023,13,1.937,14,0.817,15,0.463,16,0.118,17,0.817,18,1.568,19,1.568,20,0.635,21,0.925,22,1.695,23,1.358,24,1.115,25,1.064,26,0.515,27,1.189,28,1.047,29,1.493,30,1.381,31,0.862,32,1.457,33,1.574,34,0.536,35,2.154,36,2.154,37,0.68,40,1.568,41,1.357,42,0.876,44,0.589,46,0.438,47,0.2,48,0.768,49,0.476,50,1.115,51,0.869,52,1.27,53,0.486,54,1.076,55,1.115,56,1.047,57,1.306,58,0.556,59,0.5,60,1.047,61,0.869,62,1.27,63,0.446,64,1.3,65,0.921,66,1.263,67,0.556,68,0.677,69,1.215,70,1.358,74,1.608,78,0.492,79,0.519,80,2.829,81,1.028,82,0.965,83,1.675,84,0.847,85,2.077,86,1.165,87,1.028,88,1.937,89,2.077,90,0.594,93,0.242,94,1.189,95,1.047,96,1.457,97,0.463,98,0.449,99,1.27,172,2.605,446,2.102,465,3.338,603,3.984,638,1.444,641,2.881,664,2.881,666,2.881,1236,3.623,1237,4.465,1238,4.85,1239,4.063,1240,5.96,1241,5.423,1242,4.269,1243,2.994]],["title/type-fonts.html",[16,0.064,446,1.066]],["contents/type-fonts.html",[0,0.571,1,0.315,2,0.094,3,0.351,6,0.434,7,0.577,8,0.525,9,0.851,10,0.866,12,0.022,13,0.788,14,1.311,15,0.487,16,0.121,17,0.474,21,0.536,23,0.788,24,1.79,25,0.833,26,0.14,27,0.69,29,0.985,30,0.855,33,0.817,34,0.577,37,0.572,41,1.114,42,0.851,44,0.333,46,0.452,47,0.197,49,0.449,50,0.647,53,0.513,54,1.111,57,1.312,59,0.323,60,0.985,63,0.502,64,1.354,65,0.876,66,0.866,67,0.758,68,1.086,69,1.155,78,0.501,79,0.301,80,1.506,82,1.192,84,0.811,90,1.081,93,0.44,95,0.607,97,0.487,98,0.958,108,1.728,110,0.845,113,1.474,115,1.474,117,1.41,119,2.094,120,1.594,122,1.41,141,0.909,143,1.172,152,0.736,153,0.571,154,1.031,155,1.096,156,1.57,157,2.085,158,1.622,160,1.579,161,0.788,164,1.57,166,1.069,167,1.049,168,1.672,169,0.607,175,0.788,177,0.504,178,0.788,179,0.845,197,1.194,208,1.672,290,0.845,291,1.474,292,1.155,293,1.069,294,1.069,295,1.733,297,1.277,312,0.925,313,1.301,314,1.57,320,0.845,323,1.342,324,2.517,325,0.909,329,2.536,332,0.925,343,0.909,352,1.594,354,2.541,357,2.539,364,1.301,368,1.069,369,2.853,372,0.909,387,1.172,388,1.474,396,0.983,397,2.379,402,0.983,403,0.983,406,0.845,407,2.185,410,2.185,411,1.194,413,1.37,425,0.736,432,2.39,434,0.788,446,2.114,447,3.601,448,1.474,452,1.301,453,1.474,474,1.474,488,3.014,502,1.9,531,3.363,537,1.9,556,2.66,560,1.118,561,2.66,562,0.983,566,2.109,569,2.01,588,0.845,601,0.909,602,1.474,603,3.593,604,3.263,605,1.474,606,1.474,607,1.474,608,3.754,628,0.983,633,1.301,638,1.662,641,4.006,643,3.939,650,1.301,651,0.909,661,1.301,664,3.243,666,3.243,667,1.069,673,1.474,679,1.301,683,4.29,685,4.751,693,1.301,702,1.594,719,1.37,723,0.983,731,1.172,782,0.983,783,1.069,784,2.312,806,1.594,811,1.172,823,1.9,829,2.514,837,1.474,842,1.172,857,1.301,870,1.172,897,1.301,903,1.069,908,1.474,910,1.172,917,2.109,974,1.301,1017,1.301,1126,2.39,1132,1.474,1162,1.301,1195,1.474,1223,2.39,1237,4.243,1238,3.601,1239,2.66,1244,4.624,1245,3.014,1246,3.467,1247,1.737,1248,3.467,1249,2.816,1250,2.39,1251,1.737,1252,2.816,1253,1.737,1254,1.474,1255,3.014,1256,1.737,1257,2.816,1258,1.737,1259,1.737,1260,5.289,1261,1.737,1262,4.489,1263,1.737,1264,2.816,1265,4.084,1266,3.551,1267,1.737,1268,1.737,1269,1.737,1270,1.737,1271,1.737,1272,5.597,1273,3.551,1274,1.737,1275,1.737,1276,1.737,1277,1.737,1278,2.816,1279,1.737,1280,1.737,1281,2.816,1282,1.737,1283,1.737,1284,2.39,1285,1.737,1286,1.737,1287,4.489,1288,1.737,1289,1.737,1290,2.816,1291,2.816,1292,3.014,1293,1.474,1294,5.272,1295,3.551,1296,4.084,1297,1.737,1298,1.737,1299,1.737,1300,1.737,1301,1.737,1302,1.737,1303,1.737,1304,1.737,1305,1.737,1306,3.467,1307,1.737,1308,1.474,1309,2.816,1310,2.816,1311,2.816,1312,2.816,1313,4.084,1314,1.737,1315,1.737,1316,2.816,1317,2.39,1318,4.806,1319,1.474,1320,1.737,1321,1.737]],["title/type-helpers.html",[14,1.002,657,1.924]],["contents/type-helpers.html",[1,0.301,2,0.111,6,0.461,7,0.497,10,1.065,12,0.017,14,1.371,24,1.872,37,0.545,44,0.595,46,0.406,47,0.205,53,0.538,63,0.451,78,0.497,97,0.65,98,0.754,208,1.872,324,1.996,329,2.763,411,2.131,446,2.049,452,3.765,537,3.392,604,2.632,643,3.392,651,2.632,719,2.446,787,4.266,829,3.093,842,3.392,1163,4.266,1236,4.266,1237,4.047,1239,3.765,1246,4.266,1255,5.09,1284,5.441,1308,4.266,1322,5.997,1323,5.026,1324,5.026,1325,5.997,1326,5.026]],["title/type-pseudo.html",[929,1.924,1327,2.752]],["contents/type-pseudo.html",[6,0.469,12,0.021,46,0.526,59,0.469,63,0.584,69,1.381,79,0.906,84,1.293,108,2.543,111,1.946,155,2.012,176,3.11,343,2.736,638,1.517,707,3.526,884,6.054,929,3.589,1327,4.598,1328,5.225]],["title/type.html",[14,1.002,322,1.368]],["contents/type.html",[1,0.317,9,0.723,12,0.021,14,1.525,16,0.078,20,0.949,25,1.037,41,1.222,42,1.06,49,0.459,57,1.078,64,0.949,79,0.776,93,0.515,98,0.672,106,1.222,111,2.081,153,1.471,160,1.836,292,0.949,322,1.667,324,2.785,325,2.344,326,2.534,327,2.534,328,1.471,329,2.419,335,3.354,369,2.344,397,1.667,406,2.178,446,2.077,603,3.439,608,4.262,641,3.021,643,3.021,657,2.926,664,4.111,665,3.8,666,3.771,719,2.178,806,2.534,829,3.439,842,3.021,885,3.8,917,4.187,929,2.344,1077,3.021,1102,3.8,1106,3.354,1107,3.8,1130,3.8,1237,4.111,1238,4.187,1244,5.171,1245,3.8,1248,3.8,1250,4.743,1260,3.8,1292,3.8,1293,3.8,1306,4.743,1317,3.8,1319,3.8,1327,3.354,1329,4.477,1330,4.477,1331,4.477,1332,4.477,1333,4.477,1334,4.477,1335,4.477]],["title/utils.html",[1,0.106,6,0.172,16,0.041,20,0.507,638,0.694]],["contents/utils.html",[0,0.811,1,0.319,2,0.092,5,1.18,6,0.515,7,0.524,8,0.715,9,0.398,11,0.919,12,0.021,15,0.575,16,0.118,17,1.349,20,1.332,21,0.762,23,1.119,26,0.299,31,0.965,32,2.165,34,0.571,37,0.604,44,0.627,46,0.449,47,0.226,48,0.633,49,0.178,50,2.263,53,0.611,57,1.276,59,0.416,63,0.499,74,1.359,78,0.551,79,0.857,81,1.276,82,0.558,83,0.762,87,0.594,97,0.721,98,0.668,106,1.011,107,1.681,111,0.919,117,2.293,120,3.268,122,0.98,144,1.201,147,2.018,155,1.719,156,1.556,158,0.98,164,2.197,165,1.803,167,2.073,169,0.863,170,1.292,171,1.201,172,1.292,175,1.119,176,1.681,177,1.436,179,1.803,197,2.519,305,0.943,312,0.811,321,2.36,324,2.211,328,1.462,352,3.438,364,3.333,369,1.292,372,2.589,374,2.404,375,3.333,378,0.811,386,1.518,406,1.803,409,2.018,413,1.201,417,1.374,434,1.119,446,1.291,468,1.803,489,2.776,492,1.849,512,1.292,522,1.665,528,3.002,553,1.665,560,0.98,601,2.33,603,2.28,618,3.043,621,5.563,622,5.333,623,5.333,624,1.665,628,3.737,638,1.991,650,2.776,652,1.849,653,2.776,658,2.094,659,3.145,663,2.094,676,3.426,682,4.725,683,2.776,693,2.776,702,1.396,723,3.557,727,3.145,764,1.396,813,3.043,887,1.201,895,2.094,906,1.518,907,4.499,921,2.776,952,3.577,955,4.197,959,2.094,987,2.094,1071,1.665,1127,3.145,1139,2.094,1141,1.849,1144,2.5,1148,4.197,1159,2.094,1234,2.094,1254,4.725,1336,2.467,1337,4.449,1338,4.449,1339,4.945,1340,5.566,1341,4.449,1342,2.467,1343,3.705,1344,2.467,1345,3.705,1346,3.705,1347,2.467,1348,2.467,1349,3.705,1350,3.705,1351,3.705,1352,3.705,1353,3.705,1354,2.467,1355,2.467,1356,2.467,1357,4.945,1358,4.945]],["title/vars.html",[2,0.054,66,0.661,69,0.661]],["contents/vars.html",[0,1.285,1,0.318,2,0.118,3,0.668,4,1.583,5,1.335,6,0.453,7,0.507,11,1.457,12,0.023,16,0.114,17,1.399,20,1.335,26,0.508,31,1.051,33,1.135,34,0.565,35,2.035,36,2.035,37,0.556,41,1.719,42,0.827,44,0.606,46,0.461,47,0.206,48,1.314,49,0.481,53,0.351,54,1.135,59,0.465,60,1.368,61,1.135,62,1.658,63,0.46,65,0.858,66,1.416,67,0.726,68,0.884,69,1.416,78,0.507,82,0.884,84,1.017,98,0.858,117,2.27,119,2.035,169,1.368,208,1.909,211,2.93,292,0.829,305,1.48,312,1.684,323,1.285,328,1.684,338,1.658,386,3.734,389,3.84,390,3.319,391,3.319,397,1.909,470,1.553,560,1.553,588,1.903,628,2.901,764,3.434,906,2.407,910,2.639,1017,4.546,1162,2.93,1222,3.319,1359,3.911,1360,5.125,1361,3.911,1362,3.911,1363,3.911,1364,6.067,1365,6.067,1366,3.911,1367,3.911,1368,3.911,1369,3.911,1370,3.911,1371,3.911,1372,3.911,1373,5.125,1374,3.911,1375,3.911]]],"invertedIndex":[["",{"_index":1,"title":{"animate-change-vars.html":{"position":[[8,1]]},"animate-ease-vars.html":{"position":[[7,1]]},"animate-time-vars.html":{"position":[[6,1]]},"color-contrast.html":{"position":[[9,1]]},"color-vars.html":{"position":[[13,1]]},"ratio-vars.html":{"position":[[13,1]]},"scale-vars.html":{"position":[[6,1]]},"token-vars.html":{"position":[[7,1]]},"type-font-vars.html":{"position":[[6,1]]},"utils.html":{"position":[[18,1]]}},"contents":{"animate-change-vars.html":{"position":[[8,1],[85,1],[456,2],[615,1],[654,1],[674,1],[702,1],[728,2],[746,2],[788,2],[1142,1],[1345,1],[1430,2],[1438,1],[1464,1],[1466,1],[1486,1],[1558,1],[1612,2],[1754,3],[1864,1],[1957,3],[2324,1],[2409,2],[2421,1],[2509,1],[2533,1],[2626,1],[2842,1],[2860,3],[2921,3],[3360,1],[3445,2],[3457,1],[3543,1],[3567,1],[3650,1]]},"animate-change.html":{"position":[[35,1],[132,1],[247,2],[549,1],[551,2],[637,2],[739,2],[785,2],[890,2],[983,2],[1036,2],[1066,1],[1473,1],[1571,1],[2003,1],[2047,1],[2118,1],[2436,1],[2584,1],[2626,2],[2638,1],[2675,1],[2699,1],[2741,1],[2892,1],[3042,1],[3076,2],[3088,1],[3125,1],[3149,1],[3187,1]]},"animate-ease-vars.html":{"position":[[7,1],[82,1],[453,2],[620,1],[655,1],[675,1],[735,1],[760,2],[776,2],[815,2],[1175,1],[1381,1],[1479,2],[1487,1],[1512,1],[1514,1],[1534,1],[1661,1],[1727,2],[1867,3],[1977,1],[2068,3],[2432,1],[2530,2],[2542,1],[2626,1],[2650,1],[2743,1],[2971,1],[2987,3],[3048,3],[3492,1],[3590,2],[3602,1],[3706,1],[3730,1],[3828,1]]},"animate-ease.html":{"position":[[343,1],[345,3],[371,2],[374,1],[389,3],[407,2],[410,3],[430,2],[433,3],[459,2],[462,3],[515,2],[518,3],[573,2],[576,3],[631,2],[634,3],[689,2],[692,3],[743,2],[746,3],[800,2],[803,3],[855,2],[858,3],[912,2],[915,3],[968,2],[971,3],[1024,2],[1027,3],[1079,2],[1082,3],[1130,2],[1133,3],[1185,2],[1188,3],[1235,2],[1238,3],[1290,2],[1293,3],[1349,2],[1352,3],[1411,2],[1414,3],[1471,2],[1474,3],[1526,2],[1529,3],[1580,2],[1583,3],[1640,2],[1643,3],[1687,2],[1690,3],[1748,2],[1751,3],[1809,2],[1852,2],[1868,2],[1912,1],[2058,1],[2270,2],[2501,1],[2628,2],[2657,1],[3051,1],[3142,1],[3684,1]]},"animate-time-vars.html":{"position":[[6,1],[77,1],[444,2],[595,1],[630,1],[650,1],[674,1],[698,2],[714,2],[752,2],[1098,1],[1293,1],[1346,2],[1354,1],[1378,1],[1380,1],[1400,1],[1460,1],[1510,2],[1648,3],[1756,1],[1847,3],[2208,1],[2278,2],[2290,1],[2376,1],[2400,1],[2485,1],[2697,1],[2713,3],[2772,3],[3207,1],[3275,2],[3287,1],[3370,1],[3394,1],[3472,1]]},"animate-times.html":{"position":[[23,1],[57,1],[156,2],[410,1],[491,2],[549,2],[577,1],[1063,1],[1144,1],[1630,1]]},"animate.html":{"position":[[50,1],[345,1],[444,1],[493,2],[505,1],[580,2],[614,1],[791,1],[862,1],[941,1],[991,1],[1199,2],[1233,1],[1301,1],[1340,1],[1408,1]]},"CHANGELOG.html":{"position":[[280,1],[649,1],[1136,1],[1540,1],[1663,1],[1722,1],[4246,2],[4349,1],[6733,2],[6922,1],[6994,1],[7000,1],[7182,1],[7211,3],[7222,3],[7513,1],[7703,1],[7910,1],[8006,3],[8016,3],[8083,3],[8093,3],[8164,3],[8176,3],[8523,3],[8534,3],[8785,3],[8795,3],[8860,3],[8871,3],[9266,3],[9276,3],[10433,1],[11117,1],[11474,1],[11696,1],[13923,1],[14311,1]]},"color-config.html":{"position":[[64,1],[237,1]]},"color-contrast.html":{"position":[[9,1],[195,1],[331,1],[356,1],[415,1],[654,1],[667,1],[675,1],[682,1],[741,1],[1015,1],[1066,2],[1074,1],[1143,2],[1146,1],[1166,1],[1182,1],[1217,1],[1268,2],[1276,1],[1352,2],[1355,1],[1375,1],[1390,1],[1690,1],[1715,1],[1774,1],[2013,1],[2026,1],[2034,1],[2041,1],[2100,1],[2198,1],[2351,1],[2386,1],[2437,2],[2445,1],[2518,2],[2521,1],[2541,1],[2557,1],[2577,1],[2609,1],[2660,2],[2668,1],[2748,2],[2751,1],[2771,1],[2806,1],[3236,1],[3266,1],[3347,1],[3586,1],[3599,1],[3607,1],[3614,1],[3673,1],[4002,1],[4053,2],[4061,1],[4134,2],[4137,1],[4157,1],[4197,1],[4232,1],[4283,2],[4291,1],[4371,2],[4374,1],[4394,1],[4433,1],[4836,1],[4866,1],[4947,1],[5186,1],[5199,1],[5207,1],[5214,1],[5273,1],[5560,1],[5611,2],[5619,1],[5696,2],[5699,1],[5719,1],[5784,1],[5819,1],[5870,2],[5878,1],[5962,2],[5965,1],[5985,1],[6069,1],[6360,2],[6372,2],[6387,2],[6405,1],[6428,1],[6543,1],[6692,1],[6705,1],[6713,1],[6722,1],[6917,2],[6975,2],[6978,2],[7039,2],[7055,2],[7078,2],[7081,2],[7104,2],[7403,1],[7428,1]]},"color-themes.html":{"position":[[523,1],[557,2],[729,1],[731,2],[763,2],[766,1],[781,2],[826,2],[829,2],[859,2],[862,2],[912,2],[915,2],[971,2],[974,2],[1030,2],[1033,2],[1076,2],[1079,2],[1107,2],[1110,2],[1158,2],[1161,2],[1215,2],[1218,2],[1272,2],[1540,1],[1569,1],[1719,1],[1830,2],[1833,1],[1869,1],[2148,1],[2463,1],[2526,1],[2617,2],[2620,1],[2656,1],[2941,1]]},"color-tokens.html":{"position":[[45,2],[304,1],[397,2],[455,2],[484,1],[1158,1],[1235,2],[1275,1],[1353,2],[1419,1],[1474,2],[1966,1],[2144,1],[2200,2],[2217,1],[2265,2],[2970,1],[2995,1],[3111,1],[3413,1],[3449,2],[3457,1],[3514,1],[3534,1],[3591,1]]},"color-utils.html":{"position":[[369,1],[394,1],[647,1],[1188,1],[1213,1],[1464,1]]},"color-vars.html":{"position":[[7,1],[81,1],[450,2],[606,1],[643,1],[663,1],[690,1],[740,2],[757,2],[797,2],[1147,1],[1346,1],[1431,2],[1439,1],[1464,1],[1466,1],[1486,1],[1555,1],[1607,2],[1747,3],[1856,1],[1948,3],[2312,1],[2397,2],[2409,1],[2495,1],[2519,1],[2608,1],[2822,1],[2839,3],[2899,3],[3336,1],[3421,2],[3433,1],[3515,1],[3539,1],[3618,1]]},"color.html":{"position":[[546,1],[548,2],[646,2],[730,2],[821,2],[872,1],[905,1],[1203,1],[1280,2],[1294,1],[1389,2],[1392,2],[1617,1],[1859,1],[1861,2],[1976,2],[2145,1]]},"CONTRIBUTING.html":{"position":[[581,1],[594,1]]},"index.html":{"position":[[280,1],[538,1],[655,1],[690,1],[717,2],[843,2],[1004,1],[1086,1],[1138,1],[1190,1],[1255,1],[1327,1],[1418,1],[1496,1],[1653,1],[1684,2],[1788,1],[1854,1],[1870,2],[1892,1],[1924,1],[1935,1],[1956,2],[1983,2],[1986,2],[2357,1],[2646,1]]},"layout-queries.html":{"position":[[52,2],[211,1],[486,1],[519,2],[572,1],[657,2],[1067,1],[1142,1],[1410,1],[2224,1],[2344,1],[2485,1],[2492,1],[2511,1],[2513,1],[2556,1],[2563,1],[2582,1],[2584,1],[2654,1],[2661,1],[2680,1],[2682,1],[2725,1],[2732,1],[2751,1],[2753,1],[3315,1],[3435,1],[3576,1],[3583,1],[3604,1],[3606,1],[3646,1],[3653,1],[3674,1],[3676,1],[3750,1],[3757,1],[3778,1],[3780,1],[3820,1],[3827,1],[3848,1],[3850,1],[4426,1],[4549,1],[4682,1],[4831,1],[4838,1],[4860,1],[4862,1],[4927,1],[4934,1],[4956,1],[4958,1],[4985,1],[5015,2],[5057,1],[5064,1],[5086,1],[5088,1],[5153,1],[5160,1],[5182,1],[5184,1],[5288,1],[5296,1]]},"layout-z-index.html":{"position":[[31,3],[323,1],[333,2],[349,2],[388,2],[408,2],[422,2],[427,2],[651,1],[983,1]]},"layout.html":{"position":[[437,1],[454,2],[471,1],[494,2],[579,1],[626,1],[644,1],[646,1],[659,1],[684,1],[701,1],[703,1]]},"LICENSE.html":{"position":[[22,1]]},"ratio-tokens.html":{"position":[[116,2],[268,1],[292,1],[333,2],[635,1],[660,1],[718,1],[984,2],[1022,2],[1025,2],[1061,2],[1077,2],[1091,2],[1094,2],[1109,2],[1415,1],[1803,1],[1828,1],[2083,1],[2094,1],[2212,2],[2253,2],[2256,2],[2287,2],[2290,2],[2329,2],[2332,2],[2365,2],[2381,2],[2395,2],[2398,2],[2410,2],[2413,2],[2431,2],[2434,2],[2449,2]]},"ratio-vars.html":{"position":[[13,1],[87,1],[232,2],[389,1],[414,1],[416,1],[436,1],[464,1],[489,2],[506,2],[546,2],[896,1],[1095,1],[1154,2],[1162,1],[1187,1],[1189,1],[1209,1],[1269,1],[1335,2],[1477,3],[1586,1],[1678,3],[2042,1],[2101,2],[2113,1],[2208,1],[2232,1],[2314,1],[2542,1],[2559,3],[2619,3],[3056,1],[3115,2],[3127,1],[3197,1],[3236,1],[3245,1],[3269,1],[3339,1],[3369,1],[3378,1]]},"ratios.html":{"position":[[317,1],[319,3],[345,2],[348,1],[363,3],[379,2],[382,3],[409,2],[412,3],[446,2],[449,3],[481,2],[484,3],[507,2],[510,3],[527,2],[530,3],[562,2],[565,3],[592,2],[595,3],[619,2],[622,3],[645,2],[648,3],[674,2],[677,3],[710,2],[713,3],[730,2],[733,3],[761,2],[764,3],[795,2],[798,3],[817,2],[820,3],[845,2],[889,2],[906,2]]},"scale-sizes.html":{"position":[[46,1],[97,1],[555,1],[604,1],[1155,1],[1257,1],[1285,2],[1727,1],[1902,1],[1946,2],[2612,1],[2695,1],[2707,1],[3702,1],[3726,1],[3735,1],[4070,1],[4082,1],[4510,1],[5001,1],[5025,1],[5034,1],[5369,1],[5381,1]]},"scale-units.html":{"position":[[180,1],[347,1],[373,1],[563,1],[845,1]]},"scale-vars.html":{"position":[[6,1],[77,1],[444,2],[596,1],[631,1],[651,1],[676,1],[700,2],[716,2],[754,2],[1100,1],[1295,1],[1366,2],[1374,1],[1398,1],[1400,1],[1420,1],[1482,1],[1532,2],[1670,3],[1778,1],[1869,3],[2230,1],[2301,2],[2313,1],[2396,1],[2420,1],[2503,1],[2715,1],[2731,3],[2790,3],[3225,1],[3296,2],[3308,1],[3389,1],[3413,1],[3488,1]]},"scale.html":{"position":[[28,1],[388,1],[467,1],[487,2],[498,1],[500,2],[567,2],[611,2],[648,2],[843,2],[921,1],[949,2],[1047,1],[1095,1],[1422,1],[1446,1],[1503,1],[1512,1],[1853,2],[1906,2],[1909,2],[1947,2],[1950,2],[1995,2],[2011,2],[2045,2],[2048,2],[2072,2],[2075,2],[2091,2]]},"token-api.html":{"position":[[167,1],[198,2],[538,1],[552,1],[680,2],[692,2],[706,1],[741,2],[834,2],[850,2],[863,1],[876,1],[932,1],[944,2],[1070,2],[1092,2],[1108,1],[1136,1],[1196,2],[1230,2],[1238,1],[1302,2],[1326,2],[1340,1],[1372,1],[1418,2],[1421,2],[1698,2],[1734,1],[1760,1],[1819,2],[1822,2],[1912,2],[1960,1],[1986,1],[2045,2],[2048,2],[2097,1],[2141,1],[2455,1],[2529,2],[2670,1],[2725,1],[2806,2],[3059,1],[3103,1],[3124,1],[3156,2],[3159,2],[3345,1],[3389,1],[3410,1],[3424,1],[3483,2],[3486,2],[3489,2],[3535,1],[4534,1],[4609,3],[4685,1],[4762,3],[4851,1],[4907,1],[4934,2],[4937,2],[4940,3],[4987,2],[5003,3],[5024,2],[5063,1],[5074,1],[5088,2],[5091,2],[5094,3],[5140,2],[5156,3],[5169,2],[5246,1],[5282,1],[5309,3],[5334,2],[5350,3],[5365,2],[5723,1],[5800,3],[5849,3],[5937,1],[5962,2],[5991,1],[6018,2],[6021,3],[6067,2],[6083,3],[6104,2]]},"token-config.html":{"position":[[29,1]]},"token-inspect.html":{"position":[[303,1],[318,3],[492,3],[540,2],[543,3],[589,2],[605,3],[614,2],[617,3],[627,2],[703,2],[861,1],[965,1],[1030,3],[1077,3],[1196,3],[1344,1],[1436,2],[1439,3],[1492,2],[1495,3],[1564,2],[1567,3],[1620,2],[1623,3],[1693,2],[1709,3],[1727,2],[1730,3],[1766,2],[1769,3],[1786,2],[1789,3],[1807,2],[1896,2],[2167,1],[2232,3],[2267,2],[2292,3],[2373,1],[2516,1],[2557,1],[2583,1],[2585,2],[2588,3],[2636,2],[2639,3],[2685,2],[2688,3],[2762,2],[2765,3],[2843,2],[2859,3],[2875,2],[2878,3],[2894,2],[2897,3],[2926,2],[2929,3],[2960,2],[3036,1]]},"token-internal.html":{"position":[[334,1],[429,2],[432,3],[473,2],[476,3],[519,2],[535,3],[551,2],[554,3],[571,2],[747,4],[763,1],[787,1],[861,1],[1001,1],[1072,2],[1075,3],[1118,2],[1134,3],[1151,2],[1342,1],[1344,2],[1358,1],[1382,1],[1463,1],[1609,1],[1679,2],[1682,3],[1721,2],[1737,3],[1751,2],[1931,4],[1947,1],[1971,1],[2047,1],[2200,1],[2248,2],[2251,3],[2294,2],[2310,3],[2327,2],[2494,4],[2510,1],[2534,1],[2607,1],[2757,1],[2804,2],[2807,3],[2846,2],[2862,3],[2876,2],[3089,4],[3105,1],[3129,1],[3202,1],[3328,1],[3374,2],[3377,3],[3414,2],[3430,3],[3443,2]]},"token-register.html":{"position":[[268,2],[314,1],[398,1],[458,2],[884,1]]},"token-vars.html":{"position":[[7,1],[170,2],[378,3],[443,1],[506,3],[791,1],[869,1],[976,2],[988,1],[1092,1],[1116,1],[1181,1],[1306,2],[1324,2],[1676,1],[1770,1],[1920,1],[2027,2],[2035,1],[2077,3],[2081,1],[2101,1],[2170,1],[2195,2],[2403,1],[2476,3],[2536,3],[2828,1],[2984,1],[3091,2],[3103,1],[3203,1],[3227,1],[3294,1],[3501,2]]},"tokens.html":{"position":[[125,1],[156,2],[360,1],[836,1],[1411,1],[1534,1],[1593,1],[2230,1],[2275,2],[2378,1],[2462,2],[2602,1],[2639,1],[2694,1],[3067,1],[3152,2],[3160,1],[3162,2],[3246,2],[3383,1],[3403,1],[3521,1],[3601,1],[3765,1],[3799,2],[3849,1],[3935,2],[3938,2],[3958,1],[4219,1],[4288,2]]},"type-a11y.html":{"position":[[231,1]]},"type-font-vars.html":{"position":[[6,1],[77,1],[444,2],[538,1],[551,1],[594,1],[596,2],[633,1],[668,1],[688,1],[745,1],[769,2],[785,2],[823,2],[1169,1],[1283,1],[1464,1],[1479,1],[1536,2],[1578,2],[1586,1],[1610,1],[1612,1],[1696,2],[1834,3],[1942,1],[2033,3],[2318,1],[2500,1],[2515,1],[2572,2],[2614,2],[2626,1],[2714,1],[2738,1],[2832,1],[3078,1],[3094,3],[3153,3],[3512,1],[3695,1],[3710,1],[3767,2],[3809,2],[3821,1],[3872,1],[3896,1],[3941,1]]},"type-fonts.html":{"position":[[103,1],[586,2],[917,2],[920,1],[1069,2],[2688,1],[3210,1],[4288,1],[4298,1],[4611,2],[4731,2],[4734,2],[4774,2],[4846,1],[4870,2],[4916,1],[4926,1],[5005,1],[5102,2],[5122,1],[5233,2],[5236,2],[5239,2],[5289,1],[5303,1],[5381,1],[5487,2],[5498,1],[5606,2],[5609,2],[5612,2],[5981,1],[5990,1],[6318,1],[6393,2],[7146,1],[7162,3],[7744,1],[8030,1],[8040,1],[8109,2],[8112,2],[8120,1],[8162,1],[8182,1],[8203,1],[8635,1],[8655,1],[8698,2],[8728,2],[8736,1],[8774,1],[8794,1],[8815,1],[9189,1],[9451,1],[9466,1],[9666,2],[9669,2],[10297,1],[10479,1],[10494,1],[10694,2],[10697,2],[10795,1],[10836,2],[10839,2]]},"type-helpers.html":{"position":[[223,1],[458,2],[469,2],[485,2],[528,2]]},"type.html":{"position":[[423,2],[498,1],[500,2],[571,1],[745,2],[748,2],[789,1],[881,2],[884,2],[933,2],[1046,2],[1114,2],[1248,1],[1280,1],[1293,1],[1328,1]]},"utils.html":{"position":[[549,1],[822,1],[927,2],[930,3],[977,2],[993,3],[1027,2],[1431,1],[1473,1],[1628,1],[2454,1],[2480,1],[2543,3],[2577,2],[2580,3],[2763,2],[2798,2],[2865,1],[2889,1],[2954,2],[2957,3],[2994,2],[3010,3],[3023,1],[3030,2],[3538,1],[3610,3],[3797,2],[3832,2],[3899,1],[3938,1],[3968,2],[3971,3],[4008,2],[4024,3],[4038,1],[4047,2],[4476,1],[4613,3],[4807,4],[4973,1],[5114,1],[5148,1],[5150,3],[5154,2],[5157,3],[5188,2],[5204,3],[5220,2],[5762,1],[5874,1],[5876,2],[5939,1],[5953,1],[5971,2],[5974,3],[6005,2],[6021,3],[6037,2]]},"vars.html":{"position":[[111,1],[806,1],[876,1],[920,2],[928,1],[961,1],[992,4],[1008,1],[1010,1],[1030,1],[1088,1],[1166,2],[1633,1],[1683,3],[1687,1],[1734,1],[1844,1],[1997,1],[2041,2],[2049,1],[2096,3],[2100,1],[2120,1],[2178,1]]}}}],["0",{"_index":232,"title":{},"contents":{"animate-ease.html":{"position":[[725,2],[1512,2],[1567,2],[1677,2],[1680,2]]},"CHANGELOG.html":{"position":[[5180,2]]},"color-contrast.html":{"position":[[677,1],[2036,1],[3609,1],[5209,1]]},"color-themes.html":{"position":[[873,2],[1120,2],[1913,2],[2706,2]]}}}],["0.01em",{"_index":933,"title":{},"contents":{"layout-queries.html":{"position":[[1885,7],[2981,7],[4087,7]]}}}],["0.03",{"_index":222,"title":{},"contents":{"animate-ease.html":{"position":[[611,5],[1390,5]]}}}],["0.035",{"_index":238,"title":{},"contents":{"animate-ease.html":{"position":[[792,7]]}}}],["0.04",{"_index":241,"title":{},"contents":{"animate-ease.html":{"position":[[835,5]]}}}],["0.045",{"_index":246,"title":{},"contents":{"animate-ease.html":{"position":[[904,7],[1453,6]]}}}],["0.05",{"_index":227,"title":{},"contents":{"animate-ease.html":{"position":[[669,5],[779,5],[1621,5]]}}}],["0.055",{"_index":217,"title":{},"contents":{"animate-ease.html":{"position":[[552,6]]}}}],["0.06",{"_index":229,"title":{},"contents":{"animate-ease.html":{"position":[[682,6]]}}}],["0.07",{"_index":276,"title":{},"contents":{"animate-ease.html":{"position":[[1570,5]]}}}],["0.085",{"_index":214,"title":{},"contents":{"animate-ease.html":{"position":[[495,6]]}}}],["0.1.0",{"_index":667,"title":{},"contents":{"CHANGELOG.html":{"position":[[12725,5]]},"color-tokens.html":{"position":[[1021,6]]},"layout-queries.html":{"position":[[342,6]]},"token-register.html":{"position":[[586,6]]},"type-fonts.html":{"position":[[1743,6]]}}}],["0.135",{"_index":281,"title":{},"contents":{"animate-ease.html":{"position":[[1728,6]]}}}],["0.15",{"_index":282,"title":{},"contents":{"animate-ease.html":{"position":[[1735,5]]}}}],["0.165",{"_index":265,"title":{},"contents":{"animate-ease.html":{"position":[[1279,6]]}}}],["0.175",{"_index":274,"title":{},"contents":{"animate-ease.html":{"position":[[1515,6]]}}}],["0.19",{"_index":219,"title":{},"contents":{"animate-ease.html":{"position":[[566,6]]}}}],["0.2",{"_index":306,"title":{},"contents":{"animate-time-vars.html":{"position":[[2369,6],[2478,6]]}}}],["0.22",{"_index":224,"title":{},"contents":{"animate-ease.html":{"position":[[624,6],[1225,5]]}}}],["0.265",{"_index":190,"title":{},"contents":{"animate-ease-vars.html":{"position":[[721,6]]},"animate-ease.html":{"position":[[1795,6]]}}}],["0.28",{"_index":244,"title":{},"contents":{"animate-ease.html":{"position":[[891,5]]}}}],["0.32",{"_index":258,"title":{},"contents":{"animate-ease.html":{"position":[[1120,5],[1335,5]]}}}],["0.335",{"_index":243,"title":{},"contents":{"animate-ease.html":{"position":[[847,7]]}}}],["0.355",{"_index":253,"title":{},"contents":{"animate-ease.html":{"position":[[1013,6],[1460,6]]}}}],["0.4",{"_index":194,"title":{},"contents":{"animate-ease-vars.html":{"position":[[1414,4],[1569,4],[1644,4],[2465,4],[2685,4],[3525,4]]},"animate-ease.html":{"position":[[2533,4]]},"animate.html":{"position":[[537,4]]}}}],["0.44",{"_index":256,"title":{},"contents":{"animate-ease.html":{"position":[[1069,5]]}}}],["0.45",{"_index":249,"title":{},"contents":{"animate-ease.html":{"position":[[955,5]]}}}],["0.46",{"_index":248,"title":{},"contents":{"animate-ease.html":{"position":[[949,5]]}}}],["0.5",{"_index":195,"title":{},"contents":{"animate-ease-vars.html":{"position":[[1419,4],[1574,4],[1649,4],[2470,4],[2690,4],[3530,4]]},"animate-ease.html":{"position":[[2538,4]]},"animate.html":{"position":[[542,4]]},"token-api.html":{"position":[[4930,3],[6014,3]]}}}],["0.515",{"_index":270,"title":{},"contents":{"animate-ease.html":{"position":[[1396,6]]}}}],["0.53",{"_index":216,"title":{},"contents":{"animate-ease.html":{"position":[[508,6]]}}}],["0.55",{"_index":189,"title":{},"contents":{"animate-ease-vars.html":{"position":[[715,5]]},"animate-ease.html":{"position":[[1627,5],[1789,5]]}}}],["0.565",{"_index":261,"title":{},"contents":{"animate-ease.html":{"position":[[1174,6]]}}}],["0.575",{"_index":260,"title":{},"contents":{"animate-ease.html":{"position":[[1167,6]]}}}],["0.5vw",{"_index":1353,"title":{},"contents":{"utils.html":{"position":[[3960,7],[4040,6]]}}}],["0.61",{"_index":252,"title":{},"contents":{"animate-ease.html":{"position":[[1007,5]]}}}],["0.675",{"_index":218,"title":{},"contents":{"animate-ease.html":{"position":[[559,6]]}}}],["0.68",{"_index":215,"title":{},"contents":{"animate-ease.html":{"position":[[502,5]]}}}],["0.685",{"_index":223,"title":{},"contents":{"animate-ease.html":{"position":[[617,6]]}}}],["0.715",{"_index":234,"title":{},"contents":{"animate-ease.html":{"position":[[735,7]]}}}],["0.735",{"_index":245,"title":{},"contents":{"animate-ease.html":{"position":[[897,6]]}}}],["0.745",{"_index":233,"title":{},"contents":{"animate-ease.html":{"position":[[728,6]]}}}],["0.795",{"_index":237,"title":{},"contents":{"animate-ease.html":{"position":[[785,6]]}}}],["0.82",{"_index":264,"title":{},"contents":{"animate-ease.html":{"position":[[1273,5]]}}}],["0.84",{"_index":255,"title":{},"contents":{"animate-ease.html":{"position":[[1063,5]]}}}],["0.855",{"_index":228,"title":{},"contents":{"animate-ease.html":{"position":[[675,6]]}}}],["0.86",{"_index":283,"title":{},"contents":{"animate-ease.html":{"position":[[1741,6]]}}}],["0.875",{"_index":1041,"title":{},"contents":{"ratio-vars.html":{"position":[[340,7],[457,6]]}}}],["0.885",{"_index":267,"title":{},"contents":{"animate-ease.html":{"position":[[1328,6]]}}}],["0.94",{"_index":250,"title":{},"contents":{"animate-ease.html":{"position":[[961,6]]}}}],["0.95",{"_index":278,"title":{},"contents":{"animate-ease.html":{"position":[[1633,6]]}}}],["0.955",{"_index":271,"title":{},"contents":{"animate-ease.html":{"position":[[1403,7]]}}}],["0.98",{"_index":242,"title":{},"contents":{"animate-ease.html":{"position":[[841,5]]}}}],["00ff",{"_index":1298,"title":{},"contents":{"type-fonts.html":{"position":[[4556,5]]}}}],["01/04/19",{"_index":514,"title":{},"contents":{"CHANGELOG.html":{"position":[[4869,8]]}}}],["01/06/20",{"_index":504,"title":{},"contents":{"CHANGELOG.html":{"position":[[4615,8]]}}}],["0153",{"_index":1301,"title":{},"contents":{"type-fonts.html":{"position":[[4577,5]]}}}],["02/22/21",{"_index":433,"title":{},"contents":{"CHANGELOG.html":{"position":[[2632,8]]}}}],["03/01/21",{"_index":424,"title":{},"contents":{"CHANGELOG.html":{"position":[[2553,8]]}}}],["06/30/20",{"_index":500,"title":{},"contents":{"CHANGELOG.html":{"position":[[4525,8]]}}}],["07/12/18",{"_index":668,"title":{},"contents":{"CHANGELOG.html":{"position":[[12733,8]]}}}],["07/18/18",{"_index":644,"title":{},"contents":{"CHANGELOG.html":{"position":[[11046,8]]}}}],["07/27/18",{"_index":620,"title":{},"contents":{"CHANGELOG.html":{"position":[[9672,8]]}}}],["08/03/18",{"_index":617,"title":{},"contents":{"CHANGELOG.html":{"position":[[9570,8]]}}}],["08/08/18",{"_index":613,"title":{},"contents":{"CHANGELOG.html":{"position":[[9473,8]]}}}],["08/26/19",{"_index":508,"title":{},"contents":{"CHANGELOG.html":{"position":[[4708,8]]}}}],["09/08/18",{"_index":610,"title":{},"contents":{"CHANGELOG.html":{"position":[[9303,8]]}}}],["09/08/20",{"_index":472,"title":{},"contents":{"CHANGELOG.html":{"position":[[3842,8]]}}}],["09em",{"_index":971,"title":{},"contents":{"layout.html":{"position":[[715,5]]}}}],["1",{"_index":147,"title":{},"contents":{"animate-change.html":{"position":[[998,1],[1003,1]]},"animate-ease.html":{"position":[[1020,3],[1075,3],[1117,2],[1126,3],[1181,3],[1222,2],[1231,3],[1286,3],[1467,3],[1522,3],[1576,3],[1683,3]]},"animate.html":{"position":[[669,1],[1047,1]]},"color-themes.html":{"position":[[845,2],[932,2],[1094,2],[1177,2]]},"index.html":{"position":[[1953,2]]},"layout-z-index.html":{"position":[[336,1],[393,1]]},"scale.html":{"position":[[722,2],[839,3],[1943,3]]},"token-internal.html":{"position":[[390,3]]},"utils.html":{"position":[[343,2],[624,1],[923,3]]}}}],["1.0",{"_index":615,"title":{},"contents":{"CHANGELOG.html":{"position":[[9493,3]]}}}],["1.0.0",{"_index":156,"title":{},"contents":{"animate-change.html":{"position":[[1336,6]]},"animate-ease.html":{"position":[[2914,6]]},"animate-times.html":{"position":[[926,6]]},"CHANGELOG.html":{"position":[[9465,5],[9555,5],[9657,5],[11031,5]]},"color-tokens.html":{"position":[[2852,6]]},"layout-queries.html":{"position":[[835,6]]},"layout-z-index.html":{"position":[[553,6]]},"ratio-tokens.html":{"position":[[498,6]]},"scale-sizes.html":{"position":[[2141,6],[3231,6],[4530,6]]},"scale-units.html":{"position":[[289,6]]},"token-api.html":{"position":[[4458,6]]},"type-fonts.html":{"position":[[6972,6],[7580,6],[8384,6],[9041,6],[10161,6]]},"utils.html":{"position":[[2331,6],[4432,6],[5696,6]]}}}],["1.0.1",{"_index":609,"title":{},"contents":{"CHANGELOG.html":{"position":[[9295,5]]}}}],["1.0666666667",{"_index":1065,"title":{},"contents":{"ratios.html":{"position":[[696,13]]}}}],["1.125",{"_index":1064,"title":{},"contents":{"ratios.html":{"position":[[667,6]]}}}],["1.2",{"_index":1063,"title":{},"contents":{"ratios.html":{"position":[[640,4]]}}}],["1.25",{"_index":1045,"title":{},"contents":{"ratio-vars.html":{"position":[[1263,5],[3309,6]]},"ratios.html":{"position":[[613,5]]},"scale.html":{"position":[[481,5]]}}}],["1.275",{"_index":268,"title":{},"contents":{"animate-ease.html":{"position":[[1341,7]]}}}],["1.3333333333",{"_index":1062,"title":{},"contents":{"ratios.html":{"position":[[578,13],[747,13]]}}}],["1.4",{"_index":196,"title":{},"contents":{"animate-ease-vars.html":{"position":[[1424,5],[1579,5],[1654,6],[2475,5],[2695,5],[3535,5]]},"animate-ease.html":{"position":[[2543,5]]},"animate.html":{"position":[[547,5]]},"ratio-tokens.html":{"position":[[2259,4],[2401,4],[2406,3]]},"scale.html":{"position":[[1912,4],[1937,4],[2051,4]]},"token-api.html":{"position":[[2756,4]]}}}],["1.40625",{"_index":1061,"title":{},"contents":{"ratios.html":{"position":[[553,8]]}}}],["1.4em",{"_index":1046,"title":{},"contents":{"ratio-vars.html":{"position":[[2200,7],[2306,7]]}}}],["1.5",{"_index":924,"title":{},"contents":{"layout-queries.html":{"position":[[651,5]]},"ratio-tokens.html":{"position":[[1105,3]]},"ratios.html":{"position":[[522,4],[725,4]]},"scale-vars.html":{"position":[[1341,5],[2276,5],[3271,5]]},"token-api.html":{"position":[[1190,5],[1790,4],[1941,5],[2016,4],[2499,4]]}}}],["1.55",{"_index":191,"title":{},"contents":{"animate-ease-vars.html":{"position":[[728,6]]},"animate-ease.html":{"position":[[1802,6]]}}}],["1.5em",{"_index":1101,"title":{},"contents":{"scale-vars.html":{"position":[[3381,7],[3480,7]]}}}],["1.5rem",{"_index":1098,"title":{},"contents":{"scale-vars.html":{"position":[[2387,8],[2494,8]]}}}],["1.6",{"_index":1050,"title":{},"contents":{"ratio-vars.html":{"position":[[3230,5],[3364,4]]},"ratios.html":{"position":[[502,4]]}}}],["1.61803399",{"_index":1044,"title":{},"contents":{"ratio-vars.html":{"position":[[1110,11],[1230,11],[2057,11],[2253,11],[3071,11]]},"ratios.html":{"position":[[833,11]]}}}],["1.6666666667",{"_index":1057,"title":{},"contents":{"ratios.html":{"position":[[467,13]]}}}],["1.7777777778",{"_index":1055,"title":{},"contents":{"ratios.html":{"position":[[432,13],[781,13]]}}}],["1.778",{"_index":1026,"title":{},"contents":{"ratio-tokens.html":{"position":[[306,6]]}}}],["1.875",{"_index":1054,"title":{},"contents":{"ratios.html":{"position":[[402,6]]}}}],["10/29/18",{"_index":580,"title":{},"contents":{"CHANGELOG.html":{"position":[[6947,8]]}}}],["100",{"_index":760,"title":{},"contents":{"color-themes.html":{"position":[[2141,6],[2934,6]]},"ratio-vars.html":{"position":[[3238,6],[3371,6]]}}}],["10px",{"_index":636,"title":{},"contents":{"CHANGELOG.html":{"position":[[10675,5],[10724,5],[12217,5],[12262,5]]},"scale-sizes.html":{"position":[[2451,5],[2496,5],[3541,5],[3586,5],[4840,5],[4885,5]]}}}],["111",{"_index":700,"title":{},"contents":{"color-contrast.html":{"position":[[1060,5],[1262,5],[2431,5],[2654,5],[4047,5],[4277,5],[5605,5],[5864,5]]}}}],["12/03/21",{"_index":349,"title":{},"contents":{"CHANGELOG.html":{"position":[[57,8]]}}}],["12/05/18",{"_index":547,"title":{},"contents":{"CHANGELOG.html":{"position":[[5991,8]]}}}],["12/13/18",{"_index":541,"title":{},"contents":{"CHANGELOG.html":{"position":[[5586,8]]}}}],["12/20/18",{"_index":519,"title":{},"contents":{"CHANGELOG.html":{"position":[[4951,8]]}}}],["1244.4444444444px",{"_index":1117,"title":{},"contents":{"scale.html":{"position":[[2027,17]]}}}],["127",{"_index":1218,"title":{},"contents":{"tokens.html":{"position":[[2249,4],[2397,4]]}}}],["14.2857142857",{"_index":754,"title":{},"contents":{"color-themes.html":{"position":[[1916,15],[1939,14],[2709,15],[2732,14]]}}}],["14px",{"_index":1175,"title":{},"contents":{"token-internal.html":{"position":[[344,4],[546,4],[1027,5],[1635,5]]}}}],["15",{"_index":780,"title":{},"contents":{"color-tokens.html":{"position":[[1449,4],[1468,5]]}}}],["15.3846153846",{"_index":738,"title":{},"contents":{"color-themes.html":{"position":[[896,15],[1142,15]]}}}],["150m",{"_index":309,"title":{},"contents":{"animate-time-vars.html":{"position":[[3362,7],[3464,7]]},"animate.html":{"position":[[454,6]]}}}],["165",{"_index":1219,"title":{},"contents":{"tokens.html":{"position":[[2254,5],[2402,5]]}}}],["16px",{"_index":887,"title":{},"contents":{"index.html":{"position":[[1663,5],[1864,5]]},"scale-sizes.html":{"position":[[985,4]]},"scale-units.html":{"position":[[805,4]]},"scale-vars.html":{"position":[[1306,5],[2241,5],[3236,5]]},"token-api.html":{"position":[[177,5],[695,4],[716,5],[886,5],[1118,5],[1350,5],[1744,5],[1970,5],[2465,5],[2735,5],[3069,5],[3355,5]]},"token-internal.html":{"position":[[349,4],[566,4],[1011,5],[1619,5],[2210,5],[2767,5],[3338,5]]},"tokens.html":{"position":[[135,5]]},"utils.html":{"position":[[3909,5]]}}}],["17.1428571429px",{"_index":1118,"title":{},"contents":{"scale.html":{"position":[[2056,15]]}}}],["1em",{"_index":889,"title":{},"contents":{"index.html":{"position":[[1679,4]]},"layout-queries.html":{"position":[[5422,3]]},"scale.html":{"position":[[549,4]]},"token-api.html":{"position":[[193,4]]},"tokens.html":{"position":[[151,4]]}}}],["1px",{"_index":932,"title":{},"contents":{"layout-queries.html":{"position":[[1877,3],[2973,3],[4079,3],[5415,3]]},"layout.html":{"position":[[724,3]]},"token-internal.html":{"position":[[3439,3]]}}}],["1s",{"_index":200,"title":{},"contents":{"animate-ease-vars.html":{"position":[[3620,2],[3748,2]]},"animate-time-vars.html":{"position":[[550,4],[670,3]]}}}],["1vw",{"_index":653,"title":{},"contents":{"CHANGELOG.html":{"position":[[11476,4],[11497,3]]},"token-api.html":{"position":[[865,4],[901,4],[3084,4],[3370,4]]},"utils.html":{"position":[[2891,5],[2940,5]]}}}],["2",{"_index":334,"title":{},"contents":{"animate.html":{"position":[[489,3]]},"color-themes.html":{"position":[[646,3],[797,2],[991,2],[1048,2],[1234,2]]},"layout-z-index.html":{"position":[[352,1],[395,1]]},"ratio-tokens.html":{"position":[[1089,1],[2393,1]]},"ratios.html":{"position":[[376,2]]},"scale-sizes.html":{"position":[[498,3],[531,4],[1236,3],[1942,3],[3936,4],[5235,4]]},"scale.html":{"position":[[808,3],[1991,3]]},"token-api.html":{"position":[[1162,3],[3479,3],[4918,2],[5085,2],[5167,1],[6002,2]]},"token-internal.html":{"position":[[425,3],[2244,3],[2800,3]]}}}],["2.0",{"_index":548,"title":{},"contents":{"CHANGELOG.html":{"position":[[6004,3]]}}}],["2.0.0",{"_index":33,"title":{},"contents":{"animate-change-vars.html":{"position":[[495,6],[1103,6],[1706,6],[2803,6]]},"animate-ease-vars.html":{"position":[[492,6],[1136,6],[1821,6],[2932,6]]},"animate-time-vars.html":{"position":[[483,6],[1059,6],[1602,6],[2658,6]]},"CHANGELOG.html":{"position":[[5983,5],[6931,5]]},"color-tokens.html":{"position":[[2745,6]]},"color-utils.html":{"position":[[219,6],[1050,6]]},"color-vars.html":{"position":[[489,6],[1108,6],[1700,6],[2783,6]]},"layout-queries.html":{"position":[[2050,6],[3141,6],[4252,6],[5652,6]]},"ratio-vars.html":{"position":[[271,6],[857,6],[1430,6],[2503,6]]},"scale-vars.html":{"position":[[483,6],[1061,6],[1624,6],[2676,6]]},"token-api.html":{"position":[[1430,6],[4347,6]]},"token-inspect.html":{"position":[[264,6],[926,6]]},"token-vars.html":{"position":[[275,6],[1637,6],[2364,6]]},"type-font-vars.html":{"position":[[483,6],[1130,6],[1788,6],[3039,6]]},"type-fonts.html":{"position":[[6801,6],[9986,6]]},"vars.html":{"position":[[657,6]]}}}],["2.1.0",{"_index":518,"title":{},"contents":{"CHANGELOG.html":{"position":[[4943,5],[5571,5]]},"color-contrast.html":{"position":[[1601,6],[4755,6]]},"color-themes.html":{"position":[[247,6],[1462,6],[2314,6]]}}}],["2.1.1",{"_index":513,"title":{},"contents":{"CHANGELOG.html":{"position":[[4861,5]]}}}],["2.1.2",{"_index":507,"title":{},"contents":{"CHANGELOG.html":{"position":[[4700,5]]}}}],["2.1.3",{"_index":503,"title":{},"contents":{"CHANGELOG.html":{"position":[[4607,5]]}}}],["2.1.4",{"_index":499,"title":{},"contents":{"CHANGELOG.html":{"position":[[4517,5]]}}}],["2.2.0",{"_index":471,"title":{},"contents":{"CHANGELOG.html":{"position":[[3834,5]]},"token-api.html":{"position":[[3799,6]]},"token-config.html":{"position":[[441,6]]}}}],["2.39",{"_index":1068,"title":{},"contents":{"ratios.html":{"position":[[811,5]]}}}],["200m",{"_index":302,"title":{},"contents":{"animate-time-vars.html":{"position":[[1304,6],[1415,6],[1452,7],[2220,6],[3218,6]]}}}],["2018–2020",{"_index":976,"title":{},"contents":{"LICENSE.html":{"position":[[24,9]]}}}],["206020",{"_index":77,"title":{},"contents":{"animate-change-vars.html":{"position":[[1503,8],[1548,9],[2571,9],[3605,9]]},"color-vars.html":{"position":[[1502,8],[1545,9],[2555,9],[3575,9]]},"token-vars.html":{"position":[[1140,9],[2117,8],[2160,9],[3257,9]]},"tokens.html":{"position":[[3413,8],[3444,9],[3482,9],[3511,9]]}}}],["21",{"_index":524,"title":{},"contents":{"CHANGELOG.html":{"position":[[5183,3]]},"color-contrast.html":{"position":[[679,2],[2038,2],[3611,2],[5211,2],[7075,2]]}}}],["222",{"_index":776,"title":{},"contents":{"color-tokens.html":{"position":[[1229,5],[2160,5],[3443,5]]}}}],["224",{"_index":809,"title":{},"contents":{"color.html":{"position":[[640,5],[1274,5]]}}}],["24em",{"_index":965,"title":{},"contents":{"layout.html":{"position":[[488,5]]}}}],["24px",{"_index":1070,"title":{},"contents":{"scale-sizes.html":{"position":[[386,7],[1165,5],[1912,5],[3859,6],[3914,4],[5158,6],[5213,4]]},"scale-vars.html":{"position":[[1437,5],[1475,6],[2454,6],[3445,6]]},"scale.html":{"position":[[534,5]]},"token-api.html":{"position":[[1095,4],[1329,4],[1382,5]]},"token-internal.html":{"position":[[354,5]]}}}],["25",{"_index":810,"title":{},"contents":{"color.html":{"position":[[815,5],[1383,5]]}}}],["250m",{"_index":307,"title":{},"contents":{"animate-time-vars.html":{"position":[[2432,7],[3433,7]]}}}],["28.5714285714",{"_index":755,"title":{},"contents":{"color-themes.html":{"position":[[1954,15],[1977,14],[2747,15],[2770,14]]}}}],["29.99em",{"_index":939,"title":{},"contents":{"layout-queries.html":{"position":[[2547,8],[2716,8]]}}}],["2nd",{"_index":457,"title":{},"contents":{"CHANGELOG.html":{"position":[[3400,3]]}}}],["2px",{"_index":1185,"title":{},"contents":{"token-internal.html":{"position":[[1747,3]]}}}],["2vw",{"_index":654,"title":{},"contents":{"CHANGELOG.html":{"position":[[11501,4]]},"scale-sizes.html":{"position":[[621,6],[1279,5]]},"scale.html":{"position":[[943,5]]}}}],["3",{"_index":726,"title":{},"contents":{"color-themes.html":{"position":[[411,1]]},"layout-z-index.html":{"position":[[391,1]]},"ratio-tokens.html":{"position":[[294,3]]},"scale.html":{"position":[[777,3]]},"token-internal.html":{"position":[[3370,3]]}}}],["3.0.0",{"_index":432,"title":{},"contents":{"CHANGELOG.html":{"position":[[2624,5]]},"type-fonts.html":{"position":[[1662,6],[8985,6]]}}}],["3.0.1",{"_index":423,"title":{},"contents":{"CHANGELOG.html":{"position":[[2545,5]]}}}],["3.5",{"_index":1194,"title":{},"contents":{"token-register.html":{"position":[[35,4]]}}}],["300m",{"_index":180,"title":{},"contents":{"animate-change.html":{"position":[[2605,5],[2720,5],[3060,5],[3171,5]]}}}],["30em",{"_index":922,"title":{},"contents":{"layout-queries.html":{"position":[[497,5],[583,4],[2437,6],[2619,6],[3528,6],[4775,6],[4896,5],[4994,5],[5122,5]]}}}],["30px",{"_index":1182,"title":{},"contents":{"token-internal.html":{"position":[[1146,4]]}}}],["31",{"_index":515,"title":{},"contents":{"CHANGELOG.html":{"position":[[4891,6]]}}}],["32em",{"_index":1152,"title":{},"contents":{"token-api.html":{"position":[[5302,6],[5360,4]]}}}],["32px",{"_index":1119,"title":{},"contents":{"scale.html":{"position":[[2086,4]]},"token-internal.html":{"position":[[2322,4]]}}}],["35deg",{"_index":762,"title":{},"contents":{"color-themes.html":{"position":[[2437,5]]}}}],["36",{"_index":509,"title":{},"contents":{"CHANGELOG.html":{"position":[[4756,6]]}}}],["36rem",{"_index":964,"title":{},"contents":{"layout.html":{"position":[[447,6]]}}}],["38",{"_index":511,"title":{},"contents":{"CHANGELOG.html":{"position":[[4812,6]]}}}],["3:1",{"_index":709,"title":{},"contents":{"color-contrast.html":{"position":[[6363,3]]}}}],["3em",{"_index":1094,"title":{},"contents":{"scale-vars.html":{"position":[[550,5],[671,4]]},"token-api.html":{"position":[[4871,4],[5957,4]]}}}],["3rd",{"_index":1073,"title":{},"contents":{"scale-sizes.html":{"position":[[733,3]]}}}],["3vw",{"_index":1352,"title":{},"contents":{"utils.html":{"position":[[2946,7],[3025,4]]}}}],["4",{"_index":961,"title":{},"contents":{"layout-z-index.html":{"position":[[411,1]]}}}],["4.0.0",{"_index":208,"title":{},"contents":{"animate-ease.html":{"position":[[188,6]]},"CHANGELOG.html":{"position":[[23,5],[42,5]]},"ratio-tokens.html":{"position":[[1707,6]]},"ratios.html":{"position":[[157,6]]},"scale.html":{"position":[[1327,6]]},"token-api.html":{"position":[[4165,6],[5639,6]]},"token-config.html":{"position":[[348,6]]},"token-inspect.html":{"position":[[2057,6]]},"tokens.html":{"position":[[1024,6]]},"type-fonts.html":{"position":[[860,6],[1936,6],[7659,6],[9120,6],[10228,6]]},"type-helpers.html":{"position":[[140,6]]},"vars.html":{"position":[[610,6],[1695,6]]}}}],["4.5:1",{"_index":710,"title":{},"contents":{"color-contrast.html":{"position":[[6375,5]]}}}],["40",{"_index":737,"title":{},"contents":{"color-themes.html":{"position":[[821,4],[1071,4]]}}}],["41",{"_index":473,"title":{},"contents":{"CHANGELOG.html":{"position":[[3856,5],[4371,5]]}}}],["42.8571428571",{"_index":756,"title":{},"contents":{"color-themes.html":{"position":[[1992,15],[2014,14],[2785,15],[2807,14]]}}}],["45em",{"_index":923,"title":{},"contents":{"layout-queries.html":{"position":[[513,5]]}}}],["46",{"_index":505,"title":{},"contents":{"CHANGELOG.html":{"position":[[4637,6]]}}}],["46.1538461538",{"_index":739,"title":{},"contents":{"color-themes.html":{"position":[[955,15],[1199,15]]}}}],["49",{"_index":437,"title":{},"contents":{"CHANGELOG.html":{"position":[[2882,4],[3149,6]]}}}],["49.99em",{"_index":947,"title":{},"contents":{"layout-queries.html":{"position":[[4918,8],[5144,8]]}}}],["5",{"_index":962,"title":{},"contents":{"layout-z-index.html":{"position":[[425,1]]}}}],["5.5em",{"_index":1149,"title":{},"contents":{"token-api.html":{"position":[[5018,5],[6098,5]]}}}],["50",{"_index":73,"title":{},"contents":{"animate-change-vars.html":{"position":[[1366,4],[1371,5],[1405,5],[2345,4],[2350,5],[2384,5],[3381,4],[3386,5],[3420,5]]},"color-vars.html":{"position":[[1367,4],[1372,5],[1406,5],[2333,4],[2338,5],[2372,5],[3357,4],[3362,5],[3396,5]]},"token-inspect.html":{"position":[[1365,4],[1370,5],[2536,4],[2541,5]]},"token-vars.html":{"position":[[890,4],[895,5],[950,6],[1941,4],[1946,5],[2001,6],[3005,4],[3010,5],[3065,6]]},"tokens.html":{"position":[[3088,4],[3093,5],[3127,5],[4239,4],[4244,5],[4282,5]]}}}],["500",{"_index":684,"title":{},"contents":{"CHANGELOG.html":{"position":[[14173,5],[14231,4]]}}}],["50em",{"_index":944,"title":{},"contents":{"layout-queries.html":{"position":[[3640,5],[3713,6],[3814,5],[4825,5],[5009,5]]}}}],["50m",{"_index":304,"title":{},"contents":{"animate-time-vars.html":{"position":[[2254,6],[3251,6]]}}}],["53",{"_index":467,"title":{},"contents":{"CHANGELOG.html":{"position":[[3724,6]]}}}],["54",{"_index":501,"title":{},"contents":{"CHANGELOG.html":{"position":[[4539,6]]}}}],["57.1428571429",{"_index":757,"title":{},"contents":{"color-themes.html":{"position":[[2029,15],[2050,14],[2822,15],[2843,14]]}}}],["5em",{"_index":970,"title":{},"contents":{"layout.html":{"position":[[695,5]]}}}],["600",{"_index":1278,"title":{},"contents":{"type-fonts.html":{"position":[[3364,4],[3391,5]]}}}],["61",{"_index":455,"title":{},"contents":{"CHANGELOG.html":{"position":[[3363,6]]}}}],["62",{"_index":774,"title":{},"contents":{"color-tokens.html":{"position":[[1188,5],[2194,5]]},"color.html":{"position":[[599,5],[1233,5]]}}}],["71.4285714286",{"_index":758,"title":{},"contents":{"color-themes.html":{"position":[[2065,15],[2088,14],[2858,15],[2881,14]]}}}],["75",{"_index":1220,"title":{},"contents":{"tokens.html":{"position":[[2456,5]]}}}],["76.9230769231",{"_index":740,"title":{},"contents":{"color-themes.html":{"position":[[1014,15],[1256,15]]}}}],["7:1",{"_index":711,"title":{},"contents":{"color-contrast.html":{"position":[[6390,3]]}}}],["85",{"_index":773,"title":{},"contents":{"color-tokens.html":{"position":[[1183,4],[2189,4]]},"color.html":{"position":[[594,4],[1228,4]]}}}],["85.7142857143",{"_index":759,"title":{},"contents":{"color-themes.html":{"position":[[2103,15],[2126,14],[2896,15],[2919,14]]}}}],["8;base64",{"_index":1311,"title":{},"contents":{"type-fonts.html":{"position":[[5474,12],[5593,12]]}}}],["8in",{"_index":1105,"title":{},"contents":{"scale.html":{"position":[[562,4]]}}}],["8px",{"_index":1190,"title":{},"contents":{"token-internal.html":{"position":[[2872,3]]}}}],["999",{"_index":716,"title":{},"contents":{"color-contrast.html":{"position":[[7025,5]]}}}],["_",{"_index":51,"title":{},"contents":{"animate-change-vars.html":{"position":[[900,1]]},"animate-ease-vars.html":{"position":[[927,1]]},"animate-ease.html":{"position":[[172,1]]},"animate-time-vars.html":{"position":[[858,1]]},"CHANGELOG.html":{"position":[[2102,1],[5818,1],[6364,1],[7305,1],[7477,1],[7874,1],[8622,2],[8713,2]]},"color-contrast.html":{"position":[[282,1]]},"color-tokens.html":{"position":[[867,1]]},"color-vars.html":{"position":[[906,1]]},"color.html":{"position":[[1781,1]]},"ratio-tokens.html":{"position":[[222,1]]},"ratio-vars.html":{"position":[[655,1]]},"ratios.html":{"position":[[140,1],[220,1]]},"scale-vars.html":{"position":[[860,1]]},"token-inspect.html":{"position":[[225,1]]},"token-vars.html":{"position":[[1435,1]]},"type-font-vars.html":{"position":[[929,1]]}}}],["_a_var",{"_index":1363,"title":{},"contents":{"vars.html":{"position":[[696,6]]}}}],["_accoutrement_app",{"_index":1198,"title":{},"contents":{"token-register.html":{"position":[[1092,18]]}}}],["_brand",{"_index":71,"title":{},"contents":{"animate-change-vars.html":{"position":[[1347,9],[1385,9],[2326,9],[2364,9],[3362,9],[3400,9]]},"animate-time-vars.html":{"position":[[2210,9],[2235,9]]},"color-vars.html":{"position":[[1348,9],[1386,9],[2314,9],[2352,9],[3338,9],[3376,9]]},"token-inspect.html":{"position":[[1346,9],[1384,10],[1443,7],[1481,10],[1544,7],[1713,7],[1746,7]]},"token-vars.html":{"position":[[871,9],[909,9],[1922,9],[1960,9],[2986,9],[3024,9]]},"tokens.html":{"position":[[3069,9],[3107,9]]}}}],["_contrast",{"_index":596,"title":{},"contents":{"CHANGELOG.html":{"position":[[8221,9],[8241,9],[8386,9],[8406,9],[8435,9]]}}}],["_default",{"_index":1030,"title":{},"contents":{"ratio-tokens.html":{"position":[[443,9]]}}}],["_elast",{"_index":192,"title":{},"contents":{"animate-ease-vars.html":{"position":[[1383,11],[1439,12],[2434,11],[2490,12],[3494,11],[3550,12]]}}}],["_fast",{"_index":301,"title":{},"contents":{"animate-time-vars.html":{"position":[[1295,8],[1319,9],[3209,8],[3233,8]]}}}],["_fifth",{"_index":1033,"title":{},"contents":{"ratio-tokens.html":{"position":[[1028,7],[1097,7]]},"scale.html":{"position":[[711,10]]}}}],["_golden",{"_index":1028,"title":{},"contents":{"ratio-tokens.html":{"position":[[321,11]]},"scale-sizes.html":{"position":[[485,12]]}}}],["_i",{"_index":1235,"title":{},"contents":{"type-a11y.html":{"position":[[287,3],[326,3]]}}}],["_in",{"_index":185,"title":{},"contents":{"animate-ease-vars.html":{"position":[[560,5]]},"animate-ease.html":{"position":[[2588,5]]},"CHANGELOG.html":{"position":[[7912,3]]}}}],["_index.scss",{"_index":645,"title":{},"contents":{"CHANGELOG.html":{"position":[[11064,11]]}}}],["_major",{"_index":891,"title":{},"contents":{"index.html":{"position":[[1937,7]]},"ratio-vars.html":{"position":[[1137,8],[2084,8],[3098,8]]}}}],["_memo",{"_index":1154,"title":{},"contents":{"token-api.html":{"position":[[5474,6]]}}}],["_mi",{"_index":1371,"title":{},"contents":{"vars.html":{"position":[[1565,4]]}}}],["_minor",{"_index":593,"title":{},"contents":{"CHANGELOG.html":{"position":[[7515,6]]},"scale-sizes.html":{"position":[[3919,8],[5218,8]]}}}],["_octav",{"_index":1031,"title":{},"contents":{"ratio-tokens.html":{"position":[[987,8],[1080,8],[2215,8],[2384,8]]}}}],["_root",{"_index":1096,"title":{},"contents":{"scale-vars.html":{"position":[[1297,8],[1322,8],[2232,8],[2257,8],[3227,8],[3252,8]]}}}],["_testfont",{"_index":1240,"title":{},"contents":{"type-font-vars.html":{"position":[[1466,12],[1547,13],[2502,12],[2583,13],[3697,12],[3778,13]]}}}],["_token",{"_index":555,"title":{},"contents":{"CHANGELOG.html":{"position":[[6189,9]]}}}],["_widescreen",{"_index":1113,"title":{},"contents":{"scale.html":{"position":[[1856,12],[1890,15],[2014,12]]}}}],["a:hov",{"_index":814,"title":{},"contents":{"color.html":{"position":[[1851,7]]}}}],["aa",{"_index":527,"title":{},"contents":{"CHANGELOG.html":{"position":[[5210,3],[5214,2]]},"color-contrast.html":{"position":[[648,5],[656,3],[2007,5],[2015,3],[3580,5],[3588,3],[5180,5],[5188,3],[6281,4],[6291,2],[6349,3],[6367,4],[6686,5],[6694,3]]}}}],["aaa",{"_index":526,"title":{},"contents":{"CHANGELOG.html":{"position":[[5204,5]]},"color-contrast.html":{"position":[[669,5],[1346,5],[2028,5],[2742,5],[3601,5],[4365,5],[5201,5],[5956,5],[6286,4],[6381,5],[6707,5],[6988,6],[7031,7],[7091,6]]}}}],["abil",{"_index":1195,"title":{},"contents":{"token-register.html":{"position":[[194,7]]},"type-fonts.html":{"position":[[2277,7]]}}}],["abov",{"_index":927,"title":{},"contents":{"layout-queries.html":{"position":[[1695,7],[2823,7],[2889,5]]},"layout.html":{"position":[[526,8]]},"LICENSE.html":{"position":[[479,5]]},"token-api.html":{"position":[[2113,6]]},"tokens.html":{"position":[[3205,6]]}}}],["above('bann",{"_index":967,"title":{},"contents":{"layout.html":{"position":[[605,13]]}}}],["absolut",{"_index":575,"title":{},"contents":{"CHANGELOG.html":{"position":[[6744,8]]},"scale-units.html":{"position":[[614,8],[893,8]]}}}],["abstract",{"_index":150,"title":{},"contents":{"animate-change.html":{"position":[[1073,12]]},"animate-ease.html":{"position":[[2664,12]]},"animate-times.html":{"position":[[584,12]]},"color-tokens.html":{"position":[[491,12]]},"tokens.html":{"position":[[181,13],[2930,8]]}}}],["accent",{"_index":730,"title":{},"contents":{"color-themes.html":{"position":[[542,9],[1036,6],[1051,9],[1082,6],[1097,9],[1113,6],[1123,9],[1164,6],[1180,9],[1221,6],[1237,9]]},"tokens.html":{"position":[[2408,9],[2436,9]]}}}],["accept",{"_index":157,"title":{},"contents":{"animate-change.html":{"position":[[1348,7],[1406,7]]},"animate-ease.html":{"position":[[2926,7],[2984,7]]},"animate-times.html":{"position":[[938,7],[996,7]]},"CHANGELOG.html":{"position":[[1199,7],[1511,7],[3010,6],[9197,7],[9709,7],[9961,6],[10058,7],[10141,7],[10258,6],[10386,6],[10820,6],[10966,6],[11210,6],[11570,6],[11654,6],[11844,6],[12363,7]]},"color-tokens.html":{"position":[[2911,7]]},"color-utils.html":{"position":[[296,6],[1117,6]]},"layout-queries.html":{"position":[[847,7],[905,7],[977,7]]},"ratio-tokens.html":{"position":[[510,7],[568,7]]},"scale-sizes.html":{"position":[[2545,7],[3635,7],[4934,7]]},"token-api.html":{"position":[[4470,7]]},"tokens.html":{"position":[[1070,7],[1382,7]]},"type-fonts.html":{"position":[[2076,7],[3684,6],[7079,7],[7592,7],[8396,7],[9053,7],[9147,7],[9998,7],[10188,7],[10255,7]]}}}],["acces",{"_index":118,"title":{},"contents":{"animate-change.html":{"position":[[396,9]]}}}],["access",{"_index":93,"title":{"color-contrast.html":{"position":[[11,13]]},"token-api.html":{"position":[[0,9]]},"type-a11y.html":{"position":[[0,13]]}},"contents":{"animate-change-vars.html":{"position":[[2688,6]]},"animate-change.html":{"position":[[170,6],[1286,6],[2337,6],[2791,6]]},"animate-ease-vars.html":{"position":[[2817,6]]},"animate-ease.html":{"position":[[2216,7],[2404,10],[2856,6]]},"animate-time-vars.html":{"position":[[2543,6]]},"animate-times.html":{"position":[[288,10],[880,6]]},"animate.html":{"position":[[583,6],[1202,6]]},"CHANGELOG.html":{"position":[[1647,6],[5050,6],[5071,10],[5270,10],[5367,10],[6099,6],[10177,6],[12415,6],[13027,7]]},"color-contrast.html":{"position":[[11,13],[771,10],[952,13],[1622,6],[2130,10],[3703,10],[3939,13],[5303,10]]},"color-tokens.html":{"position":[[0,9],[179,10],[2414,9],[2631,6],[2771,6]]},"color-vars.html":{"position":[[2668,6]]},"color.html":{"position":[[829,6]]},"index.html":{"position":[[2698,6]]},"layout-queries.html":{"position":[[1022,6]]},"layout.html":{"position":[[127,6],[497,6]]},"ratio-tokens.html":{"position":[[50,6]]},"ratio-vars.html":{"position":[[2388,6]]},"scale-sizes.html":{"position":[[2034,9],[2067,6]]},"scale-vars.html":{"position":[[2561,6]]},"scale.html":{"position":[[191,6],[952,6],[1355,6]]},"token-api.html":{"position":[[267,6],[368,9],[1020,6],[3906,9],[4367,6],[4823,6],[5032,6],[5909,6]]},"token-config.html":{"position":[[419,6]]},"token-internal.html":{"position":[[644,6],[1233,6],[1822,6],[2396,6],[2971,6]]},"token-register.html":{"position":[[1037,6]]},"token-vars.html":{"position":[[2249,6]]},"tokens.html":{"position":[[895,6],[1518,6],[3249,6]]},"type-a11y.html":{"position":[[0,13],[87,13]]},"type-font-vars.html":{"position":[[2924,6]]},"type-fonts.html":{"position":[[315,8],[1234,6],[1438,6],[2529,6],[6037,6],[6613,6],[6996,6],[7176,9],[7505,6]]},"type.html":{"position":[[94,6],[201,13],[553,6],[774,6]]}}}],["account",{"_index":972,"title":{},"contents":{"layout.html":{"position":[[755,7]]}}}],["accoutr",{"_index":15,"title":{"index.html":{"position":[[0,12]]}},"contents":{"animate-change-vars.html":{"position":[[207,12],[3208,12]]},"animate-change.html":{"position":[[1677,12]]},"animate-ease-vars.html":{"position":[[204,12],[3335,12]]},"animate-ease.html":{"position":[[3247,12]]},"animate-time-vars.html":{"position":[[199,12],[3059,12]]},"animate-times.html":{"position":[[1248,12]]},"animate.html":{"position":[[415,12]]},"CHANGELOG.html":{"position":[[0,12],[7162,12],[11149,15],[12921,12],[13965,12],[14382,12],[14400,12],[14419,12],[14439,12],[14458,12]]},"color-themes.html":{"position":[[48,12]]},"color-vars.html":{"position":[[203,12],[3186,12]]},"CONTRIBUTING.html":{"position":[[16,12]]},"index.html":{"position":[[30,12],[642,12],[677,12],[1032,15]]},"layout-queries.html":{"position":[[112,12],[533,12],[780,12],[1252,12]]},"layout.html":{"position":[[400,12]]},"ratio-tokens.html":{"position":[[823,12],[1903,12]]},"ratio-vars.html":{"position":[[2906,12]]},"scale-sizes.html":{"position":[[56,13],[2873,12],[4248,12],[5547,12]]},"scale-units.html":{"position":[[264,12],[318,12],[1239,13]]},"scale-vars.html":{"position":[[199,12],[3077,12]]},"scale.html":{"position":[[1654,12]]},"token-api.html":{"position":[[68,12],[140,12],[997,12],[3928,12],[3965,12],[4141,12]]},"token-inspect.html":{"position":[[39,12]]},"token-internal.html":{"position":[[218,12],[618,12],[708,12],[1207,12],[1297,12],[1796,12],[1886,12],[2370,12],[2460,12],[2919,12],[3035,12]]},"token-register.html":{"position":[[146,12],[367,12],[859,13]]},"token-vars.html":{"position":[[326,12],[1339,12],[1697,12],[2424,12]]},"tokens.html":{"position":[[19,12],[4084,13]]},"type-font-vars.html":{"position":[[199,12],[3447,12]]},"type-fonts.html":{"position":[[7244,12],[7842,12],[8552,12],[9286,12],[10337,12]]},"utils.html":{"position":[[503,12],[2269,12],[3456,12],[4374,12],[5640,12]]}}}],["accoutrement/sass/.....loc",{"_index":1283,"title":{},"contents":{"type-fonts.html":{"position":[[3916,22]]}}}],["key>..path",{"_index":1282,"title":{},"contents":{"type-fonts.html":{"position":[[3753,21]]}}}],["key>..svgid",{"_index":1285,"title":{},"contents":{"type-fonts.html":{"position":[[4008,22]]}}}],["key>.display",{"_index":1275,"title":{},"contents":{"type-fonts.html":{"position":[[3046,14]]}}}],["key>.format",{"_index":1271,"title":{},"contents":{"type-fonts.html":{"position":[[2783,14]]}}}],["key>.nam",{"_index":1267,"title":{},"contents":{"type-fonts.html":{"position":[[2594,11]]}}}],["key>.stack",{"_index":1268,"title":{},"contents":{"type-fonts.html":{"position":[[2690,12]]}}}],["key>.unicod",{"_index":1274,"title":{},"contents":{"type-fonts.html":{"position":[[2921,13]]}}}],["keyword",{"_index":926,"title":{},"contents":{"layout-queries.html":{"position":[[1561,7]]},"ratio-tokens.html":{"position":[[2146,8]]}}}],["kind",{"_index":1003,"title":{},"contents":{"LICENSE.html":{"position":[[660,5]]}}}],["known",{"_index":1111,"title":{},"contents":{"scale.html":{"position":[[1313,7]]}}}],["languag",{"_index":1211,"title":{},"contents":{"tokens.html":{"position":[[600,10],[627,8]]}}}],["larg",{"_index":528,"title":{},"contents":{"CHANGELOG.html":{"position":[[5217,6]]},"color-contrast.html":{"position":[[660,6],[2019,6],[3592,6],[5192,6],[6294,6],[6353,6],[6698,6]]},"token-api.html":{"position":[[1073,6],[1305,6],[1356,6],[1396,7]]},"utils.html":{"position":[[777,5],[2897,6],[2979,6]]}}}],["larger",{"_index":895,"title":{},"contents":{"index.html":{"position":[[2010,6]]},"utils.html":{"position":[[2085,6]]}}}],["layer",{"_index":953,"title":{},"contents":{"layout-z-index.html":{"position":[[59,7],[514,5],[660,7],[699,5],[789,5],[934,5],[992,7],[1031,5]]}}}],["layout",{"_index":381,"title":{"layout.html":{"position":[[12,6]]}},"contents":{"CHANGELOG.html":{"position":[[724,6],[2355,7],[8562,6],[10029,6],[11815,6],[13404,7],[14432,6]]},"layout.html":{"position":[[12,6],[42,7],[259,6]]}}}],["learn",{"_index":671,"title":{},"contents":{"CHANGELOG.html":{"position":[[12874,5]]}}}],["leav",{"_index":1215,"title":{},"contents":{"tokens.html":{"position":[[2078,5]]}}}],["legaci",{"_index":360,"title":{},"contents":{"CHANGELOG.html":{"position":[[250,6],[1440,6]]},"tokens.html":{"position":[[1311,6]]}}}],["length",{"_index":165,"title":{},"contents":{"animate-change.html":{"position":[[1749,8]]},"animate-ease.html":{"position":[[3360,8]]},"animate-times.html":{"position":[[1318,8],[1342,6]]},"layout-queries.html":{"position":[[321,6],[1471,8],[1551,6],[2216,7],[2292,6],[3307,7],[3383,6],[4418,7],[4494,6],[4541,7],[4617,6]]},"scale-sizes.html":{"position":[[372,6],[2943,8],[2967,7],[3196,7],[3728,6],[3809,6],[4318,8],[4351,7],[5027,6],[5108,6]]},"scale-units.html":{"position":[[51,7],[356,8],[365,7],[387,6],[555,7],[623,6],[647,7],[673,8],[837,7],[902,6]]},"token-internal.html":{"position":[[789,7],[809,6],[863,7],[883,6],[1384,7],[1404,6],[1465,7],[1485,6],[1973,7],[1993,6],[2049,7],[2069,6],[2536,7],[2556,6],[2609,7],[2629,6],[3131,7],[3151,6],[3204,7],[3224,6]]},"utils.html":{"position":[[796,6],[4989,6]]}}}],["level",{"_index":458,"title":{},"contents":{"CHANGELOG.html":{"position":[[3404,5]]},"layout-z-index.html":{"position":[[113,5],[205,5]]}}}],["liabil",{"_index":1016,"title":{},"contents":{"LICENSE.html":{"position":[[897,10]]}}}],["liabl",{"_index":1013,"title":{},"contents":{"LICENSE.html":{"position":[[858,6]]}}}],["librari",{"_index":783,"title":{},"contents":{"color-tokens.html":{"position":[[1928,7]]},"index.html":{"position":[[429,7]]},"ratio-tokens.html":{"position":[[1377,7]]},"scale-sizes.html":{"position":[[1689,7]]},"type-fonts.html":{"position":[[5939,7]]}}}],["licens",{"_index":974,"title":{"LICENSE.html":{"position":[[4,7]]}},"contents":{"LICENSE.html":{"position":[[4,7]]},"type-fonts.html":{"position":[[1553,8]]}}}],["light",{"_index":366,"title":{},"contents":{"CHANGELOG.html":{"position":[[360,5],[5325,5],[5758,5],[5907,5],[8231,5],[8396,5]]},"color-config.html":{"position":[[231,5],[316,5],[345,6],[388,5]]},"color-contrast.html":{"position":[[153,5],[224,5],[556,5],[1037,8],[1113,8],[1239,8],[1315,8],[1915,5],[2408,8],[2488,8],[2631,8],[2711,8],[2792,6],[3488,5],[4024,8],[4104,8],[4254,8],[4334,8],[5088,5],[5582,8],[5666,8],[5841,8],[5925,8],[6055,6]]},"color-themes.html":{"position":[[442,5],[926,5],[985,5],[1171,5],[1228,5]]},"color-tokens.html":{"position":[[804,5],[916,5],[1201,7],[1299,7]]},"color-utils.html":{"position":[[67,5],[152,6],[207,5],[249,5],[303,6],[344,5],[553,6],[627,7]]},"color.html":{"position":[[612,7],[697,7],[1246,7],[1318,7],[1611,5],[1704,6]]},"token-vars.html":{"position":[[935,13],[1986,13],[3050,13]]}}}],["light/$dark",{"_index":599,"title":{},"contents":{"CHANGELOG.html":{"position":[[8317,12]]}}}],["light/dark",{"_index":600,"title":{},"contents":{"CHANGELOG.html":{"position":[[8445,10]]},"color-themes.html":{"position":[[68,10]]}}}],["lighter",{"_index":798,"title":{},"contents":{"color-utils.html":{"position":[[102,7],[613,7],[661,7],[1431,7]]}}}],["limit",{"_index":987,"title":{},"contents":{"LICENSE.html":{"position":[[252,10],[704,7]]},"utils.html":{"position":[[4951,7]]}}}],["line",{"_index":1023,"title":{},"contents":{"ratio-tokens.html":{"position":[[270,5]]},"ratio-vars.html":{"position":[[1122,5],[1250,4],[2069,5],[2185,5],[2293,4],[3083,5],[3129,4],[3271,4],[3296,4]]},"scale-sizes.html":{"position":[[3790,4],[5089,4]]},"scale-vars.html":{"position":[[1347,7],[1450,5],[2282,7],[2336,9],[2379,7],[2429,5],[2488,5],[3277,7],[3310,4],[3415,4],[3439,5]]},"token-api.html":{"position":[[2672,4],[2741,5],[2789,6]]}}}],["linear",{"_index":287,"title":{},"contents":{"animate-ease.html":{"position":[[1981,7]]},"color-themes.html":{"position":[[1733,6],[1883,6],[2676,6]]},"ratio-tokens.html":{"position":[[2085,8],[2137,8],[2293,7],[2416,7],[2424,6]]},"scale.html":{"position":[[1134,6],[1217,7],[1514,9],[1831,8],[1953,7],[1981,9],[2078,7]]}}}],["link",{"_index":502,"title":{},"contents":{"CHANGELOG.html":{"position":[[4557,5]]},"color-tokens.html":{"position":[[1330,7],[1430,7],[1749,4],[2242,7]]},"color.html":{"position":[[783,7],[1351,7]]},"type-fonts.html":{"position":[[1527,4],[1635,5]]}}}],["lint",{"_index":845,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[816,8],[946,4]]}}}],["list",{"_index":638,"title":{"utils.html":{"position":[[11,6]]}},"contents":{"CHANGELOG.html":{"position":[[10762,5],[12300,5],[13207,4],[13793,4],[14225,5]]},"color-contrast.html":{"position":[[358,5],[431,4],[1717,5],[1790,4],[3268,5],[3363,4],[4868,5],[4963,4],[7430,5]]},"color-tokens.html":{"position":[[2997,5]]},"color-utils.html":{"position":[[396,5],[1215,5]]},"index.html":{"position":[[1520,6]]},"layout-z-index.html":{"position":[[9,6],[37,4],[102,5],[211,4],[294,5],[836,6]]},"layout.html":{"position":[[85,4]]},"scale-sizes.html":{"position":[[557,4],[2534,5],[3624,5],[3737,5],[4923,5],[5036,5]]},"token-inspect.html":{"position":[[381,4]]},"token-internal.html":{"position":[[299,6]]},"tokens.html":{"position":[[3576,5]]},"type-font-vars.html":{"position":[[1285,5],[2320,5],[3514,5]]},"type-fonts.html":{"position":[[2703,6],[2712,4],[2798,6],[2807,4],[2942,6],[3359,4],[3775,6],[3939,6],[3948,4],[4031,6],[4139,6]]},"type-pseudo.html":{"position":[[420,6]]},"utils.html":{"position":[[83,6],[202,5],[285,4],[362,5],[388,4],[422,4],[558,6],[565,6],[585,4],[658,4],[671,6],[691,5],[791,4],[2482,5],[2512,4],[4176,4],[4571,4],[4764,4],[4837,4],[5012,4],[5025,6],[5048,4],[5116,7],[5179,8]]}}}],["list.index",{"_index":1174,"title":{},"contents":{"token-internal.html":{"position":[[196,13]]}}}],["list.nth",{"_index":1176,"title":{},"contents":{"token-internal.html":{"position":[[377,12],[412,12]]}}}],["live",{"_index":868,"title":{},"contents":{"index.html":{"position":[[414,6]]}}}],["load",{"_index":1270,"title":{},"contents":{"type-fonts.html":{"position":[[2759,4]]}}}],["local",{"_index":1244,"title":{},"contents":{"type-fonts.html":{"position":[[105,7],[450,7],[2237,5],[3233,7],[3983,7],[5269,7],[5383,8],[5500,8],[8880,5]]},"type.html":{"position":[[512,7],[1007,5],[1128,5]]}}}],["locat",{"_index":291,"title":{},"contents":{"animate-ease.html":{"position":[[2124,9]]},"type-fonts.html":{"position":[[191,8]]}}}],["logic",{"_index":1159,"title":{},"contents":{"token-inspect.html":{"position":[[110,5]]},"utils.html":{"position":[[4208,5]]}}}],["long",{"_index":1132,"title":{},"contents":{"token-api.html":{"position":[[1553,4]]},"type-fonts.html":{"position":[[807,4]]}}}],["longer",{"_index":354,"title":{},"contents":{"CHANGELOG.html":{"position":[[154,6],[295,6],[402,6],[1192,6],[1289,6],[1420,6],[2808,6],[3202,6],[3430,6],[9093,6],[12356,6]]},"index.html":{"position":[[2554,6]]},"layout-z-index.html":{"position":[[563,6]]},"token-api.html":{"position":[[819,6]]},"tokens.html":{"position":[[743,6],[1063,6],[1160,6],[1291,6]]},"type-fonts.html":{"position":[[2069,6],[9140,6],[10074,6],[10181,6],[10248,6]]}}}],["longhand",{"_index":516,"title":{},"contents":{"CHANGELOG.html":{"position":[[4918,8]]}}}],["look",{"_index":477,"title":{},"contents":{"CHANGELOG.html":{"position":[[3950,4],[4421,4]]}}}],["lookup",{"_index":1144,"title":{},"contents":{"token-api.html":{"position":[[4267,7],[5387,6],[5705,6]]},"token-config.html":{"position":[[552,6],[661,6]]},"token-inspect.html":{"position":[[2273,6],[2982,6]]},"utils.html":{"position":[[1186,6],[5418,6]]}}}],["lowest",{"_index":521,"title":{},"contents":{"CHANGELOG.html":{"position":[[5064,6]]},"layout-z-index.html":{"position":[[72,6]]}}}],["lumin",{"_index":713,"title":{},"contents":{"color-contrast.html":{"position":[[6495,9],[6610,9],[7170,11],[7329,11],[7354,9],[7509,9],[7548,9]]},"color-themes.html":{"position":[[1312,11]]},"color-tokens.html":{"position":[[3686,11]]}}}],["luminos",{"_index":721,"title":{},"contents":{"color-themes.html":{"position":[[140,11],[229,11]]}}}],["machin",{"_index":1207,"title":{},"contents":{"tokens.html":{"position":[[362,8]]}}}],["made",{"_index":680,"title":{},"contents":{"CHANGELOG.html":{"position":[[13947,4]]},"scale-sizes.html":{"position":[[3903,4],[5202,4]]}}}],["main",{"_index":813,"title":{},"contents":{"color.html":{"position":[[1421,4]]},"CONTRIBUTING.html":{"position":[[1089,4]]},"layout-z-index.html":{"position":[[325,7]]},"token-api.html":{"position":[[5293,8],[5313,5],[5354,5]]},"utils.html":{"position":[[824,5],[849,5],[894,6],[997,6]]}}}],["maintain",{"_index":897,"title":{},"contents":{"index.html":{"position":[[2096,12]]},"tokens.html":{"position":[[706,11]]},"type-fonts.html":{"position":[[413,11]]}}}],["major",{"_index":350,"title":{},"contents":{"CHANGELOG.html":{"position":[[76,5],[2500,8],[4377,5],[6873,5]]},"ratios.html":{"position":[[386,6],[453,6],[599,6],[652,6]]}}}],["make",{"_index":786,"title":{},"contents":{"color-tokens.html":{"position":[[2451,6]]},"color-utils.html":{"position":[[130,4],[962,4]]},"color.html":{"position":[[733,4]]},"CONTRIBUTING.html":{"position":[[623,4]]},"index.html":{"position":[[2062,6]]},"layout-queries.html":{"position":[[1412,6]]},"token-api.html":{"position":[[1516,4]]},"token-register.html":{"position":[[117,6]]}}}],["manag",{"_index":312,"title":{},"contents":{"animate-times.html":{"position":[[32,6]]},"animate.html":{"position":[[30,8]]},"color-config.html":{"position":[[77,8]]},"color.html":{"position":[[28,8]]},"index.html":{"position":[[163,6],[1092,8],[1144,8],[1196,8],[1261,8],[1333,8],[1599,8]]},"layout.html":{"position":[[29,8],[90,6]]},"scale.html":{"position":[[36,10]]},"token-api.html":{"position":[[355,8],[3825,6]]},"token-config.html":{"position":[[521,8]]},"token-internal.html":{"position":[[88,11]]},"token-register.html":{"position":[[316,6]]},"type-fonts.html":{"position":[[1092,8],[5696,11]]},"utils.html":{"position":[[57,6]]},"vars.html":{"position":[[56,6],[191,6]]}}}],["mani",{"_index":906,"title":{},"contents":{"index.html":{"position":[[2431,4]]},"token-api.html":{"position":[[1463,4]]},"token-vars.html":{"position":[[37,4]]},"utils.html":{"position":[[3737,4]]},"vars.html":{"position":[[157,4]]}}}],["manipul",{"_index":907,"title":{},"contents":{"index.html":{"position":[[2460,10]]},"utils.html":{"position":[[290,13],[1302,13],[2022,13],[2835,10],[3869,10]]}}}],["manual",{"_index":1368,"title":{},"contents":{"vars.html":{"position":[[1377,8]]}}}],["map",{"_index":16,"title":{"animate-change.html":{"position":[[18,4]]},"animate-ease.html":{"position":[[7,4]]},"animate-times.html":{"position":[[7,4]]},"layout-queries.html":{"position":[[17,4]]},"scale-sizes.html":{"position":[[5,4]]},"type-fonts.html":{"position":[[5,4]]},"utils.html":{"position":[[5,5]]}},"contents":{"animate-change-vars.html":{"position":[[220,4],[435,5],[810,3],[1169,5],[1199,3],[1312,3],[1655,3],[1795,4],[2238,5],[2253,3],[2901,3],[3193,5],[3221,3]]},"animate-change.html":{"position":[[18,5],[283,3],[384,3],[1199,4],[1325,4],[1360,3],[1422,3],[1566,4],[1581,3],[1662,5],[1697,3],[1910,4],[2127,6],[2134,8],[2162,4],[2262,4],[2378,4],[2833,4]]},"animate-ease-vars.html":{"position":[[217,4],[432,5],[837,3],[1201,5],[1231,3],[1349,3],[1770,3],[1908,4],[2348,5],[2363,3],[3028,3],[3320,5],[3348,3]]},"animate-ease.html":{"position":[[157,4],[1899,5],[2306,3],[2392,3],[2806,4],[2903,4],[2938,3],[3000,3],[3137,4],[3152,3],[3232,5],[3267,3],[3485,4],[3693,6],[3700,8],[3728,4],[3818,4]]},"animate-time-vars.html":{"position":[[212,4],[423,5],[772,3],[1123,5],[1153,3],[1262,3],[1553,3],[1687,4],[2126,5],[2141,3],[2752,3],[3044,5],[3072,3]]},"animate-times.html":{"position":[[7,5],[192,3],[276,3],[728,4],[758,3],[915,4],[950,3],[1012,3],[1139,4],[1154,3],[1233,5],[1268,3],[1433,4],[1639,6],[1646,8],[1674,4],[1763,4]]},"animate.html":{"position":[[120,4]]},"CHANGELOG.html":{"position":[[590,3],[651,4],[846,3],[1071,4],[1118,3],[1185,3],[1918,3],[2136,5],[2769,4],[3005,4],[4855,5],[4927,3],[6116,3],[6557,4],[6704,3],[6768,3],[7686,3],[8918,3],[9431,3],[9766,3],[10017,3],[10115,3],[10211,3],[10314,3],[10484,3],[10876,3],[11027,3],[11302,3],[11979,3],[12034,3],[12572,3],[12781,3],[12868,5],[12967,3],[13015,3],[13526,4],[13978,4]]},"color-contrast.html":{"position":[[315,4]]},"color-themes.html":{"position":[[61,3],[103,3],[339,5],[356,3],[2185,5],[2986,5]]},"color-tokens.html":{"position":[[25,5],[81,3],[167,3],[664,4],[694,3],[1058,3],[1636,4],[1975,6],[1982,8],[2010,4],[2100,4],[2365,5],[2514,3],[2660,3],[2725,4],[3070,3],[3106,4],[3121,3],[3201,5],[3216,3],[3288,4]]},"color-vars.html":{"position":[[216,4],[429,5],[818,3],[1173,5],[1203,3],[1314,3],[1650,3],[1787,4],[2228,5],[2243,3],[2879,3],[3171,5],[3199,3]]},"color.html":{"position":[[97,4],[112,4],[1002,5],[1087,3],[1141,5],[1434,4]]},"index.html":{"position":[[1440,4],[1540,4],[1632,5],[1647,5],[1726,4],[1848,5],[1989,3],[2365,3],[2485,3],[2571,4],[2727,4]]},"layout-queries.html":{"position":[[27,5],[77,3],[287,3],[379,3],[768,4],[806,3],[859,3],[921,3],[1052,3],[1137,4],[1152,3],[1237,5],[1272,3],[1659,5]]},"layout.html":{"position":[[118,4]]},"ratio-tokens.html":{"position":[[96,5],[233,6],[522,3],[584,3],[713,4],[728,3],[808,5],[843,3],[1233,4],[1424,6],[1431,8],[1459,4],[1549,4],[1606,5],[1888,5],[1923,3]]},"ratio-vars.html":{"position":[[211,5],[567,3],[922,5],[952,3],[1063,3],[1517,4],[1958,5],[1973,3],[2599,3],[2891,5],[2919,3]]},"scale-sizes.html":{"position":[[27,5],[252,3],[444,3],[828,5],[868,3],[962,3],[990,5],[1400,4],[1736,6],[1743,8],[1771,4],[1860,4],[2028,5],[2102,4],[2213,3],[2268,3],[2561,3],[2690,4],[2717,3],[2858,5],[2893,3],[3303,3],[3358,3],[3651,3],[4065,4],[4092,3],[4233,5],[4268,3],[4602,3],[4657,3],[4950,3],[5364,4],[5391,3],[5532,5],[5567,3]]},"scale-units.html":{"position":[[277,5],[331,4],[1233,5]]},"scale-vars.html":{"position":[[212,4],[423,5],[774,3],[1125,5],[1155,3],[1264,3],[1575,3],[1709,4],[2148,5],[2163,3],[2770,3],[3062,5],[3090,3]]},"scale.html":{"position":[[90,3],[1406,4],[1639,5],[1674,3]]},"token-api.html":{"position":[[6,4],[81,5],[104,4],[161,5],[229,3],[495,3],[597,3],[646,4],[700,5],[870,5],[1010,5],[1297,4],[1334,5],[1577,3],[1728,5],[1954,5],[2081,3],[2384,3],[2449,5],[2621,4],[2719,5],[3053,5],[3339,5],[3941,3],[4031,3],[4129,3],[4154,4],[4384,3],[4482,3],[4543,5],[4549,5],[4557,3],[4635,3],[4680,4],[4695,3],[4805,3],[4832,3],[4845,5],[5046,3],[5057,5],[5221,4],[5270,4],[5288,4],[5574,4],[5697,3],[5732,5],[5738,5],[5746,3],[5837,3],[5892,3],[5918,3],[5931,5]]},"token-config.html":{"position":[[415,3]]},"token-inspect.html":{"position":[[52,3],[974,5],[980,5],[988,3],[2046,4],[2176,5],[2182,5],[2190,3]]},"token-internal.html":{"position":[[631,5],[721,4],[1220,5],[1310,4],[1809,5],[1899,4],[2383,5],[2473,4],[2932,5],[3048,4]]},"token-register.html":{"position":[[159,3],[245,5],[301,3],[380,5],[537,4],[616,3],[668,3],[725,3],[1033,3],[1086,5],[1143,3],[1221,5]]},"token-vars.html":{"position":[[95,3],[213,3],[314,5],[320,5],[339,3],[417,4],[1359,3],[1685,5],[1691,5],[1710,3],[1894,3],[2412,5],[2418,5],[2437,3],[2515,4]]},"tokens.html":{"position":[[75,4],[306,4],[760,4],[924,4],[1056,3],[1789,3],[2143,4],[2158,3],[2651,4],[3201,3],[3811,3],[4163,5]]},"type-font-vars.html":{"position":[[212,4],[423,5],[843,3],[1194,5],[1224,3],[1296,3],[1439,3],[1739,3],[1873,4],[2331,3],[2418,5],[2433,3],[3133,3],[3432,5],[3460,3],[3525,3]]},"type-fonts.html":{"position":[[759,3],[1050,5],[1084,3],[1159,3],[1509,5],[1691,3],[1868,3],[2052,3],[2181,4],[2385,3],[2476,3],[2498,5],[2563,3],[3212,4],[3693,3],[5687,3],[5729,3],[6005,5],[6088,5],[6094,5],[6100,3],[6217,4],[6513,5],[6582,4],[6791,3],[6822,3],[7019,3],[7070,3],[7095,3],[7229,5],[7264,3],[7314,5],[7344,3],[7543,4],[7608,3],[7806,4],[7827,5],[7862,3],[8412,3],[8516,4],[8537,5],[8572,3],[9030,4],[9069,3],[9251,3],[9271,5],[9306,3],[10322,5],[10357,3]]},"type.html":{"position":[[90,3]]},"utils.html":{"position":[[73,5],[516,4],[816,5],[1216,4],[1298,3],[1355,4],[1374,4],[1509,4],[1534,3],[1567,3],[1637,6],[1644,9],[1673,4],[1700,5],[1717,3],[2282,4],[2859,5],[3469,4],[3893,5],[4387,4],[5108,5],[5653,4],[5868,5]]},"vars.html":{"position":[[1246,3],[1342,4],[1396,5],[1471,3],[1743,5],[1760,3],[1970,4]]}}}],["map.get",{"_index":483,"title":{},"contents":{"CHANGELOG.html":{"position":[[4105,9]]},"token-config.html":{"position":[[241,9]]}}}],["map.ha",{"_index":1169,"title":{},"contents":{"token-inspect.html":{"position":[[2132,7]]}}}],["margin",{"_index":1180,"title":{},"contents":{"token-internal.html":{"position":[[1017,9],[1060,11],[1625,9],[1667,11]]}}}],["mark",{"_index":559,"title":{},"contents":{"CHANGELOG.html":{"position":[[6311,6]]},"token-inspect.html":{"position":[[202,6],[398,6]]}}}],["match",{"_index":1076,"title":{},"contents":{"scale-sizes.html":{"position":[[1089,5]]},"token-config.html":{"position":[[395,5]]}}}],["math",{"_index":674,"title":{},"contents":{"CHANGELOG.html":{"position":[[13174,5],[13844,4]]},"scale-sizes.html":{"position":[[506,4],[637,4]]},"token-internal.html":{"position":[[286,4]]},"tokens.html":{"position":[[3570,5]]}}}],["maven",{"_index":1330,"title":{},"contents":{"type.html":{"position":[[581,8]]}}}],["maven/maven_pro_bold",{"_index":1332,"title":{},"contents":{"type.html":{"position":[[713,21]]}}}],["maven/maven_pro_regular",{"_index":1331,"title":{},"contents":{"type.html":{"position":[[670,24]]}}}],["max",{"_index":583,"title":{},"contents":{"CHANGELOG.html":{"position":[[6989,4]]},"color-contrast.html":{"position":[[987,3],[2338,3],[3974,3],[5532,3]]},"layout-queries.html":{"position":[[1904,3],[2210,5],[2425,4],[2535,4],[2704,4],[2994,3],[3949,3],[4106,3],[4535,5],[4906,4],[5132,4],[5290,5],[5333,5],[5374,3],[5514,3],[5622,3],[5694,3]]},"layout.html":{"position":[[733,3]]}}}],["maximum",{"_index":522,"title":{},"contents":{"CHANGELOG.html":{"position":[[5128,7]]},"color-contrast.html":{"position":[[806,7],[2165,7],[3738,7],[5338,7]]},"layout-queries.html":{"position":[[4636,7]]},"utils.html":{"position":[[4981,7]]}}}],["max–./accoutr",{"_index":879,"title":{},"contents":{"index.html":{"position":[[782,18]]}}}],["to>/accoutrement/sass/anim",{"_index":330,"title":{},"contents":{"animate.html":{"position":[[306,31]]}}}],["to>/accoutrement/sass/color",{"_index":807,"title":{},"contents":{"color.html":{"position":[[397,29]]},"index.html":{"position":[[910,29]]}}}],["to>/accoutrement/sass/layout",{"_index":963,"title":{},"contents":{"layout.html":{"position":[[297,30]]}}}],["to>/accoutrement/sass/scal",{"_index":1103,"title":{},"contents":{"scale.html":{"position":[[352,29]]}}}],["to>/accoutrement/sass/token",{"_index":1214,"title":{},"contents":{"tokens.html":{"position":[[2013,30]]}}}],["to>/accoutrement/sass/tool",{"_index":880,"title":{},"contents":{"index.html":{"position":[[813,29]]}}}],["to>/accoutrement/sass/typ",{"_index":1329,"title":{},"contents":{"type.html":{"position":[[372,28]]}}}],["toast",{"_index":199,"title":{},"contents":{"animate-ease-vars.html":{"position":[[2597,9],[2708,6]]}}}],["togeth",{"_index":143,"title":{},"contents":{"animate-change.html":{"position":[[903,8]]},"token-api.html":{"position":[[1845,8]]},"token-internal.html":{"position":[[606,8]]},"type-fonts.html":{"position":[[5788,8]]}}}],["token",{"_index":26,"title":{"color-tokens.html":{"position":[[6,6]]},"color-vars.html":{"position":[[6,6]]},"ratio-tokens.html":{"position":[[6,6]]},"ratio-vars.html":{"position":[[6,6]]},"token-api.html":{"position":[[10,6]]},"token-config.html":{"position":[[0,6]]},"token-inspect.html":{"position":[[11,6]]},"token-vars.html":{"position":[[0,6]]},"tokens.html":{"position":[[12,6]]}},"contents":{"animate-change-vars.html":{"position":[[349,7],[2054,5],[2068,5],[2736,6],[2784,5],[3018,5],[3032,5],[3310,8],[3675,7]]},"animate-ease-vars.html":{"position":[[346,7],[1245,6],[2165,5],[2179,5],[2865,6],[2913,5],[3145,5],[3159,5],[3362,6],[3443,8],[3853,7]]},"animate-ease.html":{"position":[[151,5]]},"animate-time-vars.html":{"position":[[339,7],[1944,5],[1958,5],[2591,6],[2639,5],[2869,5],[2883,5],[3159,8],[3497,7]]},"CHANGELOG.html":{"position":[[576,8],[1076,7],[1252,5],[1344,5],[1476,7],[1524,5],[1585,5],[1686,5],[1764,5],[1892,7],[1942,5],[1997,5],[2130,5],[2217,7],[2665,7],[3166,7],[3380,7],[4063,7],[4125,7],[4187,7],[4415,5],[6120,6],[6182,6],[6221,5],[6259,6],[6708,5],[7175,6],[7203,6],[7215,5],[7230,8],[7279,5],[7448,6],[7574,7],[7640,5],[7690,6],[7845,6],[8593,6],[8684,6],[11180,7]]},"color-contrast.html":{"position":[[2900,7],[6457,5],[6572,5],[7459,5]]},"color-vars.html":{"position":[[344,7],[2045,5],[2059,5],[2716,6],[2764,5],[2996,5],[3010,5],[3287,8],[3643,7]]},"color.html":{"position":[[433,6],[461,5],[523,5],[1731,6],[1838,5]]},"index.html":{"position":[[182,6],[1545,6],[1556,5],[1615,6],[1840,7],[2403,5],[2471,6],[2565,5],[2807,5]]},"ratio-tokens.html":{"position":[[6,6],[74,5],[227,5],[1678,6],[1784,7],[2012,7],[2052,5]]},"ratio-vars.html":{"position":[[6,6],[126,7],[1384,6],[1775,5],[1789,5],[2436,6],[2484,5],[2716,5],[2730,5],[3007,8],[3403,7]]},"ratios.html":{"position":[[87,5]]},"scale-vars.html":{"position":[[339,7],[1966,5],[1980,5],[2609,6],[2657,5],[2887,5],[2901,5],[3177,8],[3513,7]]},"scale.html":{"position":[[1400,5],[1439,6],[1496,6]]},"token-api.html":{"position":[[0,5],[18,7],[153,7],[223,5],[261,5],[283,7],[385,5],[987,6],[2712,6],[4204,5],[4252,5],[4285,5],[4388,6],[4564,5],[5050,6],[5430,7],[5543,5],[5674,5],[5753,5],[5792,7],[5965,7],[6058,8],[6134,7]]},"token-config.html":{"position":[[150,5],[611,7]]},"token-inspect.html":{"position":[[11,6],[56,5],[170,7],[189,5],[326,5],[531,8],[580,8],[695,6],[798,5],[841,5],[1022,7],[1038,5],[1182,5],[1220,7],[1866,7],[1889,5],[2004,7],[2022,5],[2080,5],[2224,7],[2240,5],[2324,5],[2431,5],[2469,5]]},"token-internal.html":{"position":[[82,5]]},"token-vars.html":{"position":[[0,6],[89,5],[163,5],[217,6],[346,6],[370,7],[382,5],[484,5],[603,5],[617,5],[831,5],[1249,7],[1298,6],[1316,6],[1352,6],[1407,5],[1503,6],[1717,6],[1805,5],[1880,6],[2188,5],[2219,7],[2241,7],[2297,6],[2345,5],[2444,6],[2468,7],[2480,5],[2868,5],[3494,5]]},"tokens.html":{"position":[[12,6],[32,6],[90,8],[159,6],[506,5],[754,5],[1004,5],[1123,5],[1215,5],[1347,7],[1395,5],[1456,5],[1557,5],[1635,5],[1763,7],[1813,5],[1868,5],[1984,6],[2137,5],[2190,6],[2303,6],[2346,6],[2645,5],[2687,6],[2808,7],[2874,6],[4146,5]]},"type-font-vars.html":{"position":[[339,7],[2130,5],[2144,5],[2972,6],[3020,5],[3250,5],[3264,5],[3653,8],[4000,7]]},"type-fonts.html":{"position":[[10948,7]]},"utils.html":{"position":[[1126,7],[1406,6]]},"vars.html":{"position":[[420,5],[753,5],[843,5],[1159,5],[1183,7]]}}}],["token($color",{"_index":1171,"title":{},"contents":{"token-inspect.html":{"position":[[2611,14],[2661,14],[2724,14],[2803,14]]},"token-vars.html":{"position":[[3129,14],[3172,14]]},"tokens.html":{"position":[[3316,14],[3359,14]]}}}],["token($map",{"_index":1146,"title":{},"contents":{"token-api.html":{"position":[[4409,11]]}}}],["token($sourc",{"_index":595,"title":{},"contents":{"CHANGELOG.html":{"position":[[7747,14]]}}}],["token('_priv",{"_index":1160,"title":{},"contents":{"token-inspect.html":{"position":[[515,15]]}}}],["token('publ",{"_index":1161,"title":{},"contents":{"token-inspect.html":{"position":[[566,13]]}}}],["token.get",{"_index":904,"title":{},"contents":{"index.html":{"position":[[2381,11]]},"tokens.html":{"position":[[2531,11]]}}}],["token.get($color",{"_index":1221,"title":{},"contents":{"tokens.html":{"position":[[2611,18]]}}}],["token.register('mi",{"_index":1227,"title":{},"contents":{"tokens.html":{"position":[[4003,18]]}}}],["token.register('rgba",{"_index":1228,"title":{},"contents":{"tokens.html":{"position":[[4178,22]]}}}],["tokens.$handl",{"_index":395,"title":{},"contents":{"CHANGELOG.html":{"position":[[1367,14]]},"tokens.html":{"position":[[1238,14]]}}}],["token’",{"_index":85,"title":{},"contents":{"animate-change-vars.html":{"position":[[2143,7],[3107,7]]},"animate-ease-vars.html":{"position":[[2254,7],[3234,7]]},"animate-time-vars.html":{"position":[[2033,7],[2958,7]]},"color-vars.html":{"position":[[2134,7],[3085,7]]},"ratio-vars.html":{"position":[[1864,7],[2805,7]]},"scale-vars.html":{"position":[[2055,7],[2976,7]]},"token-vars.html":{"position":[[692,7]]},"type-font-vars.html":{"position":[[2219,7],[3339,7]]}}}],["tool",{"_index":323,"title":{},"contents":{"animate.html":{"position":[[20,5]]},"CHANGELOG.html":{"position":[[6211,5],[11096,7],[13047,5]]},"color-tokens.html":{"position":[[962,6]]},"color.html":{"position":[[18,5],[1798,5]]},"index.html":{"position":[[366,5],[990,7]]},"layout.html":{"position":[[19,5]]},"ratio-tokens.html":{"position":[[21,5]]},"scale.html":{"position":[[47,6]]},"token-inspect.html":{"position":[[18,5]]},"token-register.html":{"position":[[83,5]]},"token-vars.html":{"position":[[141,5]]},"tokens.html":{"position":[[482,5],[696,5]]},"type-fonts.html":{"position":[[372,4],[1310,4],[1345,5],[6593,5]]},"vars.html":{"position":[[260,5]]}}}],["tools.$breakpoint",{"_index":920,"title":{},"contents":{"layout-queries.html":{"position":[[466,19],[552,19],[2591,19],[3683,19],[4965,19]]}}}],["tools.$chang",{"_index":38,"title":{},"contents":{"animate-change-vars.html":{"position":[[536,15],[573,13],[1329,15],[2308,15],[3344,15]]},"animate-change.html":{"position":[[2568,15],[3026,15]]}}}],["tools.$color",{"_index":697,"title":{},"contents":{"color-contrast.html":{"position":[[1000,14],[1202,14],[2371,14],[2594,14],[3987,14],[4217,14],[5545,14],[5804,14]]},"color-vars.html":{"position":[[530,14],[565,12],[1331,14],[2297,14],[3321,14]]}}}],["tools.$eas",{"_index":184,"title":{},"contents":{"animate-ease-vars.html":{"position":[[533,14],[578,13],[1366,14],[2417,14],[3477,14]]}}}],["tools.$font",{"_index":1236,"title":{},"contents":{"type-font-vars.html":{"position":[[524,13],[2486,13]]},"type-helpers.html":{"position":[[378,11]]}}}],["tools.$ratio",{"_index":1022,"title":{},"contents":{"ratio-tokens.html":{"position":[[253,14]]},"ratio-vars.html":{"position":[[312,14],[348,12],[1080,14],[2027,14],[3041,14]]}}}],["tools.$siz",{"_index":1093,"title":{},"contents":{"scale-vars.html":{"position":[[524,13],[556,11],[1281,13],[2216,13],[3211,13]]}}}],["tools.$tim",{"_index":299,"title":{},"contents":{"animate-time-vars.html":{"position":[[524,13],[555,11],[1279,13],[2194,13],[3193,13]]}}}],["tools.above('green",{"_index":945,"title":{},"contents":{"layout-queries.html":{"position":[[3729,20]]}}}],["tools.above(50em",{"_index":943,"title":{},"contents":{"layout-queries.html":{"position":[[3558,17]]}}}],["tools.add",{"_index":731,"title":{},"contents":{"color-themes.html":{"position":[[569,9],[659,9]]},"color-tokens.html":{"position":[[2277,9]]},"scale-sizes.html":{"position":[[1958,9]]},"type-fonts.html":{"position":[[6405,9]]}}}],["tools.animate('fad",{"_index":182,"title":{},"contents":{"animate-change.html":{"position":[[2649,19]]}}}],["tools.below('r",{"_index":940,"title":{},"contents":{"layout-queries.html":{"position":[[2635,18]]}}}],["tools.below(30em",{"_index":938,"title":{},"contents":{"layout-queries.html":{"position":[[2467,17]]}}}],["tools.between('r",{"_index":948,"title":{},"contents":{"layout-queries.html":{"position":[[5027,20]]}}}],["tools.between(30em",{"_index":946,"title":{},"contents":{"layout-queries.html":{"position":[[4805,19]]}}}],["tools.chang",{"_index":43,"title":{},"contents":{"animate-change-vars.html":{"position":[[626,12],[1449,13],[2432,12],[2467,12]]}}}],["tools.color",{"_index":804,"title":{},"contents":{"color-vars.html":{"position":[[617,11],[1450,12],[2420,11],[2454,11]]}}}],["tools.compile($map",{"_index":1155,"title":{},"contents":{"token-api.html":{"position":[[6036,21]]}}}],["tools.contrast",{"_index":701,"title":{},"contents":{"color-contrast.html":{"position":[[1083,15],[1285,15],[4072,17],[4302,17],[6937,16],[6995,16]]}}}],["tools.custom",{"_index":1373,"title":{},"contents":{"vars.html":{"position":[[1644,12],[2060,12]]}}}],["tools.eas",{"_index":186,"title":{},"contents":{"animate-ease-vars.html":{"position":[[631,10],[1498,12],[2553,10],[2585,10]]}}}],["tools.font",{"_index":1239,"title":{},"contents":{"type-font-vars.html":{"position":[[644,10],[1597,11],[2637,10],[2668,10]]},"type-fonts.html":{"position":[[8135,10],[8747,10],[9681,10]]},"type-helpers.html":{"position":[[415,10]]}}}],["tools.get($map",{"_index":1148,"title":{},"contents":{"token-api.html":{"position":[[4955,17],[5105,17]]},"utils.html":{"position":[[2961,17],[3975,17],[5161,17],[5978,17]]}}}],["tools.get($mi",{"_index":1151,"title":{},"contents":{"token-api.html":{"position":[[5256,13]]}}}],["tools.get($s",{"_index":1177,"title":{},"contents":{"token-internal.html":{"position":[[443,19],[488,19],[1087,19],[1692,19],[2263,19],[2817,19],[3386,19]]}}}],["tools.ha",{"_index":1170,"title":{},"contents":{"token-inspect.html":{"position":[[2599,11],[2649,11],[2712,11],[2791,11]]}}}],["tools.i",{"_index":1036,"title":{},"contents":{"ratio-tokens.html":{"position":[[2224,10],[2264,10],[2301,10],[2341,10]]},"token-inspect.html":{"position":[[496,10],[547,10],[1451,10],[1505,10],[1579,10],[1636,10]]}}}],["tools.ident($nam",{"_index":1366,"title":{},"contents":{"vars.html":{"position":[[963,20]]}}}],["tools.import",{"_index":1321,"title":{},"contents":{"type-fonts.html":{"position":[[10851,12]]}}}],["tools.ratio",{"_index":1042,"title":{},"contents":{"ratio-vars.html":{"position":[[400,12],[1173,12],[2124,11],[2161,11]]}}}],["tools.ratio('_fifth",{"_index":1034,"title":{},"contents":{"ratio-tokens.html":{"position":[[1036,24]]}}}],["tools.ratio('_octav",{"_index":1032,"title":{},"contents":{"ratio-tokens.html":{"position":[[996,25]]}}}],["tools.scale(16px",{"_index":1116,"title":{},"contents":{"scale.html":{"position":[[1961,19]]}}}],["tools.scale(24px",{"_index":1115,"title":{},"contents":{"scale.html":{"position":[[1917,19]]}}}],["tools.scale(700px",{"_index":1114,"title":{},"contents":{"scale.html":{"position":[[1869,20]]}}}],["tools.shad",{"_index":733,"title":{},"contents":{"color-themes.html":{"position":[[616,12]]}}}],["tools.siz",{"_index":1095,"title":{},"contents":{"scale-vars.html":{"position":[[607,10],[1385,11],[2324,10],[2355,10]]}}}],["tools.strip",{"_index":745,"title":{},"contents":{"color-themes.html":{"position":[[1760,12],[2537,12]]}}}],["tools.tim",{"_index":300,"title":{},"contents":{"animate-time-vars.html":{"position":[[606,10],[1365,11],[2301,10],[2332,10]]}}}],["tools.token",{"_index":1200,"title":{},"contents":{"token-vars.html":{"position":[[999,11],[1042,11],[2046,12]]},"tokens.html":{"position":[[3221,12]]}}}],["tools.transition('fad",{"_index":183,"title":{},"contents":{"animate-change.html":{"position":[[3099,25]]}}}],["tools.var",{"_index":99,"title":{},"contents":{"animate-change-vars.html":{"position":[[3474,9],[3510,9]]},"animate-ease-vars.html":{"position":[[3623,9]]},"animate-time-vars.html":{"position":[[3309,9],[3339,9]]},"color-contrast.html":{"position":[[2454,9],[2677,9],[5630,9],[5889,9]]},"color-vars.html":{"position":[[3449,9],[3483,9]]},"ratio-vars.html":{"position":[[3142,9],[3199,11]]},"scale-vars.html":{"position":[[3323,9],[3356,9]]},"token-vars.html":{"position":[[3119,9],[3162,9]]},"tokens.html":{"position":[[3306,9],[3349,9]]},"type-font-vars.html":{"position":[[3836,9]]}}}],["top",{"_index":956,"title":{},"contents":{"layout-z-index.html":{"position":[[201,3]]}}}],["tort",{"_index":1019,"title":{},"contents":{"LICENSE.html":{"position":[[942,4]]}}}],["total",{"_index":675,"title":{},"contents":{"CHANGELOG.html":{"position":[[13278,7]]}}}],["trace",{"_index":1166,"title":{},"contents":{"token-inspect.html":{"position":[[1055,6],[1090,5],[1132,5]]}}}],["transform",{"_index":132,"title":{},"contents":{"animate-change.html":{"position":[[668,9]]}}}],["transit",{"_index":105,"title":{},"contents":{"animate-change.html":{"position":[[37,11],[105,11],[320,12],[647,11],[1852,12],[2778,12],[2804,11],[2860,10],[2924,11],[2985,12],[3151,11]]},"animate-ease-vars.html":{"position":[[3665,11],[3787,11]]},"animate-time-vars.html":{"position":[[3289,11],[3396,11]]},"animate.html":{"position":[[52,12],[103,11],[677,10],[709,10],[746,10],[850,11],[953,11],[1266,11],[1470,12]]},"index.html":{"position":[[1105,11]]}}}],["transition('fad",{"_index":345,"title":{},"contents":{"animate.html":{"position":[[1381,16]]}}}],["translat",{"_index":202,"title":{},"contents":{"animate-ease-vars.html":{"position":[[3677,9],[3799,9]]}}}],["treat",{"_index":693,"title":{},"contents":{"color-contrast.html":{"position":[[699,7],[2058,7],[3631,7],[5231,7]]},"type-fonts.html":{"position":[[2363,7]]},"utils.html":{"position":[[2771,6],[3805,6]]}}}],["tri",{"_index":1201,"title":{},"contents":{"token-vars.html":{"position":[[2600,3]]}}}],["trigger",{"_index":847,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[917,9]]},"token-config.html":{"position":[[116,7]]}}}],["trim",{"_index":622,"title":{},"contents":{"CHANGELOG.html":{"position":[[9827,4],[9882,4],[11317,4],[12447,6]]},"utils.html":{"position":[[5453,6],[5460,5],[5570,7],[5673,5],[5682,7],[5746,4],[5815,7],[5840,7],[5931,7],[5955,8],[5996,8]]}}}],["trim($str",{"_index":648,"title":{},"contents":{"CHANGELOG.html":{"position":[[11263,13]]}}}],["true",{"_index":83,"title":{},"contents":{"animate-change-vars.html":{"position":[[1952,4],[2011,4],[2916,4],[2975,4]]},"animate-ease-vars.html":{"position":[[2063,4],[2122,4],[3043,4],[3102,4]]},"animate-time-vars.html":{"position":[[1842,4],[1901,4],[2767,4],[2826,4]]},"color-config.html":{"position":[[285,4]]},"color-vars.html":{"position":[[1943,4],[2002,4],[2894,4],[2953,4]]},"CONTRIBUTING.html":{"position":[[589,4]]},"index.html":{"position":[[562,5]]},"layout-queries.html":{"position":[[1328,4]]},"ratio-tokens.html":{"position":[[2020,4]]},"ratio-vars.html":{"position":[[1673,4],[1732,4],[2614,4],[2673,4]]},"scale-vars.html":{"position":[[1864,4],[1923,4],[2785,4],[2844,4]]},"token-inspect.html":{"position":[[435,4],[609,4],[1124,4],[1686,6],[2409,4],[2870,4],[2921,4],[2955,4]]},"token-vars.html":{"position":[[501,4],[560,4],[2531,4],[2590,4]]},"type-font-vars.html":{"position":[[2028,4],[2087,4],[3148,4],[3207,4]]},"utils.html":{"position":[[2645,5]]}}}],["truth",{"_index":898,"title":{},"contents":{"index.html":{"position":[[2131,6]]}}}],["ttf",{"_index":1293,"title":{},"contents":{"type-fonts.html":{"position":[[4398,7]]},"type.html":{"position":[[653,6]]}}}],["turn",{"_index":625,"title":{},"contents":{"CHANGELOG.html":{"position":[[10168,4]]},"layout-queries.html":{"position":[[1013,4]]},"ratio-tokens.html":{"position":[[2043,4]]},"token-api.html":{"position":[[4110,4]]}}}],["two",{"_index":707,"title":{},"contents":{"color-contrast.html":{"position":[[6162,3],[6892,3]]},"color-tokens.html":{"position":[[341,5]]},"token-internal.html":{"position":[[595,3],[1782,3],[2356,3],[2905,3],[3295,3]]},"type-pseudo.html":{"position":[[434,3]]}}}],["type",{"_index":14,"title":{"type-helpers.html":{"position":[[0,4]]},"type.html":{"position":[[12,4]]}},"contents":{"animate-change-vars.html":{"position":[[200,6]]},"animate-ease-vars.html":{"position":[[197,6]]},"animate-time-vars.html":{"position":[[192,6]]},"CHANGELOG.html":{"position":[[2182,4],[8899,4],[10888,4],[11427,4],[12314,4],[13119,5],[14083,5],[14471,4]]},"color-vars.html":{"position":[[196,6]]},"index.html":{"position":[[1072,5],[1250,4]]},"layout-z-index.html":{"position":[[570,4]]},"ratio-tokens.html":{"position":[[1728,4]]},"scale-vars.html":{"position":[[192,6]]},"token-api.html":{"position":[[391,6],[2371,6],[4061,5]]},"tokens.html":{"position":[[110,6]]},"type-font-vars.html":{"position":[[192,6]]},"type-fonts.html":{"position":[[438,6],[855,4],[1931,4],[7654,4],[9115,4],[10223,4]]},"type-helpers.html":{"position":[[135,4]]},"type.html":{"position":[[12,4],[336,4]]}}}],["typekit",{"_index":1251,"title":{},"contents":{"type-fonts.html":{"position":[[523,7]]}}}],["typo",{"_index":431,"title":{},"contents":{"CHANGELOG.html":{"position":[[2618,5],[9326,6]]},"CONTRIBUTING.html":{"position":[[1009,6]]}}}],["typograph",{"_index":379,"title":{},"contents":{"CHANGELOG.html":{"position":[[701,11]]},"index.html":{"position":[[1216,11]]}}}],["typographi",{"_index":885,"title":{},"contents":{"index.html":{"position":[[1353,10]]},"type.html":{"position":[[22,10]]}}}],["u+0000",{"_index":1297,"title":{},"contents":{"type-fonts.html":{"position":[[4548,7]]}}}],["u+0131",{"_index":1299,"title":{},"contents":{"type-fonts.html":{"position":[[4562,7]]}}}],["u+0152",{"_index":1300,"title":{},"contents":{"type-fonts.html":{"position":[[4570,6]]}}}],["u+02c6",{"_index":1302,"title":{},"contents":{"type-fonts.html":{"position":[[4583,8]]}}}],["un",{"_index":672,"title":{},"contents":{"CHANGELOG.html":{"position":[[13101,2]]},"layout-queries.html":{"position":[[5633,2]]}}}],["unchang",{"_index":89,"title":{},"contents":{"animate-change-vars.html":{"position":[[2210,9],[3174,9]]},"animate-ease-vars.html":{"position":[[2321,9],[3301,9]]},"animate-time-vars.html":{"position":[[2100,9],[3025,9]]},"color-vars.html":{"position":[[2201,9],[3152,9]]},"ratio-vars.html":{"position":[[1931,9],[2872,9]]},"scale-vars.html":{"position":[[2122,9],[3043,9]]},"token-vars.html":{"position":[[759,9],[2796,9]]},"type-font-vars.html":{"position":[[2286,9],[3406,9]]}}}],["under",{"_index":681,"title":{},"contents":{"CHANGELOG.html":{"position":[[13983,5]]},"token-register.html":{"position":[[505,5],[1147,5]]}}}],["understand",{"_index":1212,"title":{},"contents":{"tokens.html":{"position":[[641,11]]}}}],["understood",{"_index":864,"title":{},"contents":{"index.html":{"position":[[242,10]]}}}],["unfound",{"_index":1355,"title":{},"contents":{"utils.html":{"position":[[4719,7]]}}}],["unicod",{"_index":1265,"title":{},"contents":{"type-fonts.html":{"position":[[2428,7],[2981,7],[3005,7],[4531,8]]}}}],["unit",{"_index":464,"title":{"scale-units.html":{"position":[[0,4]]}},"contents":{"CHANGELOG.html":{"position":[[3575,4],[10453,7],[10526,7],[10584,4],[10740,4],[11926,7],[12076,7],[12134,4],[12278,4]]},"CONTRIBUTING.html":{"position":[[570,4]]},"index.html":{"position":[[1968,7]]},"layout-queries.html":{"position":[[598,7],[2102,5],[3193,5],[4304,5]]},"scale-sizes.html":{"position":[[330,4],[1197,7],[1351,7],[2128,6],[2171,7],[2310,7],[2368,4],[2512,4],[2697,4],[2786,4],[2992,6],[3135,7],[3218,6],[3261,7],[3400,7],[3458,4],[3602,4],[3847,5],[4072,4],[4161,4],[4376,6],[4512,4],[4560,7],[4699,7],[4757,4],[4901,4],[5146,5],[5371,4],[5460,4],[5700,6]]},"scale-units.html":{"position":[[11,5],[35,7],[78,6],[227,6],[243,6],[429,5],[456,5],[482,5],[603,6],[688,6],[882,6],[1078,5]]},"scale.html":{"position":[[185,5],[734,7],[1020,5]]},"token-api.html":{"position":[[1804,7],[2030,7],[2107,5],[2513,7],[3444,7]]}}}],["units(16px",{"_index":1134,"title":{},"contents":{"token-api.html":{"position":[[1709,11]]}}}],["units(times(16px",{"_index":1135,"title":{},"contents":{"token-api.html":{"position":[[1923,17]]}}}],["unknown",{"_index":1256,"title":{},"contents":{"type-fonts.html":{"position":[[1363,7]]}}}],["unless",{"_index":1254,"title":{},"contents":{"type-fonts.html":{"position":[[947,6]]},"utils.html":{"position":[[441,6],[1586,6],[2207,6],[3394,6],[4312,6],[5578,6]]}}}],["unlik",{"_index":1208,"title":{},"contents":{"tokens.html":{"position":[[564,6]]}}}],["unreleas",{"_index":347,"title":{},"contents":{"CHANGELOG.html":{"position":[[31,10]]}}}],["unresolv",{"_index":454,"title":{},"contents":{"CHANGELOG.html":{"position":[[3295,10]]}}}],["unset",{"_index":435,"title":{},"contents":{"CHANGELOG.html":{"position":[[2752,5],[3265,5]]}}}],["up",{"_index":414,"title":{},"contents":{"CHANGELOG.html":{"position":[[2313,2],[3955,2],[4426,2]]},"CONTRIBUTING.html":{"position":[[455,2],[1176,2]]},"layout-queries.html":{"position":[[5588,3]]},"scale.html":{"position":[[1168,2]]}}}],["updat",{"_index":178,"title":{},"contents":{"animate-change.html":{"position":[[2219,7]]},"animate-ease.html":{"position":[[3776,7]]},"animate-times.html":{"position":[[1722,7]]},"CHANGELOG.html":{"position":[[82,7]]},"color-tokens.html":{"position":[[2058,7]]},"CONTRIBUTING.html":{"position":[[547,6],[704,6]]},"ratio-tokens.html":{"position":[[1507,7]]},"scale-sizes.html":{"position":[[1819,7]]},"type-fonts.html":{"position":[[6176,7]]}}}],["upgrad",{"_index":426,"title":{},"contents":{"CHANGELOG.html":{"position":[[2572,7],[3693,7],[4581,7],[4717,7]]}}}],["uri",{"_index":1290,"title":{},"contents":{"type-fonts.html":{"position":[[4212,4],[5291,4]]}}}],["uri’",{"_index":1308,"title":{},"contents":{"type-fonts.html":{"position":[[5259,5]]},"type-helpers.html":{"position":[[176,6]]}}}],["url",{"_index":1255,"title":{},"contents":{"type-fonts.html":{"position":[[1037,5],[2305,4],[4107,5]]},"type-helpers.html":{"position":[[15,5],[51,5]]}}}],["url(\"../fonts/sans/mi",{"_index":1326,"title":{},"contents":{"type-helpers.html":{"position":[[488,21]]}}}],["url('my/path",{"_index":1323,"title":{},"contents":{"type-helpers.html":{"position":[[342,14]]}}}],["url('sans/mi",{"_index":1324,"title":{},"contents":{"type-helpers.html":{"position":[[426,12]]}}}],["us",{"_index":12,"title":{},"contents":{"animate-change-vars.html":{"position":[[164,6],[704,4],[834,5],[1186,3],[1812,3],[2271,3],[3239,3]]},"animate-change.html":{"position":[[488,3],[753,5],[1238,4],[1715,3],[1820,4]]},"animate-ease-vars.html":{"position":[[161,6],[737,4],[861,5],[1218,3],[1925,3],[2380,3],[3372,3]]},"animate-ease.html":{"position":[[95,4],[251,4],[1812,4],[1936,5],[2811,4],[3285,3]]},"animate-time-vars.html":{"position":[[156,6],[676,4],[796,5],[1140,3],[1704,3],[2157,3],[3088,3]]},"animate-times.html":{"position":[[836,4],[1284,3]]},"animate.html":{"position":[[294,4],[875,3],[1306,3]]},"CHANGELOG.html":{"position":[[436,5],[2174,4],[2533,5],[2887,3],[3043,4],[3156,5],[3221,5],[3370,5],[3463,5],[3638,4],[3731,3],[4279,4],[5524,6],[6585,5],[6725,6],[8267,4],[8990,4],[12768,3],[12985,4],[13091,4],[13501,5],[13725,5]]},"color-config.html":{"position":[[202,6],[404,3],[431,4],[573,3],[600,4]]},"color-contrast.html":{"position":[[1437,4],[2953,4],[6173,5],[7275,4],[7624,4]]},"color-themes.html":{"position":[[363,3],[1485,6],[2191,4],[2337,6]]},"color-tokens.html":{"position":[[878,3],[1038,4],[1477,4],[1834,6],[3648,4]]},"color-utils.html":{"position":[[164,5],[236,3],[319,3],[995,5],[1067,3],[1139,3]]},"color-vars.html":{"position":[[160,6],[692,4],[842,5],[1190,3],[1804,3],[2260,3],[3216,3],[3678,4]]},"color.html":{"position":[[385,4],[451,5],[761,5],[1057,5],[1102,5],[1811,4]]},"CONTRIBUTING.html":{"position":[[583,5],[739,5],[1081,3]]},"index.html":{"position":[[698,3],[770,4],[801,4],[898,4],[950,5],[974,3],[1015,5],[1027,4],[1687,5],[2423,3],[2561,3]]},"layout-queries.html":{"position":[[106,5],[140,3],[359,4],[527,5],[1294,3],[1665,4],[1996,5],[2302,3],[3087,5],[3393,3],[4198,5],[4504,3],[4627,3],[5354,5]]},"layout-z-index.html":{"position":[[430,4],[843,4]]},"layout.html":{"position":[[285,4],[385,3]]},"LICENSE.html":{"position":[[277,4],[1024,3]]},"ratio-tokens.html":{"position":[[64,5],[350,4],[860,3],[1161,4],[1283,6],[1940,3],[2507,4]]},"ratio-vars.html":{"position":[[466,4],[591,5],[939,3],[1534,3],[1990,3],[2936,3]]},"ratios.html":{"position":[[51,4],[243,4],[848,4]]},"scale-sizes.html":{"position":[[149,4],[308,4],[472,5],[753,5],[847,5],[1040,4],[1288,4],[1595,6],[2107,5],[2909,3],[3054,4],[4284,3],[5583,3]]},"scale-units.html":{"position":[[182,6]]},"scale-vars.html":{"position":[[156,6],[678,4],[798,5],[1142,3],[1726,3],[2179,3],[3106,3]]},"scale.html":{"position":[[340,4],[651,5],[976,5],[1287,6],[1392,3],[1691,3]]},"token-api.html":{"position":[[14,3],[651,3],[1032,5],[1570,4],[2929,3],[3527,3],[3699,5],[3758,5],[4091,3],[4395,5],[4644,3],[6152,4]]},"token-config.html":{"position":[[589,4]]},"token-inspect.html":{"position":[[73,6],[630,4],[1874,4],[2259,6],[2362,5],[3044,4]]},"token-internal.html":{"position":[[2091,3],[2651,3],[3246,3]]},"token-register.html":{"position":[[356,3],[558,3],[765,4],[1025,3]]},"token-vars.html":{"position":[[64,6],[356,3],[815,4],[1283,4],[2454,3],[2852,4],[3349,4]]},"tokens.html":{"position":[[64,5],[750,3],[2054,5],[2148,5],[2338,5],[2521,5],[2795,3],[2828,5],[3669,3],[3968,5]]},"type-a11y.html":{"position":[[154,5],[266,4]]},"type-font-vars.html":{"position":[[156,6],[747,4],[867,5],[1211,3],[1261,5],[1337,3],[1890,3],[2296,5],[2372,3],[2449,3],[3476,3],[3490,5],[3566,3]]},"type-fonts.html":{"position":[[39,6],[1014,4],[1581,5],[2111,3],[2852,3],[3423,3],[3975,3],[5615,4],[5762,3],[5847,6],[6519,5],[6894,4],[7280,3],[7396,4],[7878,3],[8257,4],[8588,3],[9322,3],[9803,4],[10031,4],[10373,3]]},"type-helpers.html":{"position":[[560,4]]},"type-pseudo.html":{"position":[[451,4],[506,4]]},"type.html":{"position":[[360,4],[908,6],[1197,5]]},"utils.html":{"position":[[18,3],[1098,4],[1798,4],[2811,3],[3129,4],[3845,3],[4193,5],[5260,4],[6105,4]]},"vars.html":{"position":[[42,6],[468,4],[765,4],[1119,4],[1367,4],[1418,3],[1515,4],[1542,4],[1560,4]]}}}],["usag",{"_index":506,"title":{},"contents":{"CHANGELOG.html":{"position":[[4670,5]]}}}],["user",{"_index":543,"title":{},"contents":{"CHANGELOG.html":{"position":[[5717,4]]},"color-themes.html":{"position":[[110,4],[345,4],[509,5]]},"color-tokens.html":{"position":[[2841,4]]},"ratio-tokens.html":{"position":[[463,4]]}}}],["util",{"_index":374,"title":{},"contents":{"CHANGELOG.html":{"position":[[530,11],[751,10],[11277,7],[11388,7],[13212,9]]},"color-utils.html":{"position":[[6,7]]},"index.html":{"position":[[121,9],[1486,9]]},"layout-queries.html":{"position":[[5253,5]]},"token-api.html":{"position":[[341,9]]},"token-internal.html":{"position":[[231,9]]},"tokens.html":{"position":[[3523,7]]},"type-a11y.html":{"position":[[30,9]]},"utils.html":{"position":[[5,9],[39,9],[208,7],[1221,7],[1938,7]]}}}],["valid",{"_index":523,"title":{},"contents":{"CHANGELOG.html":{"position":[[5159,5]]},"color-contrast.html":{"position":[[7192,5]]},"layout-queries.html":{"position":[[311,5],[1545,5]]},"ratio-tokens.html":{"position":[[1660,6],[2186,5]]}}}],["valu",{"_index":59,"title":{},"contents":{"animate-change-vars.html":{"position":[[1052,6],[1843,7],[1881,5],[1983,5],[2060,5],[2100,5],[2162,5],[2765,5],[2947,5],[3024,5],[3064,5],[3126,5]]},"animate-change.html":{"position":[[81,6],[478,6],[1135,6],[1159,7],[1638,5],[1769,5]]},"animate-ease-vars.html":{"position":[[1002,6],[1085,6],[1956,7],[1994,5],[2094,5],[2171,5],[2211,5],[2273,5],[2894,5],[3074,5],[3151,5],[3191,5],[3253,5]]},"animate-ease.html":{"position":[[302,6],[360,10],[2105,6],[2485,6],[2729,6],[3209,5]]},"animate-time-vars.html":{"position":[[1008,6],[1735,7],[1773,5],[1873,5],[1950,5],[1990,5],[2052,5],[2620,5],[2798,5],[2875,5],[2915,5],[2977,5]]},"animate-times.html":{"position":[[369,6],[426,7],[448,6],[527,6],[664,6],[1211,5]]},"CHANGELOG.html":{"position":[[1692,5],[2285,6],[2680,5],[4222,5],[4845,6],[5091,6],[5145,6],[6572,8],[6603,9],[6844,5],[10492,6],[12042,6]]},"color-contrast.html":{"position":[[248,6],[376,5],[684,6],[1587,7],[1735,5],[2043,6],[3171,6],[3286,5],[3616,6],[4695,6],[4886,5],[5216,6],[6444,6],[6559,6],[7444,5],[7519,6]]},"color-themes.html":{"position":[[705,6],[1641,5]]},"color-tokens.html":{"position":[[262,6],[326,7],[353,6],[433,6],[581,6],[3178,5]]},"color-utils.html":{"position":[[189,5],[748,5],[1021,5],[1564,5]]},"color-vars.html":{"position":[[1057,6],[1835,7],[1873,5],[1974,5],[2051,5],[2091,5],[2153,5],[2745,5],[2925,5],[3002,5],[3042,5],[3104,5]]},"color.html":{"position":[[1827,7]]},"index.html":{"position":[[2369,6]]},"layout-queries.html":{"position":[[328,7],[1105,5],[1209,5],[1494,5],[1908,5],[1968,6],[2998,6],[3059,6],[4110,5],[4170,6],[5519,5],[5581,6],[5626,6]]},"layout-z-index.html":{"position":[[243,6],[633,6],[757,5],[917,5],[1114,5]]},"layout.html":{"position":[[73,6]]},"ratio-tokens.html":{"position":[[686,5],[785,5],[954,5],[1854,5],[2115,5],[2171,5]]},"ratio-vars.html":{"position":[[806,6],[1565,7],[1603,5],[1704,5],[1781,5],[1821,5],[1883,5],[2465,5],[2645,5],[2722,5],[2762,5],[2824,5]]},"ratios.html":{"position":[[113,6],[276,6],[334,10]]},"scale-sizes.html":{"position":[[235,8],[281,5],[379,6],[587,6],[2276,6],[2774,6],[3183,5],[3366,6],[4149,6],[4517,6],[4665,6],[5448,6]]},"scale-units.html":{"position":[[935,5],[1063,5]]},"scale-vars.html":{"position":[[1010,6],[1757,7],[1795,5],[1895,5],[1972,5],[2012,5],[2074,5],[2638,5],[2816,5],[2893,5],[2933,5],[2995,5]]},"scale.html":{"position":[[519,6],[1154,6],[1431,7],[1469,5],[1540,5],[1784,6]]},"token-api.html":{"position":[[54,6],[601,7],[1501,5],[1586,8],[1762,9],[1988,9],[2187,5],[2338,5],[2684,6],[2905,6],[3024,6],[3105,9],[3242,6],[3282,6],[3391,9],[3952,7],[4236,5],[4291,5],[4748,5],[4777,5],[4863,7],[4881,7],[4900,6],[4948,6],[4978,8],[5011,6],[5549,6],[5864,5],[5949,7],[5984,6],[6029,6],[6091,6]]},"token-inspect.html":{"position":[[1971,8]]},"token-internal.html":{"position":[[599,6],[1185,5],[1786,6],[2360,6],[2909,6]]},"token-vars.html":{"position":[[422,7],[464,5],[532,5],[609,5],[649,5],[711,5],[1586,6],[2326,5],[2562,5],[2646,5],[2686,5],[2748,5]]},"tokens.html":{"position":[[383,6],[657,6],[724,6],[1563,5],[2213,7]]},"type-font-vars.html":{"position":[[1079,6],[1300,5],[1360,6],[1638,8],[1921,7],[1959,5],[2059,5],[2136,5],[2176,5],[2238,5],[2335,5],[2395,6],[2858,8],[3001,5],[3179,5],[3256,5],[3296,5],[3358,5],[3529,5],[3589,6],[3967,8]]},"type-fonts.html":{"position":[[2349,5],[3438,5],[3697,6],[4000,7],[7462,8]]},"type-pseudo.html":{"position":[[172,5],[292,5],[438,6]]},"utils.html":{"position":[[2375,7],[2851,7],[3269,6],[3598,11],[3756,6],[3885,7],[5884,5]]},"vars.html":{"position":[[63,6],[943,6],[997,10],[1272,6],[1347,7],[1776,6]]}}}],["value/adjust",{"_index":570,"title":{},"contents":{"CHANGELOG.html":{"position":[[6539,17],[12851,16]]}}}],["var",{"_index":4,"title":{},"contents":{"animate-change-vars.html":{"position":[[32,3],[65,3],[587,3],[759,3],[859,3],[1046,5],[1529,4],[1577,3],[1995,5],[2552,4],[2599,4],[2645,3],[2675,3],[2959,5],[3304,4],[3584,4],[3623,4],[3671,3],[3691,3]]},"animate-ease-vars.html":{"position":[[31,3],[64,3],[592,3],[789,3],[886,3],[1079,5],[1607,4],[1694,3],[2106,5],[2715,4],[2776,3],[2806,3],[3086,5],[3437,4],[3687,3],[3751,4],[3809,3],[3849,3],[3883,3]]},"animate-ease.html":{"position":[[1881,3]]},"animate-time-vars.html":{"position":[[28,3],[59,3],[567,3],[727,3],[819,3],[1002,5],[1435,4],[1477,3],[1885,5],[2415,4],[2461,4],[2502,3],[2532,3],[2810,5],[3153,4],[3416,4],[3447,4],[3493,3],[3511,3]]},"CHANGELOG.html":{"position":[[5005,3],[5025,3],[5614,3],[5633,3],[7226,3],[8024,3],[8101,3],[8184,3],[8542,3],[8803,3],[8879,3],[9284,3]]},"color-contrast.html":{"position":[[1475,3],[2200,6],[2780,4],[2933,3],[2968,3],[4490,3],[4646,3],[5739,4],[6005,4],[6043,4],[6090,3],[6112,3]]},"color-vars.html":{"position":[[30,3],[62,3],[578,3],[710,3],[770,3],[866,3],[1051,5],[1527,4],[1573,3],[1986,5],[2537,4],[2582,4],[2626,3],[2656,3],[2937,5],[3281,4],[3555,4],[3592,4],[3639,3],[3658,3],[3693,3]]},"ratio-vars.html":{"position":[[36,3],[68,3],[361,3],[519,3],[615,3],[800,5],[1301,3],[1716,5],[2281,4],[2346,3],[2376,3],[2657,5],[3001,4],[3284,4],[3341,4],[3399,3],[3432,3]]},"ratios.html":{"position":[[919,3]]},"scale-vars.html":{"position":[[28,3],[59,3],[568,3],[729,3],[821,3],[1004,5],[1456,4],[1499,3],[1907,5],[2435,4],[2477,4],[2520,3],[2550,3],[2828,5],[3171,4],[3428,4],[3461,4],[3509,3],[3527,3]]},"token-inspect.html":{"position":[[648,3]]},"token-vars.html":{"position":[[544,5],[1128,4],[1161,4],[1245,3],[1580,5],[2142,4],[2237,3],[2574,5],[2935,4],[3243,4],[3274,4],[3367,3],[3390,3],[3411,3],[3432,3],[3454,3],[3476,3],[3514,3]]},"tokens.html":{"position":[[3432,4],[3468,4],[3499,4]]},"type-font-vars.html":{"position":[[28,3],[59,3],[605,3],[798,3],[890,3],[1073,5],[1663,3],[2071,5],[2802,4],[2883,3],[2913,3],[3191,5],[3647,4],[3911,4],[3996,3],[4014,3]]},"vars.html":{"position":[[1137,3],[1179,3]]}}}],["vararg",{"_index":1080,"title":{},"contents":{"scale-sizes.html":{"position":[[2179,6],[3269,6],[4568,6]]}}}],["variabl",{"_index":3,"title":{"animate-change-vars.html":{"position":[[14,9]]},"animate-ease-vars.html":{"position":[[13,9]]},"animate-time-vars.html":{"position":[[12,9]]},"color-vars.html":{"position":[[19,9]]},"ratio-vars.html":{"position":[[19,9]]},"scale-vars.html":{"position":[[12,9]]},"type-font-vars.html":{"position":[[12,9]]}},"contents":{"animate-change-vars.html":{"position":[[14,9],[107,9],[191,8],[303,8],[404,9],[823,10],[958,9],[1228,9],[1834,8],[1895,9],[2118,8],[2703,8],[3082,8],[3274,8]]},"animate-change.html":{"position":[[262,8],[1940,9],[2243,9]]},"animate-ease-vars.html":{"position":[[13,9],[104,9],[188,8],[300,8],[401,9],[850,10],[985,9],[1266,9],[1947,8],[2008,9],[2229,8],[2832,8],[3209,8],[3407,8]]},"animate-ease.html":{"position":[[110,9],[228,9],[2285,8],[3514,9],[3799,9]]},"animate-time-vars.html":{"position":[[12,9],[99,9],[183,8],[295,8],[394,9],[785,10],[916,9],[1180,9],[1726,8],[1787,9],[2008,8],[2558,8],[2933,8],[3123,8]]},"animate-times.html":{"position":[[171,8],[1461,9],[1744,9]]},"CHANGELOG.html":{"position":[[610,11],[639,9],[857,10],[2078,10],[5662,8],[6083,11],[7188,9],[7394,11],[7542,8],[7939,8],[7983,9],[8061,9],[8140,9],[8500,9],[8763,9],[8837,9],[9244,9],[10461,8],[11934,8]]},"color-contrast.html":{"position":[[1552,9],[1655,10],[2211,8],[2307,8],[2356,8],[2579,8],[4543,9],[4801,10]]},"color-tokens.html":{"position":[[60,8],[1665,9],[2081,9]]},"color-vars.html":{"position":[[13,9],[103,9],[187,8],[299,8],[399,9],[831,10],[964,9],[1231,9],[1826,8],[1887,9],[2109,8],[2683,8],[3060,8],[3251,8]]},"color.html":{"position":[[1048,8],[1648,9]]},"index.html":{"position":[[1408,9],[1449,9],[2670,9],[2712,9]]},"layout-queries.html":{"position":[[5551,8]]},"layout-z-index.html":{"position":[[537,9],[602,9]]},"ratio-tokens.html":{"position":[[1261,9],[1530,9]]},"ratio-vars.html":{"position":[[19,9],[181,9],[580,10],[713,9],[980,9],[1556,8],[1617,9],[1839,8],[2403,8],[2780,8],[2971,8]]},"ratios.html":{"position":[[197,9]]},"scale-sizes.html":{"position":[[1428,9],[1841,9]]},"scale-vars.html":{"position":[[12,9],[99,9],[183,8],[295,8],[394,9],[787,10],[918,9],[1182,9],[1748,8],[1809,9],[2030,8],[2576,8],[2951,8],[3141,8]]},"token-vars.html":{"position":[[667,8],[837,9],[1395,11],[1493,9],[1738,9],[1811,9],[2264,8],[2704,8],[2874,9],[2905,8]]},"tokens.html":{"position":[[413,9],[860,9],[909,9],[2700,9],[2714,9],[2782,9],[2972,9],[3004,9],[3178,9],[3260,9]]},"type-font-vars.html":{"position":[[12,9],[99,9],[183,8],[295,8],[394,9],[856,10],[987,9],[1251,9],[1912,8],[1973,9],[2194,8],[2939,8],[3314,8],[3617,8]]},"type-fonts.html":{"position":[[1978,9],[5733,9],[6198,9]]},"vars.html":{"position":[[26,9],[133,9],[198,9],[286,9],[408,8],[775,8],[1253,8],[1438,9],[1486,9]]}}}],["variables('_mi",{"_index":1372,"title":{},"contents":{"vars.html":{"position":[[1603,14]]}}}],["variables('nam",{"_index":212,"title":{},"contents":{"animate-ease.html":{"position":[[324,18]]},"ratios.html":{"position":[[298,18]]}}}],["variant",{"_index":683,"title":{},"contents":{"CHANGELOG.html":{"position":[[14164,8]]},"type-fonts.html":{"position":[[2102,8],[2200,8],[2220,7],[3300,7],[3330,8],[3654,8],[3902,7],[8931,9],[9420,9],[9756,10],[9971,8]]},"utils.html":{"position":[[5287,10],[5351,7]]}}}],["variat",{"_index":720,"title":{},"contents":{"color-themes.html":{"position":[[85,10],[448,10]]}}}],["variou",{"_index":556,"title":{},"contents":{"CHANGELOG.html":{"position":[[6203,7]]},"tokens.html":{"position":[[102,7]]},"type-fonts.html":{"position":[[222,7],[425,7],[6632,7]]}}}],["version",{"_index":361,"title":{},"contents":{"CHANGELOG.html":{"position":[[257,8]]},"scale-sizes.html":{"position":[[693,8]]}}}],["vh",{"_index":1087,"title":{},"contents":{"scale-units.html":{"position":[[497,3]]}}}],["via",{"_index":830,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[235,3],[1215,3]]}}}],["view",{"_index":539,"title":{},"contents":{"CHANGELOG.html":{"position":[[5535,7]]},"color-themes.html":{"position":[[1496,7],[2348,7]]},"index.html":{"position":[[0,4],[13,4]]}}}],["viewport",{"_index":930,"title":{},"contents":{"layout-queries.html":{"position":[[1809,8],[2905,8],[4010,8]]},"scale.html":{"position":[[891,9]]}}}],["violet",{"_index":751,"title":{},"contents":{"color-themes.html":{"position":[[1822,7],[2119,6],[2610,6],[2912,6]]}}}],["visibl",{"_index":1229,"title":{},"contents":{"type-a11y.html":{"position":[[58,10]]}}}],["vmax",{"_index":1089,"title":{},"contents":{"scale-units.html":{"position":[[507,5]]}}}],["vmin",{"_index":1088,"title":{},"contents":{"scale-units.html":{"position":[[501,5]]}}}],["vw",{"_index":1086,"title":{},"contents":{"scale-units.html":{"position":[[493,3]]}}}],["want",{"_index":21,"title":{},"contents":{"animate-change-vars.html":{"position":[[264,6]]},"animate-change.html":{"position":[[1962,4]]},"animate-ease-vars.html":{"position":[[261,6]]},"animate-ease.html":{"position":[[57,4],[3536,4]]},"animate-time-vars.html":{"position":[[256,6]]},"animate-times.html":{"position":[[1483,4]]},"color-tokens.html":{"position":[[1687,4]]},"color-vars.html":{"position":[[260,6]]},"scale-sizes.html":{"position":[[1450,4]]},"scale-vars.html":{"position":[[256,6]]},"token-api.html":{"position":[[1481,4]]},"tokens.html":{"position":[[1965,4]]},"type-font-vars.html":{"position":[[256,6]]},"type-fonts.html":{"position":[[4659,5]]},"utils.html":{"position":[[1391,4]]}}}],["warn",{"_index":463,"title":{},"contents":{"CHANGELOG.html":{"position":[[3513,5],[4115,5],[4168,7]]},"token-config.html":{"position":[[124,8],[261,5],[285,7]]}}}],["warranti",{"_index":1002,"title":{},"contents":{"LICENSE.html":{"position":[[644,8],[719,10]]}}}],["way",{"_index":910,"title":{},"contents":{"index.html":{"position":[[2633,3]]},"tokens.html":{"position":[[823,3],[886,4]]},"type-fonts.html":{"position":[[6640,5]]},"vars.html":{"position":[[49,3]]}}}],["wcag",{"_index":525,"title":{},"contents":{"CHANGELOG.html":{"position":[[5190,4]]},"color-contrast.html":{"position":[[6183,4],[6743,4],[6861,4],[7115,4],[7349,4],[7488,4],[7534,4]]},"color.html":{"position":[[176,4],[1507,4],[1551,4]]}}}],["web",{"_index":448,"title":{},"contents":{"CHANGELOG.html":{"position":[[3091,3]]},"type-fonts.html":{"position":[[3126,3]]}}}],["webfont",{"_index":608,"title":{},"contents":{"CHANGELOG.html":{"position":[[9079,10],[9186,10],[12336,10]]},"index.html":{"position":[[1270,9]]},"token-inspect.html":{"position":[[720,10],[1913,10]]},"type-fonts.html":{"position":[[0,8],[9,7],[2774,8],[6525,8],[6562,7],[8886,7],[9566,9],[9613,9],[9656,9],[9825,10],[9850,10],[10594,9],[10641,9],[10684,9],[10864,9]]},"type.html":{"position":[[37,7],[124,7],[401,7],[695,9],[735,9],[943,8],[1013,8],[1034,11],[1156,9]]}}}],["weight",{"_index":367,"title":{},"contents":{"CHANGELOG.html":{"position":[[366,6],[14192,6]]}}}],["weight/styl",{"_index":1261,"title":{},"contents":{"type-fonts.html":{"position":[[1778,12]]}}}],["welcom",{"_index":822,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[66,8],[181,7]]}}}],["well",{"_index":383,"title":{},"contents":{"CHANGELOG.html":{"position":[[814,4],[5101,4]]},"color-config.html":{"position":[[105,4]]},"color-tokens.html":{"position":[[2733,5]]},"color.html":{"position":[[1890,4]]}}}],["we’ll",{"_index":27,"title":{},"contents":{"animate-change-vars.html":{"position":[[361,5]]},"animate-ease-vars.html":{"position":[[358,5]]},"animate-ease.html":{"position":[[2060,5]]},"animate-time-vars.html":{"position":[[351,5]]},"color-vars.html":{"position":[[356,5]]},"color.html":{"position":[[1521,5]]},"ratio-vars.html":{"position":[[138,5]]},"scale-vars.html":{"position":[[351,5]]},"token-api.html":{"position":[[1475,5]]},"type-font-vars.html":{"position":[[351,5]]},"type-fonts.html":{"position":[[3561,5]]}}}],["we’r",{"_index":1137,"title":{},"contents":{"token-api.html":{"position":[[2643,5]]}}}],["we’v",{"_index":554,"title":{},"contents":{"CHANGELOG.html":{"position":[[6157,5]]}}}],["whenev",{"_index":1083,"title":{},"contents":{"scale-sizes.html":{"position":[[4036,8],[5335,8]]}}}],["whether",{"_index":286,"title":{},"contents":{"animate-ease.html":{"position":[[1920,7]]},"LICENSE.html":{"position":[[908,7]]}}}],["whichev",{"_index":694,"title":{},"contents":{"color-contrast.html":{"position":[[840,9],[5451,9]]}}}],["white",{"_index":649,"title":{},"contents":{"CHANGELOG.html":{"position":[[11322,5]]},"color-config.html":{"position":[[161,5],[290,5],[352,5]]},"color-contrast.html":{"position":[[1137,5],[1175,6],[1339,6],[2512,5],[2550,6],[2735,6],[4128,5],[4190,6],[4358,6],[5690,5],[5777,6],[5949,6],[6930,6],[7068,6]]},"color-tokens.html":{"position":[[985,5]]},"color-utils.html":{"position":[[86,6],[284,6]]},"color.html":{"position":[[1658,6],[2068,6],[2122,6]]}}}],["whitespac",{"_index":659,"title":{},"contents":{"CHANGELOG.html":{"position":[[12475,10]]},"utils.html":{"position":[[5466,10],[5715,10]]}}}],["widescreen",{"_index":1067,"title":{},"contents":{"ratios.html":{"position":[[768,12]]}}}],["widget",{"_index":765,"title":{},"contents":{"color-tokens.html":{"position":[[557,6]]}}}],["width",{"_index":931,"title":{},"contents":{"layout-queries.html":{"position":[[1818,6],[2327,7],[2335,8],[2369,6],[2430,6],[2540,6],[2709,6],[2914,6],[3418,7],[3426,8],[3460,6],[3521,6],[3633,6],[3807,6],[4019,7],[4665,7],[4673,8],[4707,6],[4768,6],[4889,6],[4911,6],[5115,6],[5137,6]]},"layout.html":{"position":[[737,5]]},"scale-sizes.html":{"position":[[4473,5],[5656,5]]},"scale.html":{"position":[[1068,6]]}}}],["width/height",{"_index":942,"title":{},"contents":{"layout-queries.html":{"position":[[2846,14],[3953,14]]}}}],["within",{"_index":1348,"title":{},"contents":{"utils.html":{"position":[[2414,6]]}}}],["without",{"_index":411,"title":{},"contents":{"CHANGELOG.html":{"position":[[2089,8],[5806,7]]},"color-contrast.html":{"position":[[264,7]]},"color-tokens.html":{"position":[[849,7]]},"color.html":{"position":[[1763,7]]},"LICENSE.html":{"position":[[213,7],[244,7],[636,7]]},"ratios.html":{"position":[[207,8]]},"scale.html":{"position":[[1373,7]]},"token-api.html":{"position":[[3547,7],[3691,7],[5579,7],[5689,7]]},"type-fonts.html":{"position":[[8941,7],[10722,7]]},"type-helpers.html":{"position":[[183,7]]}}}],["woff",{"_index":1292,"title":{},"contents":{"type-fonts.html":{"position":[[4390,7],[9514,6],[10542,6]]},"type.html":{"position":[[646,6]]}}}],["woff2",{"_index":1272,"title":{},"contents":{"type-fonts.html":{"position":[[2834,7],[4380,9],[5007,8],[5032,5],[5124,8],[5155,5],[5424,8],[5543,8],[9506,7],[10534,7]]}}}],["woff2;charset=utf",{"_index":1310,"title":{},"contents":{"type-fonts.html":{"position":[[5456,17],[5575,17]]}}}],["word",{"_index":1277,"title":{},"contents":{"type-fonts.html":{"position":[[3325,4]]}}}],["work",{"_index":634,"title":{},"contents":{"CHANGELOG.html":{"position":[[10642,5],[12188,5]]},"color-config.html":{"position":[[263,4]]},"color-contrast.html":{"position":[[3104,5],[4624,5]]},"color.html":{"position":[[1129,4]]},"CONTRIBUTING.html":{"position":[[534,5]]},"scale-sizes.html":{"position":[[2422,5],[3512,5],[4811,5]]}}}],["world",{"_index":1358,"title":{},"contents":{"utils.html":{"position":[[5131,6],[5214,5],[5947,5],[6031,5]]}}}],["wrap",{"_index":1328,"title":{},"contents":{"type-pseudo.html":{"position":[[331,4]]}}}],["wrapper",{"_index":787,"title":{},"contents":{"color-tokens.html":{"position":[[2502,7]]},"type-helpers.html":{"position":[[31,7]]}}}],["write",{"_index":857,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[1233,5]]},"token-api.html":{"position":[[5177,5]]},"type-fonts.html":{"position":[[799,7]]}}}],["written",{"_index":661,"title":{},"contents":{"CHANGELOG.html":{"position":[[12611,7]]},"token-api.html":{"position":[[2347,7]]},"type-fonts.html":{"position":[[3346,7]]}}}],["wrong",{"_index":469,"title":{},"contents":{"CHANGELOG.html":{"position":[[3778,5]]}}}],["x",{"_index":789,"title":{},"contents":{"color-tokens.html":{"position":[[2531,4]]}}}],["yaml",{"_index":1209,"title":{},"contents":{"tokens.html":{"position":[[571,5]]}}}],["yarn",{"_index":841,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[522,4],[660,4],[795,4],[888,4],[941,4],[951,4],[961,4]]},"index.html":{"position":[[625,4],[668,4]]}}}],["yellow",{"_index":748,"title":{},"contents":{"color-themes.html":{"position":[[1793,7],[1970,6],[2581,7],[2763,6]]},"layout-queries.html":{"position":[[4852,7],[4948,7],[5078,7],[5174,7]]}}}],["you’r",{"_index":882,"title":{},"contents":{"index.html":{"position":[[943,6]]},"tokens.html":{"position":[[2047,6]]}}}],["you’v",{"_index":837,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[401,6],[976,6]]},"type-fonts.html":{"position":[[6539,6]]}}}],["z",{"_index":951,"title":{"layout-z-index.html":{"position":[[0,1]]}},"contents":{"layout-z-index.html":{"position":[[0,2],[21,2],[51,1],[144,1],[313,2],[448,1],[468,1],[528,2],[691,1],[749,1],[827,2],[858,1],[875,1],[896,1],[948,2],[1023,1],[1090,1],[1168,1]]},"layout.html":{"position":[[65,1]]}}}],["zero",{"_index":1342,"title":{},"contents":{"utils.html":{"position":[[743,4]]}}}]],"pipeline":["stemmer"]},"store":{"animate-change-vars.html":{"filename":"animate-change-vars.html","title":"Changes » CSS Variables","contents":"Changes » CSS Variables $change-var-prefix (string) scss $change-var-prefix: 'change-' !default; Since CSS variables are often defined in a global space, it can be useful to prefix different variable types. Accoutrement maps help solve that problem in Sass, so we wanted to carry that over into our CSS variable support. Set a prefix for all change-tokens, and we’ll apply it when setting or calling css variables based on your change maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$changes: ('my-change': pink); tools.$change-var-prefix: 'prefix_'; html { @include tools.change--('my-change') } css compiled html { --prefix_my-change: pink; } Used By @mixin changes--() @mixin change--() @function var-change() @mixin changes--() Convert any change-map into CSS variables, using the global $change-var-prefix. Change names that start with _ or - are considered “private” and will not be output as variables Changes that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $changes (map) Optionally use a custom map of changes to set as css variables {CSS output} (code block) Custom properties for all public changes in the map Example scss tools.$changes: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); html { @include tools.changes--; } css compiled html { --change-text: #206020; --change-border: var(--change-text, #206020); } Requires $change-var-prefix (string) @mixin change--() Set a single custom property based on a map-change, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $change: (*) Change name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $change $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $changes (map) Optional map of changes to use as a palette source Example scss tools.$changes: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); .example { @include tools.change--('border'); @include tools.change--('outline', 'border', red); } css compiled .example { --change-border: var(--change-text, #206020); --change-outline: var(--change-border, red); } Requires $change-var-prefix (string) @function var-change() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $change: (*) Change name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: (map) Optional Accoutrement map of changes to use as source @return (string) CSS variable call, in the format: var(--, ) Example scss tools.$changes: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); .example { border-change: tools.var-change('border'); change: tools.var-change('text', black); } css compiled .example { border-change: var(--change-border, #206020); change: var(--change-text, black); } Requires @function var-token() $change-var-prefix (string)"},"animate-change.html":{"filename":"animate-change.html","title":"Combined \"Change\" Maps","contents":"Combined “Change” Maps: Animations & Transitions Combine your $times and $easing values to create entire transitions and animations – all stored in one place and easy to access for consistent “changes” across your project. $changes scss $changes: () !default; A variable storing the map of all your standardized changes (transitions and animations). Any changes added to the $changes map will be accesible to the change() function by default. Define each change with a name and value, or use interpolation to compose more complex changes. $changes: ( // single animation 'glow': glow time('slow') ease('in-out-quad') infinite alternate, // single transitions 'slide': transform time('fast'), 'fade': opacity time('fade') ease('out-quad'), // interolate using '#name' (quotes optional) // to build on existing \"changes\" 'slide-in': #slide ease('out-back'), 'slide-out': '#slide' ease('in'), // or string together multiple \"changes\" 'sidebar-in': ('#slide-in', '#fade' time('delay')), // or create a 1-to-1 alias 'modal-in': #sidebar-in, ); Name your changes anything – from abstractions like fade, to concrete patterns like sidebar-in. Values can be CSS-ready values, references other changes in the map, or format strings to interpolate. Used By @mixin add-changes() @function change() Access a named change in your $changes map. Since 1.0.0: NEW: Accepts $do map argument, for on-the-fly adjustments NEW: Accepts $source map argument, for custom source-palette Parameters & Return $name: (string) The name of a change in your configuration (e.g. fade-in) $do: null (map | null) A map of function/ratio adjustments to run on the returned value $source: $changes (map) Optional accoutrement-format map of changes to use as the origin palette @return (length) The change value requested Requires @function get() [private] Used By @mixin animate() @mixin transition() @mixin add-changes() Merge individual change maps into the global $changes variable, in case you want to define changes in smaller groups – such as button-changes, page-changes, etc – before merging them into a single global changes-palette. Parameters & Output $maps: (map...) Pass any number of maps to be merged and added {CSS output} (code block) An updated global $changes variable, with new maps merged in. Requires @function multi-merge() $changes @mixin animate() Access named animations in your $changes map, and apply them to the animation property. Parameters & Output $names: (string) Named animations to apply {CSS output} (code block) The requested animations, applied in CSS Example scss tools.$changes: ( 'fade-in': fade-in 300ms ease-out both, ); .example { @include tools.animate('fade-in'); } css compiled .example { animation: fade-in 300ms ease-out both; } Requires @function change() @mixin transition() Access named transitions in your $changes map, and apply them to the transition property. Parameters & Output $names: (string) Named transitions to apply {CSS output} (code block) The requested transitions, applied in CSS Example scss tools.$changes: ( 'fade': opacity 300ms ease-out, ); .example { @include tools.transition('fade'); } css compiled .example { transition: opacity 300ms ease-out; } Requires @function change()"},"animate-ease-vars.html":{"filename":"animate-ease-vars.html","title":"Easing » CSS Variables","contents":"Easing » CSS Variables $easing-var-prefix (string) scss $easing-var-prefix: 'ease-' !default; Since CSS variables are often defined in a global space, it can be useful to prefix different variable types. Accoutrement maps help solve that problem in Sass, so we wanted to carry that over into our CSS variable support. Set a prefix for all easing-tokens, and we’ll apply it when setting or calling css variables based on your easing maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$easing: ('my-ease': '#_in-out-back'); tools.$easing-var-prefix: 'prefix_'; html { @include tools.ease--('my-ease') } css compiled html { --prefix_my-ease: cubic-bezier(0.68, -0.55, 0.265, 1.55); } Used By @mixin easing--() @mixin ease--() @function var-ease() @mixin easing--() Convert any easing-map into CSS variables, using the global $easing-var-prefix. Easing names that start with _ or - are considered “private” and will not be output as variables Easing values that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $easing (map) Optionally use a custom map of easing tokens to set as css variables {CSS output} (code block) Custom properties for all public easing in the map Example scss tools.$easing: ( '_elastic': cubic-bezier(0.5, -0.4, 0.5, 1.4), 'modal': '#_elastic', 'error-message': '#modal', ); html { @include tools.easing--; } css compiled html { --ease-modal: cubic-bezier(0.5, -0.4, 0.5, 1.4); --ease-error-message: var(--ease-modal, cubic-bezier(0.5, -0.4, 0.5, 1.4)); } Requires $named-easing $easing-var-prefix (string) @mixin ease--() Set a single custom property based on a map-easing, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $ease: (*) Easing name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $ease $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $easing (map) Optional map of easing to use as a palette source Example scss tools.$easing: ( '_elastic': cubic-bezier(0.5, -0.4, 0.5, 1.4), 'modal': '#_elastic', 'error-message': '#modal', ); .example { @include tools.ease--('modal'); @include tools.ease--('toast', 'modal', ease-in); } css compiled .example { --ease-modal: cubic-bezier(0.5, -0.4, 0.5, 1.4); --ease-toast: var(--ease-modal, ease-in); } Requires $named-easing $easing-var-prefix (string) @function var-ease() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $ease: (*) Easing name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: (map) Optional Accoutrement map of easing tokens to use as source @return (string) CSS variable call, in the format: var(--, ) Example scss tools.$easing: ( '_elastic': cubic-bezier(0.5, -0.4, 0.5, 1.4), 'modal': '#_elastic', 'error-message': '#modal', ); .example { animation: fade 1s tools.var-ease('error-message', ease-in); transition: translate var-ease('modal'); } css compiled .example { animation: fade 1s var(--ease-error-message, ease-in); transition: translate var-ease(\"modal\"); } Requires @function var-token() $named-easing $easing-var-prefix (string)"},"animate-ease.html":{"filename":"animate-ease.html","title":"Easing Maps","contents":"A classic set of built-in easing functions, if you don’t want to define your own. These can be used either as variables (with the ease- prefix), or in token maps (with the _ prefix) Since 4.0.0: NEW: Now available as individual variables Example scss @use 'animate/easing-named' as named; @each $name, $value in meta.module-variables('named') { /*! $#{$name}: #{$value}; */ } css compiled /*! $in: ease-in; */ /*! $out: ease-out; */ /*! $in-out: ease-in-out; */ /*! $in-quad: cubic-bezier(0.55, 0.085, 0.68, 0.53); */ /*! $in-cubic: cubic-bezier(0.55, 0.055, 0.675, 0.19); */ /*! $in-quart: cubic-bezier(0.895, 0.03, 0.685, 0.22); */ /*! $in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06); */ /*! $in-sine: cubic-bezier(0.47, 0, 0.745, 0.715); */ /*! $in-expo: cubic-bezier(0.95, 0.05, 0.795, 0.035); */ /*! $in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.335); */ /*! $in-back: cubic-bezier(0.6, -0.28, 0.735, 0.045); */ /*! $out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94); */ /*! $out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1); */ /*! $out-quart: cubic-bezier(0.165, 0.84, 0.44, 1); */ /*! $out-quint: cubic-bezier(0.23, 1, 0.32, 1); */ /*! $out-sine: cubic-bezier(0.39, 0.575, 0.565, 1); */ /*! $out-expo: cubic-bezier(0.19, 1, 0.22, 1); */ /*! $out-circ: cubic-bezier(0.075, 0.82, 0.165, 1); */ /*! $out-back: cubic-bezier(0.175, 0.885, 0.32, 1.275); */ /*! $in-out-quad: cubic-bezier(0.455, 0.03, 0.515, 0.955); */ /*! $in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1); */ /*! $in-out-quart: cubic-bezier(0.77, 0, 0.175, 1); */ /*! $in-out-quint: cubic-bezier(0.86, 0, 0.07, 1); */ /*! $in-out-sine: cubic-bezier(0.445, 0.05, 0.55, 0.95); */ /*! $in-out-expo: cubic-bezier(1, 0, 0, 1); */ /*! $in-out-circ: cubic-bezier(0.785, 0.135, 0.15, 0.86); */ /*! $in-out-back: cubic-bezier(0.68, -0.55, 0.265, 1.55); */ Used By @function ease() @mixin easing--() @mixin ease--() @function var-ease() Easing Maps: Curves & Steps Whether you are using CSS-named easing, like ease-in-out and linear, or defining your own easing with cubic-bezier() and steps()/frames() – we’ll help you organize and standardize your values in a single location. We also provide a classic set of built-in easing functions, which you can rename, access, or override as desired. $easing scss $easing: () !default; A variable storing the map of all easing globally-available on your project. Any easing added to the $easing map will be accessible to the ease() function by default. Define each easing with a name and value… $easing: ( 'elastic': cubic-bezier(0.5, -0.4, 0.5, 1.4), 'sidebar-in': ease-out, 'sidebar-out': '#_in-back', 'modal-in': '#sidebar-in', ); Name your easing anything – from abstractions like elastic, to concrete patterns like sidebar-in. Values can be CSS-ready easing functions, or references other easings in the map. Used By @mixin add-easing() @function ease() Access a named easing function in your $easing map. Since 1.0.0: NEW: Accepts $do map argument, for on-the-fly adjustments NEW: Accepts $source map argument, for custom source-palette Parameters & Return $name: 'ease' (string) The name of an easing in your configuration $do: null (map | null) A map of function/ratio adjustments to run on the returned value $source: $easing (map) Optional accoutrement-format map of easings to use as the origin palette (in additional to the provided defaults) @return (length) The pre-defined easing Requires @function get() [private] $named-easing @mixin add-easing() Merge individual easing maps into the global $easing variable, in case you want to define easings in smaller groups such as fade-easing, slide-easing, etc before merging them into a single global easing-palette. Parameters & Output $maps: (map...) Pass any number of maps to be merged. {CSS output} (code block) An updated global $easing variable, with new maps merged in. Requires @function multi-merge() $easing"},"animate-time-vars.html":{"filename":"animate-time-vars.html","title":"Times » CSS Variables","contents":"Times » CSS Variables $time-var-prefix (string) scss $time-var-prefix: 'time-' !default; Since CSS variables are often defined in a global space, it can be useful to prefix different variable types. Accoutrement maps help solve that problem in Sass, so we wanted to carry that over into our CSS variable support. Set a prefix for all time-tokens, and we’ll apply it when setting or calling css variables based on your time maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$times: ('my-time': 1s); tools.$time-var-prefix: 'prefix_'; html { @include tools.time--('my-time') } css compiled html { --prefix_my-time: 1s; } Used By @mixin times--() @mixin time--() @function var-time() @mixin times--() Convert any time-map into CSS variables, using the global $time-var-prefix. Time names that start with _ or - are considered “private” and will not be output as variables Times that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $times (map) Optionally use a custom map of times to set as css variables {CSS output} (code block) Custom properties for all public times in the map Example scss tools.$times: ( '_fast': 200ms, 'text': '#_fast', 'fade': '#text', ); html { @include tools.times--; } css compiled html { --time-text: 200ms; --time-fade: var(--time-text, 200ms); } Requires $time-var-prefix (string) @mixin time--() Set a single custom property based on a map-time, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $time: (*) Time name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $time $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $times (map) Optional map of times to use as a palette source Example scss tools.$times: ( '_brand': 200ms, 'text': '#_brand' ('plus': 50ms), 'fade': '#text', ); .example { @include tools.time--('fade'); @include tools.time--('color-change', 'fade', 0.2s); } css compiled .example { --time-fade: var(--time-text, 250ms); --time-color-change: var(--time-fade, 0.2s); } Requires $time-var-prefix (string) @function var-time() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $time: (*) Time name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: (map) Optional Accoutrement map of times to use as source @return (string) CSS variable call, in the format: var(--, ) Example scss tools.$times: ( '_fast': 200ms, 'text': '#_fast' ('plus': 50ms), 'fade': '#text', ); .example { transition: opacity tools.var-time('fade'), color tools.var-time('text', 150ms); } css compiled .example { transition: opacity var(--time-fade, 250ms), color var(--time-text, 150ms); } Requires @function var-token() $time-var-prefix (string)"},"animate-times.html":{"filename":"animate-times.html","title":"Timing Maps","contents":"Timing Maps: Durations & Delays Manage all your duration & delay patterns in a single place - with explicitly documented relationships. $times scss $times: () !default; A variable storing the map of all timing globally-available on your project. Any times added to the $times map will be accessible to the time() function by default. Define each time with a name, base-value, and optional adjustments… $times: ( 'fast': , 'slow': ('': ''), // will return: function-name($base-value, $arguments...) ); Name your times anything – from abstractions like fast, to concrete patterns like button-background-hover. Base-values can be CSS-ready times, or references other times in the map. Adjustments are a nested map of functions and arguments, for adjusting times directly in your palette. Used By @mixin add-times() @function time() Access a named time in your $times map. Since 1.0.0: NEW: Accepts $do map argument, for on-the-fly adjustments NEW: Accepts $source map argument, for custom source-palette Parameters & Return $time: (string) The name of a time in your configuration $do: null (map | null) A map of function/ratio adjustments to run on the returned value $source: $times (map) Optional accoutrement-format map of times to use as the origin palette @return (length) The calculated length of time Requires @function get() [private] @mixin add-times() Merge individual time maps into the global $times variable, in case you want to define times in smaller groups such as duration-times, delay-times, etc before merging them into a single global times-palette. Parameters & Output $maps: (map...) Pass any number of maps to be merged. {CSS output} (code block) An updated global $times variable, with new maps merged in. Requires @function multi-merge() $times"},"animate.html":{"filename":"animate.html","title":"QuickStart: Animate","contents":"QuickStart: Animate Tools for managing animations & transitions. Organize all your timing, easing, and transitions into maps Document relationships directly in the code Import If you already imported accoutrement/sass/tools you are ready to go. You can also import the color module on its own: @use '/accoutrement/sass/animate'; Timing & Easing Establish your timing and easing palettes, with the standard Accoutrement syntax: $times: ( 'fast': 150ms, 'medium': '#fast' ('times': 2), ); $easing: ( 'elastic': cubic-bezier(0.5, -0.4, 0.5, 1.4), 'fade-in': '#in-out-quad', ); Access them anywhere: .example { animation: slide-in time('fast') ease('in-out-quad') 1 both; transition-delay: time('fast'); transition-duration: time('medium'); transition-timing-function: ease('elastic'); } Related $times @function time() $easing @function ease() Transitions & Animations Use your timing and easing patterns to compose reusable “changes” – including transitions and animations: $changes: ( 'slide-in': slide-in time('fast') ease('in-out-quad') 1 both, 'delay-in': '#slide-in' time('medium'), 'fade-ease': time('medium') ease(in), 'fade-colors': color '#fade-ease', background-color '#fade-ease', ); Access them anywhere: .example { animation: change('slide-in'); transition: change('fade-colors'); } Or use the mixin shortcuts: .example { @include animate('slide-in'); @include transition('fade-colors'); } Related $changes @function change() @mixin animate() @mixin transition()"},"CHANGELOG.html":{"filename":"CHANGELOG.html","title":"Changelog","contents":"Accoutrement Changelog 4.0.0 - UNRELEASED 4.0.0-beta.1 - 12/03/21 This is a major update, moving over to Sass modules, and removing some features that no longer seem necessary. BREAKING: Requires Sass modules, and other recent features of Dart Sass. Legacy versions of Sass (Node & Ruby) are no longer supported BREAKING: The old “init” module, which provided light-weight browser normalization, is no longer included. We now recommend using CSS Remedy. BREAKING: The old “core” module has been broken into individual modules for “utilities” (extending several Sass modules), “tokens” (the map syntax parser), “variables” (converting Sass variables & maps to CSS custom properties), and “ratios” (for typographic scales and layout aspect ratios) Sass Utilities: NEW: These functions are now available directly, as well as being registered in the map syntax Variables: NEW: ident() function adds -- and an optional prefix to any string, in order to generate a custom property identifier. NEW: custom-props() mixin generates custom properties for every key/value pair in a map. Tokens: NEW: A module just for the custom map syntax parser & function registration BREAKING: The $functions map no longer accepts alias references or any other aspects of the token syntax BREAKING: Ratios are no longer first-class adjustments (like functions) in the token syntax BREAKING: tokens.$handle-missing-keys defaults to null, and no longer supports the legacy silent option. BREAKING: get-token() is renamed get(), and only accepts bare token names (no # prefix), including the outer->inner nested token syntax. NEW: The new compile() function provides direct access to parse & resolve an arbitrary token value (including aliases with # prefix), rather than calling a specific token by name. NEW: All the built-in Sass module functions are registered by default, as . NEW: has-token() function checks a map to see if the given token is defined, and supports the outer->inner nested token syntax. Ratios: NEW: Built-in named ratios are now available as individual variables, (without the _ prefix that is applied in token maps) NEW: is-ratio() function can be used to type-check ratios, including ratio tokens. Scale: NEW: scale() function applies a modular scale to any value, allowing you to move up or down the scale any number of steps. Layout: BREAKING: Removed global-box-sizing BREAKING: Removed clearfix BREAKING: Removed fluid-ratio BREAKING: Removed position. Can achieve the majority of functionality in CSS using Inset 3.0.1 - 03/01/21 INTERNAL: Upgrade dev dependencies. DOCS: Fix changelog typo. 3.0.0 - 02/22/21 BREAKING: Change to get-token() return value when the key path cannot be resolved, and $handle-missing-keys is unset or silent: Maps along the missing key path are no longer interpolated into the returned string. This is part of the fix for #49. Use $handle-missing-keys for more precise missing subkey behavior. (Thanks to John Crim @johncrim) NEW/BREAKING: Font maps accept display key, which can be used to set font-display property for importing web-fonts. (thanks to André Schließer @schliesser) BUGFIX (#49): Using get-token() to resolve a missing key no longer errors when using dart-sass and $handle-missing-keys is unset or silent. Instead, the unresolved path is returned. (Thanks to John Crim @johncrim) BUGFIX (#61): Using get-token() to obtain a 2nd level or deeper submap no longer causes a fatal error when using dart-sass and $handle-missing-keys is null, warn, or error. (Thanks to John Crim @johncrim) INTERNAL: Run unit tests with dart-sass (in addition to node-sass, which was used prior). (Thanks to John Crim @johncrim) INTERNAL: Upgrade dev dependencies. DOCS (#53): Use html rather than :root for examples. DOCS: Wrong parameter name in contrast-ratio() function docs. 2.2.0 - 09/08/20 NEW: (#41) Global $handle-missing-keys allows you to control exactly what should happen when a key look-up fails. The default silent provides backwards-compatible silent-failure. Other options include: null: get-token() will return null, similar to Sass map.get() warn: get-token() will return null, and also throw a warning error: get-token() will throw an error if the value is not found NEW: \\\\ (an escaped backslash) can be used to ignore (\\\\#not-an-alias) or end (#alias\\\\not-part-of-alias) a # reference INTERNAL: (#41) Major performance improvements to the token look-up algorithm Huge thanks to James Camilleri (@jcamilleri13) for all the improvements here. 2.1.4 - 06/30/20 DOCS (#54): Fix broken links in docs INTERNAL: Upgrade dev dependencies. 2.1.3 - 01/06/20 Core: BUGFIX (#46): Fixes register-function() usage with Sass module syntax 2.1.2 - 08/26/19 Upgrade dev dependencies. Core: BUGFIX (#36): Fixes an issue with quote() in dart-sass. BUGFIX (#38): Fixes an issue with false values in maps. 2.1.1 - 01/04/19 Core: BUGFIX (#31): Fixes an issue with longhand map memoization 2.1.0 - 12/20/18 Plugin: Color NEW: contrast(), contrasted(), var-contrast(), and var-contrasted() provide access to the lowest accessible contrast value, as well as than the (default) maximum contrast value. Pass a valid contrast ratio (0-21) or WCAG standard (aaa, aa, aa-large) to set a cutoff ratio, and return the minimum accessible color NEW: shades-of() generates a range of light and dark color-shades to help build accessible themes based on a few origin colors NEW: stripe-colors() function and mixin generate a color-stops or a full striped gradient background. This is useful for viewing the result from shades-of() 2.1.0-beta.1 - 12/13/18 Plugin: Color NEW: var-contrast() and var-contrasted() provide CSS variable parallels to contrast() and contrasted() NEW: User-defined contrast defaults (contrast-light and contrast-dark) can be defined with or without the _ private-color prefix NEW: Contrast-related functions and mixins provide a smart second light-or-dark default option when only one is defined (previously an error) 2.0.0 - 12/05/18 The 2.0 release is primarily focused on support for CSS Custom Properties (aka CSS Variables), and access to nested-map tokens with #outside->inside syntax. We’ve also added private tokens (_token), and various tools for token-inspection. All factory-default tokens (contrast-colors, named ratios, etc) are now marked as private, and will need to be called with a _ prefix. See the full details below. Thanks to Joel Schou (@joelschou) for extensive contributions, designing and testing several of these features. Core: BREAKING: Explicit value/adjustments maps require a '%value' key (used to be named 'value'), in order to avoid possible conflicts or false-positives NEW (BREAKING alpha.1): all nested-map token references (using ->) must be absolute paths from the map root, rather than assuming the most closely related sibling or ancestor value BUGFIX (from alpha.1): Major improvements to compile time when parsing -> syntax 2.0.0-alpha.1 - 10/29/18 Core: NEW: $adjust-query-overlap (max | min | false) allows you to control if and how media-queries are adjusted to avoid overlap between min/max queries (thanks to @joelschou) NEW: Support for integrating accoutrement tokens & CSS variables with tokens--(), token--(), var-token(), and plugin-specific shortcuts BREAKING: Token names starting with _ or - are considered “private” to Sass, and will not be output when auto-generating CSS (variables, font-names, etc.) BREAKING: Default ratio tokens are now prefixed with _ (search/replace e.g. minor-third -> _minor-third) to avoid CSS-variable output NEW: is-private-token() and is-alias-for() are now public functions, to help with token-inspection BREAKING: Support for nested-map tokens with -> syntax, both in #hash->references and get-token($source, 'function->calls') (thanks to @joelschou) Plugin: Animate BREAKING: Default easing tokens are now prefixed with _ (search/replace e.g. in-out-quad -> _in-out-quad) to avoid CSS-variable output NEW: Support for easing CSS variables with easing--(), ease--(), and var-ease() NEW: Support for time CSS variables with times--(), time--(), and var-time() NEW: Support for change CSS variables with changes--(), change--(), and var-change() Plugin: Color BREAKING: _contrast-light and _contrast-dark colors are used for mixing tint() and shade(), with optional $light/$dark override parameters (thanks to @joelschou) NEW: Default _contrast-light and _contrast-dark provided, set _contrast-light/dark in $colors to override NEW: Support for CSS Variables with colors--(), color--(), and var-color() Plugin: Layout BREAKING: Default ratio tokens are now prefixed with _, see core for details Plugin: Scale BREAKING: Default ratio tokens are now prefixed with _, see core for details NEW: Support for size CSS Variables with sizes--(), size--(), and var-size() NEW: Support for ratio variables with ratios--(), ratio--(), and var-ratio() Plugin: Type BREAKING: Non-map fonts are interpreted as font-stacks BREAKING: Normalized font-data uses proper name-quotation, and ignores missing or private names/stacks BREAKING: import-webfonts() no longer imports private fonts, but will import a direct alias of the private font NEW: import-webfonts() accepts $source parameter NEW: Support for CSS Variables with fonts--(), font--(), and var-font() 1.0.1 - 09/08/18 Core: BUGFIX: Typos, including the cinema ratio spelling (thanks to @joelschou) BUGFIX: Improved consistency of nested-map parser (thanks to @joelschou) 1.0.0 - 08/08/18 The stable 1.0 release is identical to -beta.3, see change details below 1.0.0-beta.3 - 08/03/18 Plugin: Scale BUGFIX: size() function removes quotes from string (calc) sizes 1.0.0-beta.2 - 07/27/18 Core: NEW: ratio() function accepts $source argument, for passing in a custom source map NEW: Improved error-handling and messages NEW: Added str-trim and str-split aliases in addition to the existing trim and split Plugin: Animate NEW: ease(), time(), and change() functions all accept $source argument, for passing in a custom source map Plugin: Layout NEW: break() function accepts $source argument, for passing in a custom source map NEW: break() function accepts $scale boolean, to turn off access to the scale-plugin $sizes map NEW: fluid-ratio() function and mixin both accept $source argument, for passing in a custom source map Plugin: Scale BREAKING: negative() function and square() mixin both accept $do argument for on-the-fly adjustments – replacing the old $units… variable argument. Non-map $do values are converted to ('convert-units': $do) before processing, to provide a shortcut for unit-conversions. negative('root', 'cm') will continue to work, but negative('root', 'em', 10px) should be changed to negative('root', 'em' 10px) (with all unit args in a single list) NEW: size()/negative() functions and square() mixin accept $source argument, for passing in a custom source map Plugin: Type NEW: font()/font-family() functions and font-family()/font-face() mixins accept $source argument, for passing in a custom font-source map 1.0.0-beta.1 - 07/18/18 NEW: Add _index.scss to simplify default “tools” import (core + plugins) in Eyeglass: @import 'accoutrement'; Core: NEW: get-token() and ratio() functions accept $do argument, for on-the-fly adjustments NEW: trim($string) utility now available in map-syntax, to trim white-space from the start and end of a string NEW: str-replace() utility now forces arguments to string-type when appropriate, allowing e.g. calc(16px + 1vw) ('str-replace': 1vw 2vw) Plugin: Animate NEW: change(), time(), and ease() functions all accept $do arg for on-the-fly adjustments Plugin: Color BREAKING: color() functions accept $do arg for on-the-fly adjustments – before existing $palette argument BREAKING: $palette argument renamed $source for consistency across plugins Plugin: Layout NEW: break() function accept $do arg for on-the-fly adjustments Plugin: Scale BREAKING: size() function $units… variable argument has been replaced with $do map argument, for flexible on-the-fly adjustments. Non-map $do values are converted to ('convert-units': $do) before processing, to provide a shortcut for unit-conversions. size('root', 'cm') will continue to work, but size('root', 'em', 10px) should be changed to size('root', 'em' 10px) (with all unit args in a single list) Plugin: Type BREAKING: import-webfonts() mixin no longer accepts any arguments NEW: font() function provides access to parsed font-data NEW: 'trim' string helper strips whitespace from the start and end of a string NEW: Improved font-normalization handles more font-map edge-cases NEW: Font-stacks can be written as comma-delimited strings, e.g. 'Helvetica Neue, Helvetica, Arial' or 'Helvetica Neue, Helvetica, Arial' 0.1.0 - 07/12/18 BREAKING: All modules now use a shared map syntax, with explicit #tag references and the option for explicit value/adjustment maps. Learn the new syntax. NEW: Merges all existing Accoutrement plugins Core: BREAKING: Internal map-reference now uses #tag syntax NEW: Generic map-syntax, access, and parsing tools are shared by all plugins, and can be used with un-specified data types NEW: Improved function-registration options NEW: Math, modular-scale, string, and list utilities combined from the individual plugins Plugin: Animate: A totally new plugin! Plugin: Color: BREAKING: See core module syntax changes BREAKING: Removed merge-colors() function Plugin: Layout: BREAKING: See core module syntax changes BREAKING: Ratio functionality merged into Core, using the shared $ratios map, and ratio() function. The old $aspect-ratios and aspect-ratio() have been removed. Plugin: Scale: BREAKING: See core module syntax changes BREAKING: String interpolation has moved into the core using function syntax '%s and %s' ('%s': 'new1' 'new2') rather than list syntax '%s and %s' ('new1', 'new2') BREAKING: Math functions have moved into the core. The actual functions are now prefixed & private, but they are made available to Accoutrement maps under the additional aliases New: Ratios have moved into the core, with additional defaults Plugin: Type: BREAKING: See core module syntax changes NEW: Allow space-separated string variants ('500 italic') for weight and style, in addition to lists (500 'italic') NEW: Automatically formats font-family stacks with proper commas & quotations for CSS output Older Changelogs, from individual modules: Accoutrement Init Accoutrement Color Accoutrement Layout Accoutrement Scale Accoutrement Type"},"color-config.html":{"filename":"color-config.html","title":"Color Configuration","contents":"Color Configuration The color module provides several functions & mixins for managing color contrast, as well as tint and shade functions for mixing colors with white or black. In both cases, it can be useful to establish your own light & dark contrast colors to work with in place of true white or black. $contrast-light (color) scss $contrast-light: white !default; Establish a default light color for use in contrast functions. Used By @function default-contrast() [private] $contrast-dark (color) scss $contrast-dark: black !default; Establish a default dark color for use in contrast functions. Used By @function default-contrast() [private]"},"color-contrast.html":{"filename":"color-contrast.html","title":"Contrast & Accessibility","contents":"Contrast & Accessibility @function contrast() For any color, select the best contrast among a set of options. For best results, pass in a combination of light and dark colors to contrast against – or define default contrast-light and contrast-dark values (with or without a private _ prefix) in your global $colors map. Parameters & Return $color: (string | list) The name or value of a color. $options...: (colors | min-contrast) List of colors to contrast against. This function will choose the best contrast of all the options provided, or the contrast-light and contrast-dark defaults defined in your color palette or the factory settings. Any {'AA' | 'AA-large' | 'AAA' | 0-21 } values will be treated as a minimum color-contrast ratio – and will return the minimum accessible option, rather than the maximum contrast. @return (color) Whichever color-option has the highest contrast-ratio to $color, or the minimum needed contrast to meet a given accessibility ratio. Examples scss max contrast tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { color: tools.contrast( 'background', 'light', 'dark', black, white ); } css compiled html { color: white; } scss min contrast tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { color: tools.contrast( 'background', 'light', 'dark', black, white, 'AAA' ); } css compiled html { color: #eee; } Requires @function best-contrast() [private] Used By @mixin contrasted() @function var-contrast() An extension of the contrast function, designed to output CSS variables rather than simple color values. Since 2.1.0: NEW: Provides access to contrast colors as CSS-variables, when defined Parameters & Return $color: (string | list) The name or value of a color. $options...: (colors | min-contrast) List of colors to contrast against. This function will choose the best contrast of all the options provided, or the contrast-light and contrast-dark defaults defined in your color palette or the factory settings. Any {'AA' | 'AA-large' | 'AAA' | 0-21 } values will be treated as a minimum color-contrast ratio – and will return the minimum accessible option, rather than the maximum contrast. @return (color | var()) CSS Variable for the color-option that has the highest contrast-ratio to $color, or the color if no variable exists. Examples scss max contrast / no variable names tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { color: tools.var-contrast( 'background', 'light', 'dark', black, white ); } css compiled html { color: white; } scss min contrast / variable names tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { color: tools.var-contrast( 'background', 'light', 'dark', black, white, 'AAA' ); } css compiled html { color: var(--color-light, #eee); } Requires @function best-contrast() [private] @function get() [private] @function is-private-token() @function ident() $color-var-prefix (string) Used By @mixin var-contrasted() @mixin contrasted() Apply any background color, along with the highest-contrast text color from a set of options. This works the same as the contrast function, but applies the resulting values to background-color and text color properties. Parameters & Output $background: (string | list) The name or value of your desired background color. $options...: (colors | min-contrast) List of colors to contrast against. This function will choose the best contrast of all the options provided, or the contrast-light and contrast-dark defaults defined in your color palette or the factory settings. Any {'AA' | 'AA-large' | 'AAA' | 0-21 } values will be treated as a minimum color-contrast ratio – and will return the minimum accessible option, rather than the maximum contrast. {CSS output} (code block) Sets the background-color to $background and color to the option with highest contrast against that background, or minimum contrast that still meets a given accessibility ratio. Examples scss max contrast tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { @include tools.contrasted( 'background', 'light', 'dark', black, white ); } css compiled html { background-color: blue; color: white; } scss min contrast tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { @include tools.contrasted( 'background', 'light', 'dark', black, white, 'AAA' ); } css compiled html { background-color: blue; color: #eee; } Requires @function color() @function contrast() @mixin var-contrasted() Apply any background color as a CSS variable, along with the highest-contrast text color from a set of options. This works the same as the var-contrast function, but applies the resulting values to background-color and text color properties. Since 2.1.0: NEW: Applies contrasting colors as CSS-variables, when defined Parameters & Output $background: (string | list) The name or value of your desired background color. $options...: (colors | min-contrast) List of colors to contrast against. This function will choose the best contrast of all the options provided, or the contrast-light and contrast-dark defaults defined in your color palette or the factory settings. Any {'AA' | 'AA-large' | 'AAA' | 0-21 } values will be treated as a minimum color-contrast ratio – and will return the minimum accessible option, rather than the maximum contrast. {CSS output} (code block) Sets the background-color to $background and the foreground color to whichever option has better contrast against the given background. Examples scss max contrast tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { @include tools.var-contrasted( 'background', 'light', 'dark', black, white ); } css compiled html { background-color: var(--color-background, blue); color: white; } scss min contrast tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { @include tools.var-contrasted( 'background', 'light', 'dark', black, white, 'AAA' ); } css compiled html { background-color: var(--color-background, blue); color: var(--color-light, #eee); } Requires @function var-color() @function var-contrast() @function contrast-ratio() Compare two colors using the WCAG comparison algorithm, and return the resulting contrast-ratio. Optionally pass in a standard (AA, AAA, AA-large) and return false when the contrast-check fails. ‘AA-large’ == 3:1 ‘AA’ == 4.5:1 ‘AAA’ == 7:1 Parameters & Return $base: (color | number) Color value, color token name, or pre-calculated numeric luminance for the base color. $contrast: (color | number) Color value, color token name, or pre-calculated numeric luminance for a contrast color to compare against the base. $require: false ('AA' | 'AA-large' | 'AAA' | number | false) An optional WCAG contrast ratio to require. The function will return false if the required ratio is not met. @return (number) The WCAG-defined contrast-ratio of two colors. Example scss /* black and white: #{tools.contrast-ratio(white, black)} */ /* failed 'AAA': #{tools.contrast-ratio(white, #999, 'AAA')} */ css compiled /* black and white: 21 */ /* failed 'AAA': false */ Related WCAG Contrast Definition [external] Requires @function luminance() @function valid-contrast() [private] @function check() [private] @function error() [private] Used By @function best-contrast() [private] @function luminance() Get the WCAG luminance of a color in your palette. Parameters & Return $color: (string | list) A color value or color token name. @return (number) WCAG-defined numeric luminance value. Related WCAG Relative Luminance [external] Requires @function color() @function check() [private] Used By @function contrast-ratio() @function shades-of() @function best-contrast() [private]"},"color-themes.html":{"filename":"color-themes.html","title":"Themes","contents":"Color Themes @function shades-of() Generates an accoutrement map of light/dark color variations from a map of user-defined colors, based on luminosity. The origin color will be included in the appropriate spot, based on it’s own luminosity. Since 2.1.0: NEW: Generate consistent tint/shade themes from arbitrary colors Parameters $origin: (map) user-color map to use as a basis for generating the theme $range: 3 (integer) number of dark and light variations desired, in addition to the midpoint Example scss $user-colors: ( 'primary': blue, 'accent': red, ); @include tools.add-colors($user-colors); $theme-colors: tools.shades-of($user-colors, 2); @include tools.add-colors($theme-colors); @each $name, $value in $theme-colors { /* #{$name}: #{inspect($value)} */ } css compiled /* primary-dark-2: \"#primary\" (\"shade\": 40%) */ /* primary-dark-1: \"#primary\" */ /* primary-0: \"#primary\" (\"tint\": 15.3846153846%) */ /* primary-light-1: \"#primary\" (\"tint\": 46.1538461538%) */ /* primary-light-2: \"#primary\" (\"tint\": 76.9230769231%) */ /* accent-dark-2: \"#accent\" (\"shade\": 40%) */ /* accent-dark-1: \"#accent\" */ /* accent-0: \"#accent\" (\"tint\": 15.3846153846%) */ /* accent-light-1: \"#accent\" (\"tint\": 46.1538461538%) */ /* accent-light-2: \"#accent\" (\"tint\": 76.9230769231%) */ Requires @function color() @function luminance() @function get() [private] @function stripe-colors() Create color-stops for a striped gradient background, from any number of colors Since 2.1.0: NEW: Especially useful for viewing generated color palettes Parameters & Return $colors...: (string | color) ArgList of colors @return (color) A calculated css-ready color-value based on your global color palette. Example scss [data-theme='rainbow'] { background: linear-gradient( to right, tools.stripe-colors(red, orange, yellow, green, blue, indigo, violet) ); } css compiled [data-theme=rainbow] { background: linear-gradient(to right, red 0% 14.2857142857%, orange 14.2857142857% 28.5714285714%, yellow 28.5714285714% 42.8571428571%, green 42.8571428571% 57.1428571429%, blue 57.1428571429% 71.4285714286%, indigo 71.4285714286% 85.7142857143%, violet 85.7142857143% 100%); } Requires @function color() $colors (map) Used By @mixin stripe-colors() @mixin stripe-colors() Create a striped gradient background from any number of colors Since 2.1.0: NEW: Especially useful for viewing generated color palettes Parameters $angle...: (gradient angle) e.g. to right or 35deg $colors...: (string | color) ArgList of colors Example scss [data-theme='rainbow'] { @include tools.stripe-colors( to right, red, orange, yellow, green, blue, indigo, violet ); } css compiled [data-theme=rainbow] { background-image: linear-gradient(to right, red 0% 14.2857142857%, orange 14.2857142857% 28.5714285714%, yellow 28.5714285714% 42.8571428571%, green 42.8571428571% 57.1428571429%, blue 57.1428571429% 71.4285714286%, indigo 71.4285714286% 85.7142857143%, violet 85.7142857143% 100%); } Requires @function stripe-colors() $colors (map)"},"color-tokens.html":{"filename":"color-tokens.html","title":"Color Tokens","contents":"Accessing Colors $colors (map) scss $colors: () !default; A variable storing the map of all colors globally-available on your project. Any colors added to the $colors map will be accessible to the color() function by default. Define each color with a name, base-value, and optional adjustments… $colors: ( 'color-name': , 'color-two': ('': ''), // will return: function-name($base-value, $arguments...) ); Name your colors anything – from abstractions like brand-pink, to concrete patterns like button or widget-background. Base-values can be CSS-ready colors (hex, rgb, hsla), or references other colors in the map. Adjustments are a nested map of color functions and arguments, for adjusting colors directly in your palette. The color-names contrast-light and contrast-dark are special (with or without a private _ prefix). Use those names to define the default light-and-dark options for our color-contrast tools. They default to white and black respectively. Since 0.1.0: BREAKING: Uses the new shared map syntax, for internal references and adjustments Examples scss simple color definitions $colors: ( 'brand-pink': hsl(330, 85%, 62%), 'brand-light': #fff, 'brand-dark': #222, ); scss reference other colors $colors: ( 'background': '#brand-light', 'text': '#brand-dark', 'link': '#brand-pink', ); scss adjust referenced colors with any color function $colors: ( 'focus': '#link' ('darken': 15%, 'desaturate': 15%), ); Used By @function stripe-colors() @mixin stripe-colors() @mixin add-colors() @function default-contrast() [private] @mixin add-colors() Merge individual color maps into the global $colors variable, in case you want to define colors in smaller groups such as brand-colors, link-colors, etc before merging them into a single global color-palette. This can be useful for internal organization, documentation with SassDoc, or integration with our pattern-library generator: Herman. Parameters & Output $maps: (map...) Pass any number of maps to be merged. {CSS output} (code block) An updated global $colors variable, with new maps merged in. Example scss $brand-colors: ( 'brand-dark': #222, 'brand-pink': hsl(330, 85%, 62%), ); $text-colors: ( 'text': '#brand-dark', 'link': '#brand-pink', ); @include tools.add-colors($brand-colors, $text-colors); Requires @function multi-merge() $colors (map) @function color() The primary function for accessing colors in your palette, or making adjustments on the fly. This is more than a wrapper for map-get($colors, $x). It also handles internal color-references, recursion, and functional color-adjustments. It has access to the global $colors map by default, but you can also pass in arbitrary color-palette maps as well. Since 2.0.0: BREAKING: Provides access to color-contrast defaults, if they haven’t been re-set by the user Since 1.0.0: BREAKING: Renamed $palette arg to $source BREAKING: Accepts $do argument between $color and $source Parameters & Return $color: (string | list) The name of a color in your palette, or a color description in the map configuration format. $do: null (map | null) A map of function/ratio adjustments to run on the returned value $source: $colors (map) Optional map containing the source color-palette. Defaults to the global $colors map. @return (color) A calculated css-ready color, based on your global color palette and adjustments. Example scss $colors: ( 'background': #eee, 'text': #222, ); html { background: color('background'); color: color('text'); } css compiled html { background: color(\"background\"); color: color(\"text\"); } Requires @function compile() @function get() [private] Used By @mixin contrasted() @function luminance() @function shades-of() @function stripe-colors() @function tint() @function shade() @function best-contrast() [private]"},"color-utils.html":{"filename":"color-utils.html","title":"Adjustments","contents":"Color Utility Functions @function tint() Mix a color with contrast-light (defaults to white) to get a lighter tint of your color. Make sure to override $light when using tint to define the value of contrast-light Since 2.0.0: BREAKING: Use contrast-light for default mix, rather than white. NEW: Accept $light color to use in place of contrast-light default Parameters & Return $color: (string | list) The name of a color in your palette, with optional adjustments in the form of (: ). $percentage: (percentage) The percentage of a $light color to mix in. Higher percentages will result in a lighter tint. $light: null (color | String) The lighter color to be mixed in for tinting. @return (color) A calculated css-ready color-value based on your global color palette. Requires @function default-contrast() [private] @function color() @function shade() Mix a color with contrast-dark (defaults to black) to get a darker shade of your color. Make sure to override $dark when using shade to define the value of contrast-dark Since 2.0.0: BREAKING: Use contrast-dark for mix, rather than black NEW: Accept $dark color to use in place of contrast-dark default Parameters & Return $color: (string | list) The name of a color in your palette, with optional adjustments in the form of (: ). $percentage: (Percentage) The percentage of a $dark color to mix in. Higher percentages will result in a lighter tint. $dark: null (color | String) The darker color to be mixed in for shading. @return (color) A calculated css-ready color-value based on your global color palette. Requires @function default-contrast() [private] @function color()"},"color-vars.html":{"filename":"color-vars.html","title":"Color Tokens » CSS Variables","contents":"Colors » CSS Variables $color-var-prefix (string) scss $color-var-prefix: 'color-' !default; Since CSS variables are often defined in a global space, it can be useful to prefix different variable types. Accoutrement maps help solve that problem in Sass, so we wanted to carry that over into our CSS variable support. Set a prefix for all color-tokens, and we’ll apply it when setting or calling css variables based on your color maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$colors: ('my-color': pink); tools.$color-var-prefix: 'prefix_'; html { @include tools.color--('my-color') } css compiled html { --prefix_my-color: pink; } Used By @function var-contrast() @mixin colors--() @mixin color--() @function var-color() @mixin colors--() Convert any color-map into CSS variables, using the global $color-var-prefix. Color names that start with _ or - are considered “private” and will not be output as variables Colors that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $colors (map) Optionally use a custom map of colors to set as css variables {CSS output} (code block) Custom properties for all public colors in the map Example scss tools.$colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); html { @include tools.colors--; } css compiled html { --color-text: #206020; --color-border: var(--color-text, #206020); } Requires $color-var-prefix (string) @mixin color--() Set a single custom property based on a map-color, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $color: (*) Color name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $color $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $colors (map) Optional map of colors to use as a palette source Example scss tools.$colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); .example { @include tools.color--('border'); @include tools.color--('outline', 'border', red); } css compiled .example { --color-border: var(--color-text, #206020); --color-outline: var(--color-border, red); } Requires $color-var-prefix (string) @function var-color() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $color: (*) Color name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: (map) Optional Accoutrement map of colors to use as source @return (string) CSS variable call, in the format: var(--, ) Example scss tools.$colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); .example { border-color: tools.var-color('border'); color: tools.var-color('text', black); } css compiled .example { border-color: var(--color-border, #206020); color: var(--color-text, black); } Requires @function var-token() $color-var-prefix (string) Used By @mixin var-contrasted()"},"color.html":{"filename":"color.html","title":"QuickStart: Color","contents":"QuickStart: Color Tools for managing colors and palettes. Organize all your colors into a single map, or set of maps Document color relationships directly in the code Automate WCAG-appropriate contrast checking Generate color-palette documentation with Herman Import If you already imported accoutrement/sass/tools you are ready to go. You can also import the color module on its own: @use '/accoutrement/sass/color'; Color Tokens If you are using the token syntax, establish your color palette, with the standard Token syntax: $colors: ( // set explicit colors 'brand-pink': hsl(330, 85%, 62%), 'brand-light': #ddf, 'brand-dark': #224, // reference existing colors 'background': '#brand-light', 'border': '#brand-dark', // make adjustments as needed, using color functions 'link': '#brand-pink' ('shade': 25%), ); Then access your colors from anywhere: .example { border-color: color('border'); } Related $colors @function color() Multiple Palettes You can also define your colors in smaller maps, and then add them to the global $colors variable using the add-colors() mixin. Map-references using the #tag format will work across maps, once they are both added to the global setting. $brand: ( 'brand-pink': hsl(330, 85%, 62%), 'brand-light': #ddf, 'brand-dark': #224, ); $patterns: ( 'background': '#brand-light', 'border': '#brand-dark', 'link': '#brand-pink' ('shade': 25%), ); // merge everything into the main $colors map… @include add-colors($brand, $patterns); Related @mixin add-colors() WCAG Contrast We’ll also help you calculate WCAG-appropriate color contrasts. You can set the $contrast-light & $contrast-dark configuration variables (white and black by default) or add 'contrast-light' and 'contrast-dark' tokens in your palette (with or without a private _ prefix). These tools can be used with color values, or token names. a:hover { // set a background, and get well-contrasted text @include contrasted('link'); @include contrasted(rebeccapurple); // or return a contrasting color from a set of options border-color: contrast('background', white, rebeccapurple); border-color: contrast(maroon, white, rebeccapurple); } Related @function contrast() @mixin contrasted()"},"CONTRIBUTING.html":{"filename":"CONTRIBUTING.html","title":"Contributing","contents":"Contributing to Accoutrement Bug reports and feature requests are welcome, but code is even better! In all cases, we ask you to follow the Sass community guidelines. Issues You are welcome to ask support questions and file bug reports via Github Issues. In either case, please provide: A minimum code sample that demonstrates the issue, and steps to reproduce Expected behavior and actual results How you’ve attempted to solve the problem Development Set up your environment with the appropriate development dependencies: yarn As you work… Add or update any appropriate unit tests – using True – in the test directory, and make sure all tests are passing with yarn test Add your changes to the changelog Update or add inline documentation using SassDoc as appropriate, and compile the docs with yarn docs Committing Linting, testing, and documentation should be done before every commit: yarn commit They can also be triggered individually: yarn lint yarn test yarn docs Once you’ve fixed any final errors or typos, commit your changes, and submit a pull request! Pull Requests We use the main branch for production-ready code, and side-branches for everything in-progress or up-for-debate. When submitting a patch via pull request: Write a clear, descriptive commit message Keep it simple: one bug fix or feature per pull request"},"index.html":{"filename":"index.html","title":"Accoutrement Documentation","contents":"View Project View Source Sass Accoutrement Robust design systems require meaningful, readable, reusable code. These Sass utilities are designed to help define and manage your design tokens (colors, fonts, sizes, etc.) in a format that can be understood by both humans and parsers – opening the door for automation, while improving consistency and readability. These tools also integrate with Herman, our automated living pattern-library generator built on SassDoc. Official Site Documentation Source Code Issues Brought to you by OddBird – the creators of Susy, True, and Herman. Installation Install the package with npm or yarn npm install accoutrement [--save-dev] yarn add accoutrement [--dev] Use what you need: // all the modules (these are functionally the same) @use '/accoutrement'; @use '/accoutrement/sass/tools'; // individual modules (at `/accoutrement/sass/`) @use '/accoutrement/sass/color'; If you’re using Eyeglass, you can use the default “tools” (core + plugins) using only: @use 'accoutrement'; Modules for common data types Animate – For managing CSS transitions and animations Color – For managing CSS colors and contrast-ratios Scale – For managing CSS sizes: typographic scales, spacing, etc. Type – For managing webfonts, generated content, and other text needs Ratios – For managing aspect and typography ratios (several common ratios are provided) Variables – For converting Sass maps and variables into CSS custom properties Utilities – For helpers with Sass lists, strings, and maps Tokens The Token module provides a special syntax for managing design tokens with Sass “map” objects: $map: ( 'root': 16px, 'gutter': 1em, ); Using the custom syntax, we can extend maps to handle internal reference, and functional adjustments – capturing meaningful relationships between design tokens: $map: ( 'root': 16px, // internal reference & adjustments 'gutter': '#root' ( 'scale': ( '_major-third', 1, ), 'convert-units': 'rem', ), ); Map storage serves a larger purpose: Related data is grouped explicitly, making the code more readable and maintainable The “single source of truth” encourages reusable design patterns Meaningful structure allows automation, from automated style guides to automated functionality This module provides the generic (non data-specific) setup and syntax parsing: Retrieve & parse map values with token.get() and other token api functions Use the many registered functions to manipulate tokens in the map Register your own functions, for extra functionality Note: We no longer use token maps internally at OddBird since Sass “modules” now provide a way to group & namespace normal Sass variables meaningfully, and access module variables as a map. By relying on core Sass features, we avoid any confusion around the custom token syntax."},"layout-queries.html":{"filename":"layout-queries.html","title":"Media Breakpoint Maps","contents":"Media Queries $breakpoints (map) scss $breakpoints: () !default; Establish a map of named breakpoints. If using Accoutrement Scale, you can use the scale syntax for describing size-relationships and adjustments – and even reference $sizes as though they are $breakpoints. Otherwise, the map should contain only valid CSS length values. Since 0.1.0: BREAKING: Uses the new shared map syntax, for internal references and adjustments Examples scss defining breakpoints tools.$breakpoints: ( 'small': 30em, 'medium': 45em, ); scss using accoutrement-scale tools.$breakpoints: ( 'small': 30em ('convert-units': 'browser-ems'), 'medium': '#small' ('times': 1.5), ); Related PX, EM, or REM Media Queries? [external] @function break() Return a breakpoint from the $breakpoint map, or the accoutrement-scale $sizes map if it’s available. Since 1.0.0: NEW: Accepts $do map argument, for on-the-fly adjustments NEW: Accepts $source map argument, for custom breakpoint source-palette NEW: Accepts $scale boolean argument, to turn off access to scale plugin $sizes map Parameters & Return $break: (string) The name or value of a breakpoint $do: null (map | null) A map of function/ratio adjustments to run on the returned value $source: $breakpoints (map) Optional accoutrement-format map of breakpoints to use as the origin palette $scale: true (boolean) By default, we merge in any $sizes available from the scale plugin – making both $breakpoints and $sizes keys available @return (length) The retrieved value of a named breakpoint @error $break is not a valid length or keyword Requires @function compile() @function get() [private] @function error() [private] $sizes (map) Used By @mixin below() @mixin above() @mixin between() @mixin below() Generate a max– query, for styling elements below the given viewport width. To help with overlapping min/max queries, we remove 1px (or 0.01em) from every max value by default. You can adjust that setting to adjust min values or avoid adjustments using the global $adjust-query-overlap setting. Since 2.0.0: BREAKING: min/max adjustments applied to all units (not only px/em/rem) NEW: min/max adjustments respect $adjust-query-overlap global setting Parameters $max: (length | string) The name of a documented breakpoint/size, or an arbitarty length to use in the query. $prop: 'width' ('width' | 'height') The property (width or height) to test against, for a result of e.g. (max-width: 30em). Examples scss @include tools.below(30em) { html { background: red; } } css compiled @media (max-width: 29.99em) { html { background: red; } } scss tools.$breakpoints: ('red': 30em); @include tools.below('red') { html { background: red; } } css compiled @media (max-width: 29.99em) { html { background: red; } } Requires @function break() @function nudge-query() [private] @mixin above() Generate a min- query, for styling elements above the given viewport width. To help with overlapping min/max queries, we remove 1px (or 0.01em) from max values by default. You can adjust that setting to adjust min values or avoid adjustments using the global $adjust-query-overlap setting. Since 2.0.0: BREAKING: min/max adjustments applied to all units (not only px/em/rem) NEW: min/max adjustments respect $adjust-query-overlap global setting Parameters $min: (length | string) The name of a documented breakpoint/size, or an arbitrary length to use in the query. $prop: 'width' ('width' | 'height') The property (width or height) to test against, for a result of e.g. (min-width: 30em). Examples scss @include tools.above(50em) { html { background: green; } } css compiled @media (min-width: 50em) { html { background: green; } } scss tools.$breakpoints: ('green': 50em); @include tools.above('green') { html { background: green; } } css compiled @media (min-width: 50em) { html { background: green; } } Requires @function break() @function nudge-query() [private] @mixin between() Generate a min-and-max- query, for styling elements between given viewport widths. To help with overlapping min/max queries, we remove 1px (or 0.01em) from every max value by default. You can adjust that setting to adjust min values or avoid adjustments using the global $adjust-query-overlap setting. Since 2.0.0: BREAKING: min/max adjustments applied to all units (not only px/em/rem) NEW: min/max adjustments respect $adjust-query-overlap global setting Parameters $min: (length | string) The name of a documented breakpoint/size, or an arbitarty length to use as a minimum in the query. $max: (length | string) The name of a documented breakpoint/size, or an arbitarty length to use as a maximum in the query. $prop: 'width' ('width' | 'height') The property (width or height) to test against, for a result of e.g. (min-width: 30em). Examples scss @include tools.between(30em, 50em) { html { background: yellow; } } css compiled @media (min-width: 30em) and (max-width: 49.99em) { html { background: yellow; } } scss tools.$breakpoints: ( 'red': 30em, 'green': 50em, ); @include tools.between('red', 'green') { html { background: yellow; } } css compiled @media (min-width: 30em) and (max-width: 49.99em) { html { background: yellow; } } Requires @function break() @function nudge-query() [private] Query Utils $adjust-query-overlap ('min' | 'max' | false) scss $adjust-query-overlap: 'max' !default; When using both min- and max- media-queries, you will often get a 1px or 1em overlap where neither or both queries are applied. In order to avoid that, we nudge the max- value down by default. Set this variable to min to nudge min- values up, or false to keep both min and max values un-adjusted, Since 2.0.0: NEW: Allows you to override global max-adjustment default Related Prevent Double Breakpoints [external]"},"layout-z-index.html":{"filename":"layout-z-index.html","title":"Z-Index","contents":"$z-index (list) scss $z-index: (); A list of named z-index layers, from lowest to highest index. Nest lists (one level only) to establish a new z-index context: The first item will be indexed based on top-level list position, while additional values are indexed by their position in the nested list. Example scss $z-index: ( 'main', // 1 'sidebar', // 2 'banner' 'active-nav' 'dropdown', // 3 1 2 'message', // 4 'modal', // 5 ); Used By @function z-index() @function z-index() Return the numeric index of a named layer in your $z-index variable. Since 1.0.0: No longer type-check output, to allow CSS variables and other non-number values Parameters & Return $layer: (string) The name of a z-index layer in your configuration. @return (number) The z-index value associated with the given layer in your configuration. Requires $z-index (list) Used By @mixin z-index() @mixin z-index() Output the z-index property and value of a given layer in your $z-index configuration. Parameters & Output $layer: (string) The name of a z-index layer in your configuration. {CSS output} (code block) The z-index property with a value based on your configuration. Requires @function z-index()"},"layout.html":{"filename":"layout.html","title":"QuickStart: Layout","contents":"QuickStart: Layout Tools for managing CSS layout: Organize named z-index values in a list Manage all breakpoints in a map, and access with media-query helpers Import If you already imported accoutrement/sass/tools you are ready to go. You can also import the layout module on its own: @use '/accoutrement/sass/layout'; Media Queries Establish your media-query breakpoints, or use sizes from Accoutrement Scale directly: $sizes: ( 'page': 36rem, ); $breakpoints: ( 'banner-text': 24em, ); Access your breakpoints with above(), below(), and between() mixins: .banner-text { display: none; @include above('banner-text') { display: block; } } .container { @include below('page') { padding: .5em; } } We remove .09em or 1px from max-width queries, to account for media-query overlap issues."},"LICENSE.html":{"filename":"LICENSE.html","title":"MIT License","contents":"MIT License Copyright © 2018–2020 OddBird Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE."},"ratio-tokens.html":{"filename":"ratio-tokens.html","title":"Ratio Tokens","contents":"Ratio Tokens All the tools you need to define and access ratios using the token syntax. $ratios (map) scss $ratios: () !default; Define your own ratios, or alias built-in named ratios (all provided names are prefixed with _ in token maps). Example scss tools.$ratios: ( 'line-height': calc(1 / 3), 'hero': 1.778, 'card': '#_golden', ); Related prose Used By @mixin add-ratios() @function ratio() Retrieve a scale ratio by name from either the $_DEFAULT-RATIOS or user $ratios configurations. Since 1.0.0: NEW: Accepts $do map argument, for on-the-fly adjustments NEW: Accepts $source map argument, for custom source-palette Parameters & Return $ratio: (string | number) The key-name or value of a ratio $do: null (map | null) A map of function/ratio adjustments to run on the returned value $source: $ratios (map) Optional accoutrement-format map of ratios to use as the origin palette (in addition to the provided defaults) @return (number) The numeric value of a ratio Example scss /* _octave: #{tools.ratio('_octave')} */ /* _fifth: #{tools.ratio('_fifth')} */ css compiled /* _octave: 2 */ /* _fifth: 1.5 */ Requires @function get() [private] $named-ratios Used By @function is-ratio() @mixin add-ratios() Merge individual ratio maps into the global $ratio variable. This can be useful for internal organization, documentation with SassDoc, or integration with our pattern-library generator: Herman. Parameters & Output $maps: (map...) Pass any number of maps to be merged. {CSS output} (code block) An updated global $ratios variable, with new maps merged in. Requires @function multi-merge() $ratios (map) @function is-ratio() Check to see if a ratio is valid, converting tokens in the process. Since 4.0.0: NEW: Provides type-checking of ratios in addition to converting ratio tokens. Parameters & Return $ratio: (string | number) The key-name or value of a ratio $source: $ratios (map) Optional accoutrement-format map of ratios to use as the origin palette (in addition to the provided defaults) $allow-tokens: true (bool) Optionally turn off token-parsing. @return (number | 'linear' | false) The numeric value of a ratio, the ‘linear’ keyword, or false if the value is not a valid ratio. Example scss /* _octave: #{tools.is-ratio('_octave')} */ /* 1.4: #{tools.is-ratio(1.4)} */ /* linear: #{tools.is-ratio('linear')} */ /* blue: #{tools.is-ratio(blue)} */ css compiled /* _octave: 2 */ /* 1.4: 1.4 */ /* linear: linear */ /* blue: false */ Requires @function check() [private] @function ratio() Used By @function scale()"},"ratio-vars.html":{"filename":"ratio-vars.html","title":"Ratio Tokens » CSS Variables","contents":"Ratio Tokens » CSS Variables $ratio-var-prefix (string) scss $ratio-var-prefix: 'ratio-' !default; Set a prefix for all ratio-tokens, and we’ll apply it when setting or calling css variables based on your ratio maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$ratios: ('my-ratio': 0.875); tools.$ratio-var-prefix: 'prefix_'; html { @include tools.ratios--; } css compiled html { --prefix_my-ratio: 0.875; } Used By @mixin ratios--() @mixin ratio--() @function var-ratio() @mixin ratios--() Convert any ratio-map into CSS variables, using the global $ratio-var-prefix. Ratio names that start with _ or - are considered “private” and will not be output as variables Ratios that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $ratios (map) Optionally use a custom map of ratios to set as css variables {CSS output} (code block) Custom properties for all public ratios in the map Example scss tools.$ratios: ( 'my-golden': 1.61803399, 'line-height': '#_major-third', ); html { @include tools.ratios--; } css compiled html { --ratio-my-golden: 1.61803399; --ratio-line-height: 1.25; } Requires $named-ratios $ratio-var-prefix (string) @mixin ratio--() Set a single custom property based on a ratio token, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $ratio: (*) Ratio name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $ratio $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $ratios (map) Optional map of ratios to use as a palette source Example scss tools.$ratios: ( 'my-golden': 1.61803399, 'line-height': '#_major-third', ); .example { @include tools.ratio--('my-golden'); @include tools.ratio--('gutter', 'line-height', 1.4em); } css compiled .example { --ratio-my-golden: 1.61803399; --ratio-gutter: var(--ratio-line-height, 1.4em); } Requires $named-ratios $ratio-var-prefix (string) @function var-ratio() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $ratio: (*) Ratio name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: (map) Optional Accoutrement map of ratios to use as source @return (string) CSS variable call, in the format: var(--, ) Example scss tools.$ratios: ( 'my-golden': 1.61803399, 'line-height': '#_major-third', ); .example { line-height: tools.var-ratio('line-height'); padding-bottom: calc(1 / #{tools.var-ratio('my-golden', 1.6)} * 100%); } css compiled .example { line-height: var(--ratio-line-height, 1.25); padding-bottom: calc(1 / var(--ratio-my-golden, 1.6) * 100%); } Requires @function var-token() $named-ratios $ratio-var-prefix (string)"},"ratios.html":{"filename":"ratios.html","title":"Built-In Ratios","contents":"Built-In Ratios Some built-in named ratios you can use, either directly or through the token syntax (where these values are provided with a _ prefix). Since 4.0.0: NEW: Now available as individual variables (without the _ prefix) Example scss @use 'ratio/named'; @each $name, $value in meta.module-variables('named') { /*! $#{$name}: #{$value}; */ } css compiled /*! $octave: 2; */ /*! $major-seventh: 1.875; */ /*! $minor-seventh: 1.7777777778; */ /*! $major-sixth: 1.6666666667; */ /*! $minor-sixth: 1.6; */ /*! $fifth: 1.5; */ /*! $augmented-fourth: 1.40625; */ /*! $fourth: 1.3333333333; */ /*! $major-third: 1.25; */ /*! $minor-third: 1.2; */ /*! $major-second: 1.125; */ /*! $minor-second: 1.0666666667; */ /*! $photo: 1.5; */ /*! $classic: 1.3333333333; */ /*! $widescreen: 1.7777777778; */ /*! $cinema: 2.39; */ /*! $golden: 1.61803399; */ Used By @function ratio() @mixin ratios--() @mixin ratio--() @function var-ratio()"},"scale-sizes.html":{"filename":"scale-sizes.html","title":"Size Maps","contents":"Scale Configuration $sizes (map) scss $sizes: ( 'root': $accoutrement-browser-default-font-size, ) !default; Defined a palette of common sizes to be used across your project, in the format “name: size” or “name: basis (ratio/function: value)”. If your map includes a px-comparable value for root, it will be used in relative-size unit conversions. Named sizes can contain length values (24px), reference to previously-defined sizes ('root'), a map of relative-adjustments using ratios (('_golden': 2)) and math functions (('plus': 2)), or a format-string & list for interpolating calc() values ('calc(%s + %s)' ('#root', 2vw)). Internal math functions are always available by name, but recent versions of Sass require you to capture 3rd-party functions using the get-function($name) syntax before calling them. To simplify your maps, we recommend using the $functions map to store captured functions in one place, where we can continue to retrieve them by name. Map Properties 'root': 16px (Map) Include a root font-size for your document, used for calculating relative sizes. This should match the size applied to your html element. Example scss $sizes: ( 'root': 24px, 'text': '#root' ('convert-units': 'em'), 'h1': '#root' ('times': 2), 'calc': 'calc(%s + %s)' ('%s': '#root' 2vw), ); Used By @function break() @mixin add-sizes() @function convert-units() @mixin add-sizes() Merge individual size maps into the global $sizes variable, in case you want to define sizes in smaller groups such as text-sizes, spacing-sizes, etc before merging them into a single global size-palette. This can be useful for internal organization, documentation with SassDoc, or integration with our pattern-library generator: Herman. Parameters & Output $maps: (map...) Pass any number of maps to be merged. {CSS output} (code block) An updated global $sizes variable, with new maps merged in. Example scss $text-sizes: ( 'root': 24px, 'h1': '#root' ('times': 2), ); @include tools.add-sizes($text-sizes); Requires @function multi-merge() $sizes (map) Accessing Sizes @function size() Access a named size in your $sizes map, using any comparable units. Since 1.0.0: BREAKING: The previous $units… vararg has been replaced with $do map argument, for flexible on-the-fly adjustments. Non-map $do values are converted to ('convert-units': $do) before processing, to provide a shortcut for unit-conversions. size('root', 'cm') will continue to work, but size('root', 'em', 10px) should be changed to size('root', 'em' 10px) (with all unit args in a single list) NEW: Accepts $source map argument, for custom source-palette Parameters & Return $size: (string) The name of any size in your configuration $do: null (map | unit-args | null) A map of function/ratio adjustments to run on the returned value, or a unit followed by any necessary arguments for conversion $source: $sizes (map) Optional accoutrement-format map of sizes to use as the origin palette @return (length) The calculated length, in the requested units. Requires @function compile() @function get() [private] Used By @function scale() @function negative() @mixin square() @function convert-units() @function negative() Return the inverse value of any length, in comparable units. Since 1.0.0: BREAKING: The previous $units… vararg has been replaced with $do map argument, for flexible on-the-fly adjustments. Non-map $do values are converted to ('convert-units': $do) before processing, to provide a shortcut for unit-conversions. size('root', 'cm') will continue to work, but size('root', 'em', 10px) should be changed to size('root', 'em' 10px) (with all unit args in a single list) NEW: Accepts $source map argument, for custom source-palette Parameters & Return $size: (string | length | list) The name of a size in your configuration (e.g. line-height), or a length to be converted into different units (e.g. 24px), or a base-size and adjustments to be made (e.g. 24px ('_minor-third': 2)). For the sake of consistent documentation, I recommend keeping adjustments in the configuration whenever possible. $do: null (map | unit-args | null) A map of function/ratio adjustments to run on the returned value, or a unit followed by any necessary arguments for conversion $source: $sizes (map) Optional accoutrement-format map of sizes to use as the origin palette @return (length) The calculated negative length, in the requested units. Requires @function size() @mixin square() Create a square by setting equal CSS height and width properties with the given size & unit value. Since 1.0.0: BREAKING: The previous $units… vararg has been replaced with $do map argument, for flexible on-the-fly adjustments. Non-map $do values are converted to ('convert-units': $do) before processing, to provide a shortcut for unit-conversions. size('root', 'cm') will continue to work, but size('root', 'em', 10px) should be changed to size('root', 'em' 10px) (with all unit args in a single list) NEW: Accepts $source map argument, for custom source-palette Parameters & Output $size: (string | length | list) The name of a size in your configuration (e.g. line-height), or a length to be converted into different units (e.g. 24px), or a base-size and adjustments to be made (e.g. 24px ('_minor-third': 2)). For the sake of consistent documentation, I recommend keeping adjustments in the configuration whenever possible. $do: null (map | unit-args | null) A map of function/ratio adjustments to run on the returned value, or a unit followed by any necessary arguments for conversion $source: $sizes (map) Optional accoutrement-format map of sizes to use as the origin palette {CSS output} (code block) Equal CSS height and width properties, set to the given size and units. Requires @function size()"},"scale-units.html":{"filename":"scale-units.html","title":"Unit Conversion","contents":"Converting Units @function convert-units() Convert lengths between comparable units. You can also convert to browser-ems, relative to the browser default rather than the site root – useful for media queries. Aliased as convert-units, convert, units, and to in all Accoutrement maps. Since 1.0.0: NEW: Aliased as to in accoutrement-maps Parameters & Return $length: (length | string) The length or named size to be converted. $to-unit: (string) The desired units to convert to. Some units (ch, vw, vh, vmin, vmax) cannot be converted. $from-context: false (length | string) When converting from relative units, the absolute length (in px) to which $length refers - e.g. for $lengths in em units, would normally be the font-size of the current element. false and null will resolve to your ‘root’ setting or 16px $to-context: $from-context (length | string) For converting to relative units, the absolute length in px to which the output value will refer. Defaults to the same as $from-context, since it is rarely needed. @error Context parameters must resolve to a value in pixel units Requires @function size() @function get-number() [private] @function get() [private] @function get-px() [private] @function error() [private] $sizes (map) $accoutrement-browser-default-font-size [private]"},"scale-vars.html":{"filename":"scale-vars.html","title":"Sizes » CSS Variables","contents":"Sizes » CSS Variables $size-var-prefix (string) scss $size-var-prefix: 'size-' !default; Since CSS variables are often defined in a global space, it can be useful to prefix different variable types. Accoutrement maps help solve that problem in Sass, so we wanted to carry that over into our CSS variable support. Set a prefix for all size-tokens, and we’ll apply it when setting or calling CSS variables based on your size maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$sizes: ('my-size': 3em); tools.$size-var-prefix: 'prefix_'; html { @include tools.size--('my-size') } css compiled html { --prefix_my-size: 3em; } Used By @mixin sizes--() @mixin size--() @function var-size() @mixin sizes--() Convert any size-map into CSS variables, using the global $size-var-prefix. Size names that start with _ or - are considered “private” and will not be output as variables Sizes that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $sizes (map) Optionally use a custom map of sizes to set as css variables {CSS output} (code block) Custom properties for all public sizes in the map Example scss tools.$sizes: ( '_root': 16px, 'rhythm': '#_root' ('times': 1.5), 'line': '#rhythm', ); html { @include tools.sizes--; } css compiled html { --size-rhythm: 24px; --size-line: var(--size-rhythm, 24px); } Requires $size-var-prefix (string) @mixin size--() Set a single custom property based on a map-size, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $size: (*) Size name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $size $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $sizes (map) Optional map of sizes to use as a palette source Example scss tools.$sizes: ( '_root': 16px, 'rhythm': '#_root' ('times': 1.5), 'line': '#rhythm', ); .example { @include tools.size--('line'); @include tools.size--('padding', 'line', 1.5rem); } css compiled .example { --size-line: var(--size-rhythm, 24px); --size-padding: var(--size-line, 1.5rem); } Requires $size-var-prefix (string) @function var-size() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $size: (*) Size name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: (map) Optional Accoutrement map of sizes to use as source @return (string) CSS variable call, in the format: var(--, ) Example scss tools.$sizes: ( '_root': 16px, 'rhythm': '#_root' ('times': 1.5), 'line': '#rhythm', ); .example { line-height: tools.var-size('line'); padding: tools.var-size('rhythm', 1.5em); } css compiled .example { line-height: var(--size-line, 24px); padding: var(--size-rhythm, 1.5em); } Requires @function var-token() $size-var-prefix (string)"},"scale.html":{"filename":"scale.html","title":"QuickStart: Scale","contents":"QuickStart: Scale Sass size & scale management tools: Gather all your sizes into a single map Generate new sizes based on modular scales or arbitrary functions Convert between relative units Access sizes on the fly Import If you already imported accoutrement/sass/tools you are ready to go. You can also import the scale module on its own: @use '/accoutrement/sass/scale'; Sizes & Ratios Establish your palette of ratios [modular scales] and sizes: $ratios: ( 'my-ratio': 1.25, ); $sizes: ( // define explicit values 'root': 24px, 'icons': 1em, 'page': 8in, // reference existing sizes 'text': '#root' // apply adjustments and conversions // using named-ratios or arbitrary functions 'rhythm': '#root' ('_fifth': 1, 'convert-units': 'rem'), 'h1': '#root' ('my-ratio': 3), 'h2': '#root' ('my-ratio': 2), 'h3': '#root' ('my-ratio': 1), // define calc() output based on existing sizes 'viewport-relative': 'calc(%s + %s)' ('%s': '#root' 2vw), ); Access your named sizes using the size() function, and even convert-units on-the-fly: .example { font-size('text'); width: size('page', 'px'); } @function scale() Apply a modular or linear scale to any value, moving up or down the scale by a given number of steps. (linear scaling is simple multiplication, and may not be particularly useful where the scale is known). Since 4.0.0: NEW: Provides direct access to scales, without needing to use the token map. Parameters & Return $value: (token | number) The original value to be scaled $ratio: (token | number | 'linear') The key-name or value of a ratio $steps: (number) The number of steps to move along a scale $source: ratio.$ratios (map) Optional accoutrement-format map of ratios to use as the origin palette (in addition to the provided defaults) @return (number) The scaled value. @error Ratio must be either a number or “linear” Example scss /* _widescreen: #{tools.scale(700px, '_widescreen')} */ /* 1.4: #{tools.scale(24px, 1.4, -1)} */ /* linear: #{tools.scale(16px, 'linear', 2)} */ css compiled /* _widescreen: 1244.4444444444px */ /* 1.4: 17.1428571429px */ /* linear: 32px */ Requires @function check() [private] @function size() @function error() [private] @function is-ratio()"},"token-api.html":{"filename":"token-api.html","title":"Accessing Tokens","contents":"Token Maps We use “token” as a generic term for named values inside accoutrement maps. In the following map, root and gutter are considered accoutrement-tokens: $map: ( 'root': 16px, 'gutter': 1em, ); Our core API provides token-map syntax parsing, and general token access with get-token() (below). Additional plugins provide shortcuts and utilities for managing and accessing common token-types, like colors, fonts, sizes, and animations. Internal Reference The core module provides a generic map-parsing syntax, for internal reference & adjustments – establishing dynamic relationships between map values. To reference another key in the same map, use the #tag hashtag format: // 'gutter' == 16px $map: ( 'root': 16px, 'gutter': '#root', ); Reference hashtags don’t have to stand alone, but can be embedded inside a longer string: // 'responsive' == calc(16px + 1vw) $map: ( 'root': 16px, 'scale': 1vw, 'responsive': 'calc(#root + #scale)', ); Nested References You can define nested tokens in accoutrement maps, and access them using a #first->second->third syntax: // 'large-screen->h2' == 24px $sizes: ( 'root': 16px, 'headings': ( 'h1': '#root' ('times': 2), 'h2': '#root' ('times': 1.5), ), 'pull-quote': '#headings->h2', ); All -> nested references are resolved relative to the outermost map: // 'large-screen->text' == 24px $map: ( 'root': 16px, 'large-screen': ( 'root': 24px, 'text': '#large-screen->root' ), ); Since 2.0.0: Functional Adjustments In many cases, we’ll want to reference a value and then make adjustments to it. The explicit long-hand syntax uses a map with '%value' as the first key. Each additional key provides a function name along with arguments for that function: // convert-units(16px, 'rem') $map: ( 'root': 16px, 'gutter': ( '%value': '#root', 'times': 1.5, 'convert-units': 'rem', ), ); You can also string together multiple functions, to create more complex relationships: // convert-units(times(16px, 1.5), 'rem') $map: ( 'root': 16px, 'gutter': ( '%value': '#root', 'times': 1.5, 'convert-units': 'rem', ), ); Each function in the function map (e.g. times & convert-units above) will be run in order – with any associated arguments included. The value is always passed as the first argument. Adjustment Shorthand We also provide a shorthand syntax to simplify adjustments in most cases. Here, the value is written first (any data type), and a map of adjustments can be provided at the end of the definition: $map: ( 'root': 16px, 'gutter': '#root' ('times': 1.5, 'convert-units': 'rem'), ); Adjustments with References Adjustment-function arguments can also reference keys in the map. In this example, we’re multiplying the root & line-height values to generate a rhythm token. $map: ( 'root': 16px, 'line-height': 1.4, 'rhythm': '#root' ('times': '#line-height'), ); String Interpolation For CSS features like calc() you can create format-strings and interpolate values into the string. Use %s as a placeholder, and call the interpolate (or %s) adjustment function with replacement values for each placeholder: $map: ( 'root': 16px, 'scale': 1vw, 'responsive': ( '%value': 'calc(%s + %s)', '%s': '#root' '#scale', ), ); Related @function interpolate() Nested Adjustments Since adjustment formats and values are parsed the same as any other value, it’s possible to build quite complex adjustments: $map: ( 'root': 16px, 'scale': 1vw, 'responsive': ( '%value': 'calc(%s + %s)', '%s': ( '#root' ('convert-units': 'rem'), '#scale' ('times': 2), ), ), ); Escaping References If you need to use the # character without creating an alias reference, you can prefix it with an (also-escaped) back-slash: 'this is \\\\#not-an-alias' If you need to end an alias without using punctuation or spaces, the same double-escape can be used: '#alias\\\\not-part-of--alias' Since 2.2.0: NEW: Added to help manage more complex missing-key options @function get() The primary function for accessing and parsing accoutrement map-syntax values. Each accoutrement plugin provides a shortcut function for the specific map associated with that data-type. You can do the same, or use it directly to turn any arbitrary map into an accoutrement map. Since 4.0.0: BREAKING: Name changed from get-token to get BREAKING: The $key value must be a token name for lookup, not a raw token value to be compiled (see the compile() function) Since 2.0.0: NEW: Handles access to nested-map tokens using the get-token($map, 'first->second->third') syntax Since 1.0.0: NEW: Accepts $do map argument, for on-the-fly adjustments Parameters & Return $map: (map) A map of token definitions to reference against $key: (*) A key to get from the map (can use nested key->subkey syntax) $do: (map | null) A map of functional adjustments to run on the returned value @return (*) The parsed value of any key in a given map Examples scss Access a map directly $map: ( 'original-value': 3em, 'new-value': '#original-value' ( 'times': 2, 'minus': 0.5 ), ); /*! New Value: #{tools.get($map, 'new-value')} */ css compiled /*! New Value: 5.5em */ scss Access nested-map tokens $map: ( 'outer': ( 'inner': 2, ), ); /*! Inner: #{tools.get($map, 'outer->inner')} */ css compiled /*! Inner: 2 */ scss Write your own shortcut plugin for specific maps @function get($key) { @return tools.get($my-map, $key); } $my-map: ('main': 32em); /*! Main: #{get('main')} */ css compiled /*! Main: 32em */ Requires @function lookup-alias() [private] @function compile-token() [private] @function set() [private] $_memo [private] @function compile() Allows you to compile arbitrary token values in reference to a map, without the initial step of referencing a single key. Since 4.0.0: NEW: Added to handle direct token parsing, without map-key lookup Parameters & Return $map: (map) A map of token definitions to reference against $token: (*) The original key to get from the map @return (*) The parsed value of any key in a given map Example scss Access a map directly $map: ( 'original-value': 3em, ); $token: '#original-value' ( 'times': 2, 'minus': 0.5 ); /*! New Value: #{tools.compile($map, $token)} */ css compiled /*! New Value: 5.5em */ Requires @function compile-token() [private] Used By @function color() @function break() @function size()"},"token-config.html":{"filename":"token-config.html","title":"Tokens Configuration","contents":"$handle-missing-keys (string | null) scss $handle-missing-keys: null !default; A configuration option to optionally trigger warnings or errors when a token is not found: null [default]: Will silently return null (mimicking the built-in Sass map.get() function) warn: Will also throw a warning error: Will throw an error, and stop compilation Since 4.0.0: BREAKING: Removed the silent option, to match built-in Sass map access behavior Since 2.2.0: NEW: Provides authors with more Sass-like behavior, and more options for managing or testing when a key lookup fails Author: James Camilleri Used By @function has-token() @function has-alias() [private] @function lookup-alias() [private]"},"token-inspect.html":{"filename":"token-inspect.html","title":"Inspecting Tokens","contents":"Inspecting Tokens Tools for inspecting accoutrement map token meta-data, useful for building more complicated logic for automation and integrations. @function is-private-token() Check if a token key is marked as private with _ or - as the starting character Since 2.0.0: NEW: Initial release Parameters & Return $key: (*) The token key to check for private prefix (only string and list keys can be marked as private) @return (boolean) True if the key is private, otherwise false Example scss /*! #{tools.is-private-token('_private-token')} */ /*! #{tools.is-private-token('public-token')} */ css compiled /*! true */ /*! false */ Used By @function var-contrast() @function is-alias-for() @mixin tokens--() @mixin import-webfonts() @function font-name() [private] @function is-alias-for() Find if a token is simply an alias, and (if so) what token it represents – either directly, or following the thread to it’s origin. Since 2.0.0: NEW: Initial release Parameters & Return $map: (map) A map of terms to reference against $token: (*) The token name to be traced $origin: false (*) False to trace the alias one step back, or true to trace an alias thread back to the original source token @return (*) false for non-alias tokens, or the name of an alias source (either one step back, or the full origin of multiple aliases) Example scss $colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand', 'border': '#text', 'outline': '#border', ); /*! _brand: #{tools.is-alias-for($colors, '_brand')} */ /*! text: #{tools.is-alias-for($colors, 'text')} (_brand is private) */ /*! border: #{tools.is-alias-for($colors, 'border')} */ /*! outline: #{tools.is-alias-for($colors, 'outline', $origin: true)} */ css compiled /*! _brand: false */ /*! text: false (_brand is private) */ /*! border: text */ /*! outline: text */ Requires @function get() [private] @function is-private-token() Used By @mixin token--() @mixin import-webfonts() @function font-name() [private] @function font-values() [private] @function has-token() Find if a token exists in a given map. Since 4.0.0: NEW: Provides a token-syntax-aware alternative to the Sass internal map.has-key() function. Parameters & Return $map: (map) A map of terms to reference against $token: (*) The token name or path (using ->) to lookup $nested...: (*) Optionally provide a nested token path as an arglist, rather than using the -> syntax. @return (boolean) Returns true if the requested token exists, or false if there is no token at the given path. Example scss $colors: ( 'brand': hsl(120, 50%, 50%), 'button': ( 'background': '#brand', ) ); /*! brand: #{tools.has-token($colors, 'brand')} */ /*! text: #{tools.has-token($colors, 'text')} */ /*! button->background: #{tools.has-token($colors, 'button->background')} */ /*! (button, background): #{tools.has-token($colors, 'button', 'background')} */ css compiled /*! brand: true */ /*! text: false */ /*! button->background: true */ /*! (button, background): true */ Requires @function lookup-alias() [private] $handle-missing-keys (string | null) Used By @function default-contrast() [private]"},"token-internal.html":{"filename":"token-internal.html","title":"Pre-Registered Functions","contents":"Registered Functions We provide a number of pre-registered functions to help with token management, including: All the built-in Sass modules, prefixed with the module name in a dot notation (e.g. 'list.index') All the Accoutrement utilities and individual module functions. A number of math helpers listed below… Example scss $sizes: ( 'text': 14px 16px 24px, 'small': '#text' ('list.nth': 1), 'medium': '#text' ('list.nth': 2), ); /*! small: #{tools.get($sizes, 'small')} */ /*! medium: #{tools.get($sizes, 'medium')} */ css compiled /*! small: 14px */ /*! medium: 16px */ @function plus() Add two values together in accoutrement maps. Direct access to this function is prefixed, but it is available in all accoutrement maps as 'plus', 'add', or '+'. Parameters & Return $num1: (string | length) The name or length of the size you are adding to $num2: (string | length) The name or length of the size being added @return (number) The calculated results of adding $num1 and $num2 Example scss $sizes: ( 'text': 16px, 'margin': 14px, 'spacer': '#text' ('plus': '#margin'), ); /*! spacer: #{tools.get($sizes, 'spacer')} */ css compiled /*! spacer: 30px */ @function minus() Subtract one value from another in accoutrement maps. Direct access to this function is prefixed, but it is available in all accoutrement maps as 'minus', 'subtract', or '-'. Parameters & Return $num1: (string | length) The name or length of the size you are subtracting from $num2: (string | length) The name or length of the size to subtract @return (number) The calculated results of subtracting $num2 from $num1 Example scss $sizes: ( 'text': 16px, 'margin': 14px, 'shim': '#text' ('minus': '#margin'), ); /*! shim: #{tools.get($sizes, 'shim')} */ css compiled /*! shim: 2px */ @function times() Multiplty two values in accoutrement maps. Direct access to this function is prefixed, but it is available in all accoutrement maps as 'times', 'multiply', or '*'. Parameters & Return $num1: (string | length) The name or length of the size you are multiplying $num2: (string | length) The name or length of the size to use as a multiple @return (number) The calculated results of multiplying $num1 by $num2 Example scss $sizes: ( 'text': 16px, 'double': '#text' ('times': 2), ); /*! double: #{tools.get($sizes, 'double')} */ css compiled /*! double: 32px */ @function divide() Divide two values in accoutrement maps. Direct access to this function is prefixed, but it is available in all accoutrement maps as 'divide', or '/'. Parameters & Return $num1: (string | length) The name or length of the size you are dividing $num2: (string | length) The name or length of the size to use as a division @return (number) The calculated results of dividing $num1 by $num2 Example scss $sizes: ( 'text': 16px, 'half': '#text' ('divide': 2), ); /*! half: #{tools.get($sizes, 'half')} */ css compiled /*! half: 8px */ @function modulo() Divide two values in accoutrement maps, and return the remainder. Direct access to this function is prefixed, but it is available in all accoutrement maps as 'modulo', 'remainder', 'mod', or '%'. Parameters & Return $num1: (string | length) The name or length of the size you are dividing $num2: (string | length) The name or length of the size to use as a division @return (number) The modulo of two numbers Example scss $sizes: ( 'text': 16px, 'mod': '#text' ('modulo': 3), ); /*! mod: #{tools.get($sizes, 'mod')} */ css compiled /*! mod: 1px */"},"token-register.html":{"filename":"token-register.html","title":"Function Registration","contents":"Function Registration Because Sass 3.5+ requires first-class functions, we provide tools for capturing functions and making them available to the Accoutrement map parser. This also provides the ability to alias functions as you like. $functions (map) scss $functions: () !default; We provide a single map to store & manage functions that you would like to use inside Accoutrement maps. $functions: ( 'inspect': meta.get-function('inspect', $module: 'meta'), ); Functions can be registered multiple times, under any aliases, but function maps are not able to use the alias syntax. Since 0.1.0: NEW: Supports the core map-reference syntax, for creating function aliases Map Properties : (function) Each alias key in the map should refer to a captured function Used By @function get() [private] @mixin register() @mixin register() Register functions with accoutrement. Parameters & Output $function: (function) The first-class function to be registered $names...: $function (strings) One or more alias names (strings) to use for map-access to the function {CSS output} (code block) {map} $_ACCOUTREMENT_APP - Functions are registered in a map under any number of aliases Requires @function set() [private] $functions (map)"},"token-vars.html":{"filename":"token-vars.html","title":"Tokens » Custom Properties","contents":"Tokens » Custom Properties There are many cases where it can be useful to convert a Sass token map into CSS custom properties. Here are some tools to help. @mixin token--() Set a single custom property based on a map-token, with optional alias, fallback, and prefixing Since 2.0.0: NEW: Initial release Parameters $map: (map) Accoutrement map of tokens to use as source $token: (*) Token name available in the source $map $value: null (string | null) Optional new value for the given token $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $prefix: null (string | null) Optional prefix used for naming token variables Example scss $colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('color.scale': ('lightness': -50%)), 'border': '#text', ); .example { @include tools.token--($colors, 'border'); @include tools.token--($colors, 'outline', 'border', red); } css compiled .example { --border: var(--text, #206020); --outline: var(--border, red); } Requires @function ident() @function is-alias-for() @function var-token() @function get() [private] Used By @mixin tokens--() @mixin tokens--() Convert any Accoutrement Tokens map into CSS custom properties (aka variables). Token names that start with _ or - are considered “private” and will not be output as variables Tokens that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $map: (map) Accoutrement map of tokens to set as css variables $prefix: null (string | null) Optional prefix for naming token variables {CSS output} (code block) Custom properties for all public tokens in the map Example scss $colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('color.scale': ('lightness': -50%)), 'border': '#text', ); html { @include tools.tokens--($colors, 'color-'); } css compiled html { --color-text: #206020; --color-border: var(--color-text, #206020); } Requires @mixin token--() @function is-private-token() @function var-token() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $map: (map) Accoutrement map of tokens to use as source $token: (*) Token name available in the source $map $fallback: true (*) The optional fallback value for a var() function: true will try to generate a fallback based on the color value A color name will fallback to the value of that css-variable and then to the color’s calculated value Any other fallback will be passed through unchanged $prefix: null (string | null) Optional prefix used for naming token variables @return (string) CSS variable call, in the format: var(--, ) Example scss $colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('color.scale': ('lightness': -50%)), 'border': '#text', ); .example { border-color: tools.var-token($colors, 'border'); color: tools.var-token($colors, 'text', black); } css compiled .example { border-color: var(--border, #206020); color: var(--text, black); } Requires @function ident() @function get() [private] Used By @function var-change() @function var-ease() @function var-time() @function var-color() @function var-ratio() @function var-size() @mixin token--() @function var-font()"},"tokens.html":{"filename":"tokens.html","title":"QuickStart: Tokens","contents":"QuickStart: Tokens Accoutrement tokens provide a custom syntax, using Sass Maps to define “tokens” of various types: $sizes: ( 'root': 16px, 'gutter': 1em, ); Tokens provide design abstractions, that can be easily reused across a product or design system. There are several reasons for this approach: Sass Maps provide a format that is readable by both humans & machines All related values are stored in a single variable, with explicit relationships intact We can build automation tools around meaningful token-groups, from font-imports to generated style guides Unlike YAML, JSON, and other object languages, Sass is a style language that understands the values involved, and provides specific tools for maintaining those values Note: We no longer use token maps internally at OddBird, since Sass “modules” now provide a way to group & namespace normal Sass variables in a meaningful way, and access module variables as a map. By relying on core Sass features, we avoid any confusion around the custom token syntax. Since 4.0.0: BREAKING: The $functions map no longer accepts alias references or any other aspects of the token syntax BREAKING: Ratios are no longer first-class adjustments (like functions) in the token syntax BREAKING: tokens.$handle-missing-keys defaults to null, and no longer supports the legacy silent option. BREAKING: get-token() is renamed get(), and only accepts bare token names (no # prefix), including the outer->inner nested token syntax. NEW: The new compile() function provides direct access to parse & resolve an arbitrary token value (including aliases with # prefix), rather than calling a specific token by name. NEW: All the built-in Sass module functions are registered by default, as . NEW: has-token() function checks a map to see if the given token is defined, and supports the outer->inner nested token syntax. Import If you already imported accoutrement/sass/tools you are ready to go. If you want to import the tokens alone: @import '/accoutrement/sass/tokens'; If you’re using Eyeglass, you can leave off most of the path: @import 'accoutrement/tokens'; Token Maps Using the map syntax, we can create named tokens for any related values: $colors: ( 'brand': rgb(13, 127, 165), 'text': black, ); We can also create alias tokens and explicit relationships, using a #token hashtag syntax: $colors: ( 'brand': rgb(13, 127, 165), 'accent': '#brand', 'text': '#accent' ('shade': 75%), ); Those relationships will be calculated at compile-time, using the token.get() function (or shortcut functions provided by plugins): html { color: token.get($colors, 'text'); } See Token Maps documentation for more detail. Tokens » CSS Variables CSS Variables provide a DOM-aware alternative to the pre-processed Sass variables we use to store tokens. Rather than using one or the other, we recommend defining tokens in Sass (where relationships can be stored in an abstract format), and then generating CSS Variables as-necessary. See CSS Variables documentation for more detail. Example scss $colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); html { // generate CSS Variables based on the map above… @include tools.tokens--($colors); // access CSS Variables with smart fallbacks… border-color: tools.var-token($colors, 'border'); color: tools.var-token($colors, 'text'); } css compiled html { --text: #206020; --border: var(--text, #206020); border-color: var(--border, #206020); color: var(--text, #206020); } Utility Functions We provide a set of built-in math, list, and string helpers – in addition to the functions defined in each module. You can also use the Sass core functions (with appropriate module prefixing), or register your own functions – giving them any alias you like. // Create a map of captured functions $functions: ( 'my-function': meta.get-function('my-function'), 'rgba': meta.get-function('rgba'), ); // Or add functions & aliases using the provided mixin: @include token.register('my-function', 'alias'); Once a function has been registered with accoutrement, it is available to call by name or alias in all token adjustment maps: @include token.register('rgba', 'fade'); $colors: ( 'brand': hsl(120, 50%, 50%), 'background': '#brand' ('fade': 50%), );"},"type-a11y.html":{"filename":"type-a11y.html","title":"Accessibility","contents":"Accessibility A simple set of utilities for handling text-visibility and screen-reader accessibility across your site. @mixin is-hidden() Hide an element using either the clip or position method. Parameters $method: 'clip' ('clip' | 'position') The hiding method to use. Requires @mixin _is-hidden-position() [private] @mixin _is-hidden-clip() [private]"},"type-font-vars.html":{"filename":"type-font-vars.html","title":"Fonts » CSS Variables","contents":"Fonts » CSS Variables $font-var-prefix (string) scss $font-var-prefix: 'font-' !default; Since CSS variables are often defined in a global space, it can be useful to prefix different variable types. Accoutrement maps help solve that problem in Sass, so we wanted to carry that over into our CSS variable support. Set a prefix for all font-tokens, and we’ll apply it when setting or calling CSS variables based on your font maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$fonts: ( 'my-font': ( 'stack': (arial, helvetica, sans-serif), ) ); $font-var-prefix: 'prefix_'; html { @include tools.font--('my-font') } css compiled html { --font-my-font: my-font, arial, helvetica, sans-serif; } Used By @mixin fonts--() @mixin font--() @function var-font() @mixin fonts--() Convert any font-map into CSS variables, using the global $font-var-prefix. Font names that start with _ or - are considered “private” and will not be output as variables Fonts that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $fonts (map) Optionally use a custom map of fonts to set as css variables $use: 'stack' (string | list) Font-map value (such as ‘name’ or ‘stack’) to use as custom-property values {CSS output} (code block) Custom properties for all public fonts in the map Example scss $fonts: ( '_TestFont': ( 'name': 'My Test Font', 'stack': ('Georgia', 'serif'), ), 'text': '#_TestFont', 'sans': '#text', ); html { @include tools.fonts--; } Requires @function font-values() [private] $font-var-prefix (string) @mixin font--() Set a single custom property based on a map-font, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $font: (*) Font name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $font $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that CSS variable and then to the token’s calculated value Any other fallback will be passed through unchanged $use: 'stack' (string | list) Font-map value (such as ‘name’ or ‘stack’) to use as custom-property values $source: $fonts (map) Optional map of fonts to use as a palette source Example scss tools.$fonts: ( '_TestFont': ( 'name': 'My Test Font', 'stack': ('Georgia', 'serif'), ), 'text': '#_TestFont', 'sans': '#text', ); .example { @include tools.font--('text'); @include tools.font--('headline', 'sans', sans-serif); } css compiled .example { --font-text: \"My Test Font\", Georgia, serif; --font-headline: var(--font-sans, sans-serif); } Requires @function font-values() [private] $font-var-prefix (string) @function var-font() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $font: (*) Font name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $fonts (map) Optional Accoutrement map of fonts to use as source $use: 'stack' (string | list) Font-map value (such as ‘name’ or ‘stack’) to use as custom-property values @return (string) CSS variable call, in the format: var(--, ) Example scss $fonts: ( '_TestFont': ( 'name': 'My Test Font', 'stack': ('Georgia', 'serif'), ), 'text': '#_TestFont', 'sans': '#text', ); .example { font-family: tools.var-font('sans', sans-serif); } css compiled .example { font-family: var(--font-sans, sans-serif); } Requires @function font-values() [private] @function var-token() $font-var-prefix (string)"},"type-fonts.html":{"filename":"type-fonts.html","title":"Font Maps","contents":"WebFonts Webfont configuration is most useful for handling any font that requires @font-face importing – locally-hosted files, base64 data, etc. But collecting all your font data in a single location allows us to automate various actions: @font-face imports, font-family fallback stacks, font aliases (for semantic access), or even documentation and font-specimens with a tool like Herman. We provide options for maintaining various font-types, from locally-hosted, to base64 embedded, and even CDN imports from sites like typekit and google fonts. $font-path (string) scss $font-path: '' !default; The path to your fonts directory, often relative to your output CSS. This base-path will be added to the start of every relative font-path given in your $fonts map - an optional shortcut to keep from writing long and repetitive paths for every font. Since type-4.0.0: BREAKING: The default changed from '../fonts/' to '' – so that no path is added unless explicitly requested. Example scss $font-path: '../fonts/'; Used By @function font-url() $fonts (map) scss $fonts: () !default; A map for managing all your fonts on a project. By storing this font data in map format, we can automate @font-face imports, call fonts with a semantic access-key, define fallback font-stacks, and generate font specimens with a tool like Herman. All the provided tools will ignore unknown font properties, so you can safely include any extra data you need access to. For example, we often include a source property in our font maps, providing a link to the font foundry, license, or CDN. If you are using Herman to font previews, it will include source links in the output. Since 3.0.0: NEW: Supports display map key for setting CSS font-display property Since 0.1.0: NEW: Supports 'bold italic' weight/style syntax in addition to ('bold', 'italic') BREAKING: Full support for the core map-reference syntax, not just font-name alias reference Since type-4.0.0: BREAKING: Remove the $font-formats variable, and replaced it with a formats property in each individual font map BREAKING: No longer accepts regular as a font-variant, use the CSS-friendly normal instead NEW: Allow explicit configuration maps for each font variant, to support variant-specific local and svgid options, along with the ability to specify explicit urls for each format desired The old string value will be treated the same as a map with only 'path' defined NEW: Supports unicode-range CSS property, as described on MDN Map Properties : (map) Give each font a key for access in the code, with a nested map defining the font details. .name: (string) The actual name of the font-face, if it’s different from the given . .stack: (list) A list of fallback fonts for browsers that can’t load the given webfont. .formats: (list) A list of font formats (e.g. 'woff2' 'eot') to use when interpolating font-file paths for font-face imported fonts. .unicode-range: (list) Optionally import only specific unicode ranges. See MDN unicode-range documentation for details. .display: (string) Optionally set the font-display property when importing web fonts. See MDN font-display documentation for details. .: (string | map) When describing locally-hosted or data-embedded fonts, provide a key for each font-variant to import. Multi-word variants can be written as a list (600 'italic') or a string ('600 italic'). In the simplest use-case, this value can be a string: a generic path to the appropriate font-files ('path/to/my-font-bold') with file-extensions removed. We’ll add extensions for you, based on the formats setting. For more control over individual variants and formats, we also accept a map value. See the .. property below… ..path: (list) An optional string defining the font-path to interpolate for each given formats. This is the same as providing a string variant-path. ..local: (list) A list of names (strings) to use for local() font-src values. ..svgid: (list) Fragment identifier for svg fonts, to be appended on relevant import URLs. ..: (list) Optionally provide individual font-path overrides, or base64 data-URIs for specific formats. Examples scss Defining a font for import $fonts: ( 'sans': ( 'name': 'Museo Sans', 'stack': ('Helvetica', 'Arial', 'sans-serif'), 'formats': ('woff2', 'woff', 'ttf'), 'normal': 'museosans-regular-filename', 'bold': 'museosans-bold-filename', 'bold' 'italic': 'museosans-bolditalic-filename', 'unicode-range': (U+0000-00FF, U+0131, U+0152-0153, U+02C6), 'display': 'swap', // safely document any additional font data you want… 'source': 'https://www.fontspring.com/fonts/exljbris/museo-sans', ), ); scss Creating a secondary font alias // Create alias keys to provide more semantic naming as-needed. $fonts: ( 'body-font': '#sans', ); scss Setting explicit format-paths $fonts: ( 'sans': ( 'name': 'Museo Sans', 'stack': ('Helvetica', 'Arial', 'sans-serif'), 'bold': ( 'woff2': 'museosans-bold-woff2-path', 'svg': 'museosans-bold-svg-path', 'svgid': '#museosans', ), 'bold' 'italic': ( 'woff2': 'museosans-bolditalic-woff2-path', 'svg': 'museosans-bolditalic-svg-path.svg#museosans-bolditalic', ), ), ); scss Base64 data-uri’s and local() src $fonts: ( 'uri-font': ( 'name': 'My Font', 'stack': ('Helvetica', 'Arial', 'sans-serif'), 'normal': ( 'local': ('My Font', 'my-font-regular'), 'woff2': 'data:application/font-woff2;charset=utf-8;base64,…', ), 'bold': ( 'local': ('My Font Bold', 'my-font-bold'), 'woff2': 'data:application/font-woff2;charset=utf-8;base64,…', ), ), ); Used By @mixin add-font() @mixin add-font() In order to keep our $fonts map more manageable, we define individual map variables for each font, and use a mixin to merge them together into our global $fonts configuration. This can be useful for internal organization, documentation with SassDoc, or integration with a pattern-library generator like Herman. Parameters & Output & Return $key: (map) Give your font a semantic access-key for easy reference across your project. $map: (map) Map of font-data to be added at the given key. {CSS output} (code block) An updated global $fonts variable, with new maps merged in. @error Font key already exists. Rename or $force to continue Example scss $franklin: ( 'name': 'FranklinGothic', 'stack': ('Helvetica', 'Arial', 'sans-serif'), ); @include tools.add-font('heading', $franklin); Requires @function get() [private] @function error() [private] $fonts (map) Using WebFonts Once you’ve configured your webfont data into a map, these tools will help you access the data in various ways: from creating @font-face imports, to calling font-families by any given alias. @function font() Retrieve and normalize font data from the $fonts map Since 2.0.0: BREAKING: Non-map fonts are interpreted as font-stacks BREAKING: Normalized font-data uses proper name-quotation, and ignores missing or private names/stacks Since 1.0.0: NEW: Provided to access and normalize a map of font data for any key in your global $fonts map NEW: Accepts $source map argument, for custom source-palette Parameters & Return $font: (*) A key for accessing the desired font in $fonts $source: $fonts (map) Optional accoutrement-format map of fonts to use as the origin palette @return (map) A parsed and normalized map of font-data Requires @function get() [private] Used By @function font-family() @mixin font-face() @function font-values() [private] @function font-family() Access a font-family from your $fonts map, with name and font-stack. Since 1.0.0: NEW: Accepts $source map argument, for custom source-palette Since type-4.0.0: BUGFIX: Provides the correct name for fonts when an alias is given Parameters & Return $key: (string) The key-name of a font in your $fonts map. $source: $fonts (map) Optional accoutrement-format map of fonts to use as the origin palette @return (String) The full font-stack for the given font, ready for output with the font-family property. Example scss $fonts: ( 'sans': ( 'name': 'FranklinGothic', 'stack': (Helvetica, Arial, sans-serif), ), ); html { font-family: tools.font-family('sans'); } css compiled html { font-family: sans; } Requires @function font() @function get() [private] Used By @mixin font-family() @mixin font-family() Output a font-stack to font-family based on your $fonts configuration. Since 1.0.0: NEW: Accepts $source map argument, for custom source-palette Parameters $key: (string) The key-name of a font in your $fonts map. $source: $fonts (map) Optional accoutrement-format map of fonts to use as the origin palette Example scss $fonts: ( 'FranklinGothic': ( 'stack': (Helvetica, Arial, sans-serif), ), 'sans': '#FranklinGothic', ); html { @include tools.font-family('sans'); } css compiled html { font-family: sans; } Requires @function font-family() @mixin font-face() Import any local webfont defined in your $fonts configuration (variants without a path will not be imported). Since 3.0.0: NEW: Supports display setting in font-maps Since 1.0.0: NEW: Accepts $source map argument, for custom source-palette Since type-4.0.0: BREAKING: No longer accepts the $formats parameter Parameters & Output $key: (string) The key-name of a font in your $fonts map $source: $fonts (map) Optional accoutrement-format map of fonts to use as the origin palette {CSS output} (code block) @font-face import blocks for any defined font-variants. Example scss $fonts: ( 'body-font': ( 'name': 'Source Sans Pro', 'formats': 'woff2' 'woff' 'eot', 'normal': 'sans/sourcesanspro-regular-webfont', 'italic': 'sans/sourcesanspro-italic-webfont', 'bold': 'sans/sourcesanspro-bold-webfont', ), ); @include tools.font-face('body-font'); Requires @function font() @function font-get-variants() [private] @function get() [private] Used By @mixin import-webfonts() @mixin import-webfonts() Find all the fonts that include data for imports, and generate @font-face blocks for each individual font and variant. Since 2.0.0: NEW: Accepts $source parameter, which uses global $fonts by default BREAKING: No longer imports private fonts, but will import a direct alias of the private font Since 1.0.0: BREAKING: No longer accepts the $fonts parameter Since type-4.0.0: BREAKING: No longer accepts the $formats parameter Parameters & Output $source: $fonts (map) Optional accoutrement-format map of fonts to use as the origin palette {CSS output} (code block) Any number of @font-face blocks. Example scss $fonts: ( 'body-font': ( 'name': 'Source Sans Pro', 'formats': 'woff2' 'woff' 'eot', 'normal': 'sans/sourcesanspro-regular-webfont', 'italic': 'sans/sourcesanspro-italic-webfont', 'bold': 'sans/sourcesanspro-bold-webfont', ), // alias keys, and fonts without path data will be ignored… 'alias': '#body-font', 'google-font': ( 'source': 'https://fonts.google.com/', ), ); @include tools.import-webfonts; Requires @mixin font-face() @function is-alias-for() @function is-private-token()"},"type-helpers.html":{"filename":"type-helpers.html","title":"Type Helpers","contents":"@function font-url() This is a wrapper for the CSS url() function, which simply prepends the global $font-path when appropriate. Since type-4.0.0: BUGFIX: Supports Base64 data URI’s, without prepending font-path Parameters & Return $path: (string) A path relative to the fonts directory. @return (string) The full path to a font file, in CSS url('my/path') format. Example scss tools.$font-path: '../fonts/'; $src: tools.font-url('sans/my-sans-font.woff2'); /* #{$src} */ css compiled /* url(\"../fonts/sans/my-sans-font.woff2\") */ Requires $font-path (string) Used By @function font-src() [private] @mixin import-font-face() [private]"},"type-pseudo.html":{"filename":"type-pseudo.html","title":"Pseudo Elements","contents":"Pseudo-Elements Some shortcuts for creating ::before and ::after pseudo-elements. @mixin before() Add generated content :before an element. Parameters $content: (String) A value for the content property. @mixin after() Add generated content :after an element. Parameters $content: (String) A value for the content property. @mixin wrap-content() Add generated content :before and :after an element. Parameters $content: (List) One or two values to be used for the content property. A single string will be used :before and :after."},"type.html":{"filename":"type.html","title":"QuickStart: Type","contents":"QuickStart: Type Sass typography and webfont helpers. Gather all your fonts into a single map Access fonts by name Automate webfont imports from a CDN, or relative font files Also includes helpers for accessibility and pseudo-elements. Import If you already imported accoutrement/sass/tools you are ready to go. You can also import the type module on its own: @use '/accoutrement/sass/type'; Webfont Configuration // Set the a path to your fonts directory $font-path: '../fonts/'; $fonts: ( // describe locally-hosted font files for import and access 'heading': ( 'name': 'maven', 'stack': ('helvetica', 'arial', sans-serif), 'formats': 'woff' 'ttf', 'normal': 'maven/maven_pro_regular-webfont', 'bold': 'maven/maven_pro_bold-webfont', ), // describe CDN fonts for access 'body': ( 'name': 'Source Sans Pro', 'stack': ('Helvetica Neue', 'Helvetica', 'Arial', sans-serif), ), // provide aliases when useful 'alias': '#body', ); Import WebFonts Import one font at a time with font-face() or all your local webfonts with import-webfonts(): // Import one font by configuration key @include font-face('body'); // Import all local fonts @include import-webfonts; Set your font-family anywhere, using the semantic names you defined earlier: html { @include font-family('body'); } h1, h2, h3 { @include font-family('heading'); }"},"utils.html":{"filename":"utils.html","title":"Sass Maps, Lists, & Strings","contents":"Sass Utilities We use a number of Sass utilities to help manage strings, maps, and lists. As more functions are added to the Sass core, we hope to be able to remove some or all of these over time. Sass Lists Utility function(s) that extend the Sass core modules, to help with advanced list manipulation. @function remove-nth() Remove any item (1-indexed) from a list. This function has a list- prefix added by default (eg list-remove-nth()) unless it’s imported directly. However, it’s available in all accoutrement maps as 'remove-nth'. Parameters & Return $list: (list) The original list to be edited $index: (number) The 1-indexed item to remove from the list @return (list) The original list, with item removed @error $index must be a non-zero integer @error $index is too large for the list length Example scss $map: ( 'main-start': ['nav-end' 'main-start' 'footer-start'], 'small-start': '#main-start' ('remove-nth': 1), ); /*! #{inspect(tools.get($map, 'small-start'))} */ css compiled /*! [\"main-start\" \"footer-start\"] */ Requires @function template() [private] @function error() [private] Used By @function normalize-token() [private] @function has-alias() [private] @function lookup-alias() [private] Sass Maps Utility function(s) that extend the Sass core modules, to help with advanced map manipulation. @function multi-merge() Merge multiple maps into a single map, in case you want to define tokens in smaller groups – such as brand-colors, text-colors, etc. – before merging them into a single map. This function has a map- prefix added by default (eg map-multi-merge()) unless it’s imported directly. Parameters & Return $maps: (maps...) Pass any number of maps to be merged. @return (map) The merged map of easings. Requires @function check() [private] @function error() [private] Used By @mixin add-changes() @mixin add-easing() @mixin add-times() @mixin add-colors() @mixin add-ratios() @mixin add-sizes() Sass Strings Utility function(s) that extend the Sass core modules, to help with advanced string manipulation. @function replace() Replace a substring inside a larger string, or replace the entirety of the string. This function has a str- prefix added by default (eg str-replace()) unless it’s imported directly. However, it’s available in all accoutrement maps as either 'replace' or 'str-replace'. Since 1.0.0: NEW: Improved handling of non-string values, allows you to replace a number within a string, for example Parameters & Return $string: (string | list) The original string (or list of strings) to edit $old: (*) A sub-string to replace $new: '' (*) A new sub-string to replace the old $all: false (boolean) If true, replace all instances of $old in $string @return (string) Original string, with substring replaced Example scss // sass treats calc() as a string, // so we can use string-functions to manipulate calc values… $map: ( 'text-size': calc(1em + 1vw), 'large-text': '#text-size' ('str-replace': '1vw' '3vw'), ); /*! #{tools.get($map, 'large-text')} */ css compiled /*! calc(1em + 3vw) */ Requires @function error() [private] @function template() [private] @function force() [private] Used By @function has-alias() [private] @function interpolate() @function ident() @function interpolate() Return a string with interpolated values replacing %s placeholders in a format string. This function has a str- prefix added by default (eg str-interpolate()) unless it’s imported directly. However, it’s available in all accoutrement maps as either 'interpolate', 'str-interpolate', or '%s'. Parameters & Return $string: (string) The original string to be edited $values...: (*) New strings, to replace the %s format strings @return (string) Original string, with %s format strings replaced @error Too many interpolation values given for the string Example scss // sass treats calc() as a string, // so we can use string-functions to manipulate calc values… $map: ( 'root': 16px, 'responsive': 'calc(%s + %s)' ('%s': '#root' 0.5vw), ); /*! #{tools.get($map, 'responsive')} */ css compiled /*! calc(16px + 0.5vw) */ Requires @function check() [private] @function error() [private] @function replace() @function split() Splits a string into a list of strings, using the same logic as JavaScript’s split() method. This function has a str- prefix added by default (eg str-split()) unless it’s imported directly. However, it’s available in all accoutrement maps as either 'str-split' or 'split'. Since 1.0.0: NEW: Aliased as str-split Parameters & Return $string: (string) The original string to be split Empty strings will be returned as a list of one empty string $separator: null (*) The string will be split on any instance of the separator, and the separators will be removed Null or unfound separators will return a single-item list with the original string Empty-string ('') separators will return a list of all characters in the original string Non-string separators will be converted to strings before splitting $limit: null (integer | null) Maximum length of the returned list @return (list) Space-delimited list of string-slices from the original string Example scss $map: ( 'list': 'hello world' ('split': ' '), ); /*! #{tools.get($map, 'list')} */ css compiled /*! hello world */ Requires @function force() [private] Used By @function font-get-variants() [private] @function font-stack() [private] @function variant-name() [private] @function has-alias() [private] @function lookup-alias() [private] @function trim() Trims whitespace from the start and end of a string. This function has a str- prefix added by default (eg str-trim()) unless it’s imported directly. However, it’s available in all accoutrement maps as either 'str-trim' or 'trim'. Since 1.0.0: NEW: Strips whitespace NEW: Aliased as str-trim Parameters & Return $string: (string) The original string to be trimmed @return (string) Trimmed string Example scss $map: ( // null value is needed for single-argument functions… 'trim': ' hello world ' ('trim': null), ); /*! #{tools.get($map, 'trim')} */ css compiled /*! hello world */ Requires @function check() [private] @function error() [private] Used By @function font-stack() [private]"},"vars.html":{"filename":"vars.html","title":"CSS Custom Properties","contents":"CSS Custom Properties CSS variables are a useful way to manage values that might change in relation to the DOM – something that Sass variables cannot do. In many cases, we find it helpful to manage variables in Sass, and output CSS properties as-needed. These tools help integrate Sass variables with CSS custom properties, to keep that relationship intact. @function ident() Formats any string (like a Sass variable or token name) as a CSS “dashed-ident” that can be used for CSS custom properties. Spaces are replaced with a dash, and an optional prefix can be added, in the format --. Since 4.0.0: NEW: Provided publicly as ident() Since 2.0.0: NEW: Initial private release as _a_var-name() Parameters $name: (string) The name of the token to be used as a variable $prefix: null (string | null) Optional prefix added to the token name Example scss $colors: ( 'brand': mediumvioletred, 'action': teal, ); html { @each $name, $value in $colors { #{tools.ident($name, 'colors-')}: #{$value}; } } css compiled html { --colors-brand: mediumvioletred; --colors-action: teal; } Requires @function replace() Used By @function var-contrast() @mixin token--() @function var-token() @mixin custom-props() @mixin custom-props() Converts a map of variable names and values into CSS custom properties, in the format --: . This can be used with manually-generated maps, but we can also use the Sass module-variables function to generate a map of all the variables in a given module: @use 'accoutrement/tools'; @use 'sass:meta'; @use '_my-colors'; $my-colors: meta.module-variables('_my-colors'); html { @include tools.custom-props($my-colors, 'colors-'); } Since 4.0.0: NEW: Initial release Parameters & Output $map: (string) A map of keys and values to be converted into custom properties $prefix: null (string | null) Optional prefix added to each property name {CSS output} (code block) Custom properties for every key/value pair in a map. Example scss $colors: ( 'brand': mediumvioletred, 'action': teal, ); html { @include tools.custom-props($colors, 'colors-'); } css compiled html { --colors-brand: mediumvioletred; --colors-action: teal; } Requires @function ident()"}}} \ No newline at end of file +{"idx":{"version":"2.3.9","fields":["title","contents"],"fieldVectors":[["title/animate-change-vars.html",[0,0.889,1,0.12,2,0.047,3,0.268]],["contents/animate-change-vars.html",[0,2.374,1,0.319,2,0.119,3,0.671,4,2.144,5,1.39,6,0.449,7,0.58,8,0.376,9,0.513,10,0.944,11,1.184,12,0.021,13,2.02,14,0.867,15,0.483,16,0.117,17,0.867,18,1.664,19,1.664,20,0.674,21,0.982,22,1.799,23,1.442,24,1.184,25,1.088,26,0.522,27,1.262,28,1.111,29,1.557,30,1.412,31,0.891,32,1.547,33,1.617,34,0.551,35,2.212,36,2.212,37,0.691,38,4.977,39,3.005,40,1.664,41,1.52,42,0.899,43,5.569,44,0.659,45,1.799,46,0.449,47,0.187,48,0.815,49,0.438,50,1.184,51,0.923,52,1.348,53,0.285,54,1.106,55,1.184,56,1.111,57,1.341,58,0.59,59,0.481,60,1.111,61,0.923,62,1.348,63,0.461,64,1.323,65,0.936,66,1.089,67,0.59,68,0.719,69,0.944,70,1.442,71,3.44,72,3.163,73,3.982,74,1.681,75,2.18,76,3.751,77,3.758,78,0.508,79,0.551,80,2.858,81,1.073,82,1.007,83,1.72,84,0.884,85,2.167,86,1.215,87,1.073,88,2.02,89,2.167,90,0.631,91,3.005,92,2.741,93,0.256,94,1.262,95,1.111,96,1.547,97,0.483,98,0.477,99,1.888,100,3.179,101,3.179,102,2.02]],["title/animate-change.html",[0,1.024,16,0.054,103,2.103]],["contents/animate-change.html",[0,2.365,1,0.318,2,0.112,3,0.529,6,0.434,7,0.529,8,0.556,9,0.758,10,1.134,12,0.02,15,0.372,16,0.121,21,1.059,28,2.176,31,0.814,34,0.529,37,0.675,38,3.985,42,0.758,44,0.556,46,0.502,47,0.199,49,0.488,53,0.308,54,1.235,57,0.826,58,0.871,59,0.448,63,0.516,64,1.134,65,0.705,66,0.727,67,0.993,68,1.21,69,0.995,78,0.569,79,0.927,87,0.826,90,1.062,93,0.464,97,0.58,98,0.705,103,3.168,104,3.519,105,4.136,106,0.936,107,2.734,108,2.284,109,3.431,110,2.284,111,1.278,112,2.111,113,2.912,114,2.111,115,1.797,116,1.942,117,1.864,118,3.431,119,1.362,120,2.657,121,2.912,122,1.362,123,2.912,124,4.695,125,3.431,126,3.985,127,3.522,128,3.168,129,3.431,130,2.57,131,4.663,132,3.431,133,2.912,134,3.672,135,4.543,136,2.912,137,4.695,138,3.431,139,2.57,140,2.111,141,1.797,142,2.111,143,2.315,144,1.669,145,4.01,146,3.431,147,2.13,148,2.315,149,2.315,150,2.111,151,2.315,152,1.455,153,1.127,154,0.996,155,1.45,156,1.2,157,1.749,158,1.864,159,1.455,160,1.127,161,1.556,162,1.797,163,1.556,164,1.2,165,1.669,166,3.294,167,2.245,168,1.278,169,1.2,170,1.797,171,1.669,172,1.797,173,2.315,174,2.57,175,1.556,176,1.556,177,0.996,178,1.556,179,1.669,180,5.755,181,2.284,182,3.431,183,3.431]],["title/animate-ease-vars.html",[1,0.12,2,0.047,3,0.268,107,1.228]],["contents/animate-ease-vars.html",[1,0.318,2,0.118,3,0.668,4,2.136,5,1.38,6,0.445,7,0.573,8,0.364,9,0.497,10,0.923,11,1.147,12,0.021,13,1.976,14,0.84,15,0.472,16,0.116,17,0.84,18,1.612,19,1.612,20,0.653,21,0.951,22,1.743,23,1.397,24,1.147,25,1.076,26,0.531,27,1.223,28,1.077,29,1.523,30,1.396,31,0.876,32,1.498,33,1.594,34,0.543,35,2.181,36,2.181,37,0.685,40,1.612,41,1.499,42,0.887,44,0.65,45,1.743,46,0.443,47,0.185,48,0.79,49,0.462,50,1.147,51,0.894,52,1.306,53,0.276,54,1.09,55,1.147,56,1.077,57,1.323,58,0.572,59,0.483,60,1.077,61,0.894,62,1.306,63,0.453,64,1.311,65,0.928,66,1.071,67,0.572,68,0.696,69,0.923,70,1.397,78,0.5,79,0.534,80,2.843,81,1.049,82,0.984,83,1.696,84,0.864,85,2.119,86,1.188,87,1.049,88,1.976,89,2.119,90,0.611,93,0.248,94,1.223,95,1.077,96,1.498,97,0.472,98,0.462,99,1.306,104,2.28,105,2.68,107,3.276,127,1.743,134,2.465,142,1.895,148,4.487,184,5.795,185,2.307,186,5.492,187,4.633,188,2.614,189,2.614,190,2.614,191,2.614,192,6.016,193,4.507,194,4.507,195,4.06,196,3.405,197,2.457,198,4.06,199,4.355,200,3.696,201,3.079,202,4.355,203,3.079,204,3.079]],["title/animate-ease.html",[16,0.064,107,1.667]],["contents/animate-ease.html",[1,0.323,2,0.094,3,0.569,4,0.933,5,0.91,6,0.217,7,0.425,8,0.591,9,0.929,10,1.154,12,0.02,15,0.328,16,0.119,17,0.824,21,1.326,25,0.797,26,0.244,27,1.2,31,0.744,34,0.539,37,0.328,44,0.357,46,0.439,47,0.207,49,0.472,51,0.877,53,0.271,54,0.853,58,0.797,59,0.43,63,0.385,64,1.06,65,0.453,66,0.64,67,0.561,68,0.683,78,0.425,79,0.744,81,1.035,87,0.727,90,0.992,93,0.403,97,0.542,98,0.453,107,3.266,110,1.47,115,1.582,116,1.71,117,1.2,119,1.706,127,3.956,128,3.373,131,2.263,134,1.71,142,3.351,145,4.079,147,3.006,148,2.038,149,2.038,150,1.859,151,2.038,152,1.281,153,0.992,154,0.877,155,1.326,156,1.056,157,1.6,158,1.706,159,1.281,160,0.992,162,1.582,163,1.37,164,1.056,165,1.47,167,2.143,168,1.6,169,1.056,170,1.582,171,1.47,172,1.582,175,1.37,176,1.37,177,0.877,178,1.37,179,1.47,185,2.263,187,5.302,188,2.564,189,3.646,190,2.564,191,2.564,193,2.263,194,2.263,195,2.038,196,1.71,205,3.646,206,1.949,207,2.564,208,1.125,209,1.859,210,3.02,211,2.263,212,2.564,213,4.295,214,3.02,215,3.02,216,3.02,217,3.02,218,3.02,219,3.02,220,4.999,221,3.02,222,4.295,223,3.02,224,4.295,225,4.999,226,3.02,227,4.999,228,3.02,229,3.02,230,4.999,231,3.02,232,3.882,233,3.02,234,3.02,235,4.999,236,3.02,237,3.02,238,3.02,239,4.999,240,4.295,241,3.02,242,3.02,243,3.02,244,3.02,245,3.02,246,4.295,247,3.02,248,3.02,249,3.02,250,3.02,251,3.02,252,3.02,253,4.295,254,3.02,255,3.02,256,3.02,257,3.02,258,4.295,259,3.02,260,3.02,261,3.02,262,3.02,263,3.02,264,3.02,265,3.02,266,3.02,267,3.02,268,3.02,269,3.02,270,3.02,271,3.02,272,3.02,273,3.02,274,3.02,275,3.02,276,3.02,277,3.02,278,3.02,279,3.02,280,3.02,281,3.02,282,3.02,283,3.02,284,3.02,285,1.71,286,2.564,287,2.038,288,3.02,289,3.02,290,1.47,291,2.564,292,0.91,293,1.859,294,1.859,295,1.859,296,3.646,297,1.37,298,1.859]],["title/animate-time-vars.html",[1,0.12,2,0.047,3,0.268,106,0.738]],["contents/animate-time-vars.html",[0,1.469,1,0.319,2,0.119,3,0.672,4,2.146,5,1.391,6,0.45,7,0.581,8,0.378,9,0.516,10,0.948,11,1.191,12,0.021,13,2.029,14,0.873,15,0.485,16,0.117,17,0.873,18,1.675,19,1.675,20,0.678,21,0.987,22,1.81,23,1.451,24,1.191,25,1.091,26,0.523,27,1.27,28,1.118,29,1.564,30,1.415,31,0.894,32,1.556,33,1.621,34,0.552,35,2.218,36,2.218,37,0.692,40,1.675,41,1.524,42,0.902,44,0.661,45,1.81,46,0.451,47,0.188,48,0.82,49,0.438,50,1.191,51,0.928,52,1.356,53,0.287,54,1.108,55,1.191,56,1.118,57,1.345,58,0.594,59,0.482,60,1.118,61,0.928,62,1.356,63,0.462,64,1.325,65,0.938,66,1.093,67,0.594,68,0.723,69,0.948,70,1.451,71,2.531,74,1.683,78,0.51,79,0.554,80,2.861,81,1.077,82,1.011,83,1.724,84,0.888,85,2.176,86,1.22,87,1.077,88,2.029,89,2.176,90,0.635,93,0.258,94,1.27,95,1.118,96,1.556,97,0.485,98,0.48,99,1.896,105,2.752,106,1.968,134,3.668,135,3.796,136,2.714,200,3.796,299,5.877,300,5.584,301,5.584,302,5.877,303,3.35,304,4.472,305,1.184,306,4.472,307,4.472,308,3.198,309,3.796]],["title/animate-times.html",[16,0.064,106,1.002]],["contents/animate-times.html",[1,0.306,2,0.092,3,0.583,6,0.3,7,0.412,8,0.632,9,0.863,10,1.318,12,0.018,15,0.452,16,0.123,21,1.288,30,1.497,31,0.926,34,0.583,46,0.431,47,0.213,49,0.463,53,0.374,54,1.06,58,1.193,59,0.473,61,1.21,63,0.479,64,1.249,65,0.802,66,0.884,67,0.774,68,0.943,78,0.528,79,0.926,81,1.004,86,1.138,87,1.004,90,1.234,93,0.431,97,0.674,98,0.626,106,1.978,110,2.029,112,2.566,115,2.183,117,1.656,119,1.656,149,2.814,150,2.566,151,2.814,152,2.265,153,1.37,154,1.21,155,1.65,156,1.458,157,1.99,158,2.552,159,1.768,160,1.37,162,2.183,163,1.892,164,1.458,165,2.6,167,2.394,168,1.553,169,1.458,170,2.183,171,2.029,172,2.183,173,2.814,175,1.892,176,1.892,177,1.21,178,1.892,179,2.029,310,5.004,311,5.004,312,1.37,313,3.124,314,1.458,315,4.535,316,4.169,317,3.539,318,1.768,319,4.169,320,2.029,321,1.768]],["title/animate.html",[104,1.924,322,1.368]],["contents/animate.html",[0,2.09,1,0.317,12,0.021,15,0.481,16,0.077,37,0.658,42,0.98,46,0.49,47,0.203,61,1.289,67,0.824,90,0.881,93,0.449,104,3.55,105,4.256,106,1.887,107,3.159,116,2.513,121,3.768,126,4.718,127,3.435,128,4.096,131,4.766,133,5.151,134,3.707,147,2.522,152,1.883,153,1.458,181,2.705,187,3.326,193,3.326,194,3.326,195,2.996,196,2.513,290,2.16,296,3.768,305,1.416,309,3.768,310,3.768,311,4.718,312,1.458,314,1.552,315,4.718,318,1.883,321,1.883,322,1.653,323,1.458,324,2.41,325,2.325,326,2.513,327,2.513,328,1.458,329,1.763,330,4.439,331,2.16,332,1.458,333,3.326,334,2.014,335,4.165,336,6.069,337,4.439,338,2.357,339,3.768,340,4.439,341,4.439,342,4.439,343,2.325,344,4.439,345,4.439]],["title/CHANGELOG.html",[346,3.352]],["contents/CHANGELOG.html",[0,1.875,1,0.297,2,0.103,3,0.601,4,1.697,5,1.138,6,0.386,8,0.675,9,0.583,10,0.506,11,0.889,12,0.021,14,1.327,15,0.567,16,0.115,17,0.651,20,1.246,23,0.645,24,2.089,25,0.572,26,0.541,28,0.834,29,1.078,30,0.342,31,0.698,33,0.693,34,0.687,36,0.948,37,0.154,41,0.388,42,0.704,44,0.282,46,0.392,47,0.214,48,1.033,49,0.376,50,1.149,51,1.411,52,0.603,53,0.453,54,0.717,57,0.97,58,0.939,59,0.396,63,0.277,64,1.21,65,0.695,66,1.165,69,0.853,70,0.645,75,1.532,78,0.236,79,0.413,81,0.87,82,0.321,84,0.865,87,1.116,90,0.474,93,0.408,95,0.497,97,0.473,98,0.213,103,0.959,104,1.892,106,1.264,107,2.102,111,0.529,114,1.469,116,0.804,117,0.948,120,1.351,122,0.948,127,1.351,128,1.61,139,1.788,140,0.875,141,1.615,154,1.266,155,0.737,156,1.263,157,2.217,158,2.303,159,1.849,161,1.639,163,0.645,164,0.497,167,1.149,168,1.346,169,0.497,175,1.083,176,1.399,177,0.413,178,0.645,181,1.501,185,1.065,197,1.965,198,0.959,206,1.083,208,0.889,209,3.513,232,0.959,285,0.804,292,1.107,293,1.469,294,1.469,297,1.827,305,1.3,318,0.603,320,2.121,321,0.603,323,1.013,324,1.931,328,1.931,329,1.435,332,2.048,338,1.012,343,1.615,346,2.311,347,1.421,348,2.386,349,1.421,350,3.418,351,3.418,352,2.752,353,1.898,354,3.039,355,1.421,356,1.065,357,1.206,358,1.421,359,3.07,360,2.438,361,1.206,362,4.026,363,2.025,364,1.206,365,2.386,366,1.421,367,2.707,368,2.386,369,2.121,370,2.386,371,0.875,372,1.615,373,1.065,374,1.421,375,3.24,376,2.386,377,1.827,378,1.065,379,1.61,380,2.311,381,2.14,382,1.206,383,2.59,384,3.471,385,2.707,386,1.61,387,1.206,388,1.746,389,1.469,390,1.61,391,1.206,392,1.065,393,1.206,394,1.206,395,1.788,396,0.875,397,1.065,398,1.206,399,2.956,400,2.047,401,3.017,402,1.206,403,1.788,404,1.788,405,1.351,406,2.045,407,2.081,408,0.744,409,1.501,410,1.469,411,1.206,412,1.083,413,3.112,414,1.012,415,2.025,416,1.959,417,2.081,418,1.065,419,1.421,420,1.561,421,1.421,422,2.386,423,1.788,424,1.421,425,1.421,426,1.421,427,1.421,428,1.849,429,3.613,430,3.066,431,3.066,432,3.7,433,3.933,434,2.025,435,1.206,436,1.421,437,2.102,438,2.386,439,2.025,440,2.386,441,1.421,442,1.206,443,1.065,444,5.496,445,3.613,446,3.613,447,3.613,448,1.421,449,1.781,450,1.788,451,1.206,452,1.421,453,1.421,454,1.421,455,3.914,456,1.206,457,1.421,458,1.421,459,1.206,460,1.421,461,1.206,462,1.421,463,1.421,464,1.421,465,1.421,466,2.618,467,2.294,468,1.469,469,1.421,470,1.421,471,1.161,472,1.421,473,2.364,474,1.065,475,1.421,476,2.386,477,2.025,478,1.421,479,1.421,480,2.386,481,1.065,482,1.421,483,1.421,484,1.421,485,1.421,486,1.206,487,2.025,488,1.206,489,1.206,490,1.421,491,2.025,492,2.311,493,1.206,494,1.421,495,3.471,496,1.206,497,1.421,498,1.206,499,1.206,500,1.421,501,1.065,502,1.421,503,1.421,504,1.421,505,0.959,506,1.421,507,1.421,508,1.421,509,1.421,510,1.421,511,1.421,512,1.421,513,1.421,514,1.615,515,1.421,516,1.421,517,1.421,518,1.421,519,1.421,520,1.788,521,1.421,522,4.009,523,1.206,524,0.959,525,0.959,526,1.206,527,1.065,528,1.206,529,2.025,530,0.959,531,1.421,532,0.959,533,1.065,534,2.108,535,1.065,536,1.421,537,1.788,538,1.065,539,1.61,540,1.206,541,1.065,542,0.804,543,2.386,544,1.421,545,1.421,546,0.959,547,1.206,548,1.065,549,1.206,550,1.421,551,1.421,552,1.421,553,1.421,554,1.206,555,1.421,556,0.959,557,1.421,558,1.421,559,1.065,560,1.61,561,1.206,562,1.206,563,0.564,564,2.707,565,1.351,566,1.421,567,1.421,568,4.359,569,1.065,570,1.065,571,0.959,572,1.746,573,2.386,574,2.438,575,1.065,576,1.421,577,3.084,578,1.206,579,1.421,580,1.421,581,1.421,582,1.421,583,1.421,584,2.081,585,1.788,586,0.959,587,1.065,588,0.875,589,0.692,590,1.206,591,0.692,592,1.421,593,2.386,594,1.206,595,1.351,596,1.206,597,1.421,598,1.421,599,4.026,600,1.065,601,0.875,602,1.421,603,1.206,604,1.615,605,1.206,606,1.898,607,1.615,608,2.025,609,2.025,610,1.206,611,1.898,612,1.421,613,1.421,614,1.206,615,1.421,616,1.421,617,1.421,618,1.421,619,2.386,620,1.421,621,0.875,622,1.421,623,3.066,624,3.066,625,2.025,626,0.959,627,0.959,628,1.206,629,2.025,630,2.045,631,1.61,632,1.61,633,3.084,634,2.025,635,1.788,636,1.351,637,2.438,638,3.066,639,2.717,640,1.169,641,1.421,642,1.421,643,1.61,644,1.421,645,0.959,646,1.421,647,1.421,648,1.065,649,1.065,650,1.421,651,0.804,652,1.065,653,0.744,654,1.065,655,1.788,656,1.065,657,1.206,658,2.618,659,0.744,660,1.206,661,1.206,662,1.421,663,1.065,664,2.386,665,1.206,666,2.438,667,2.025,668,1.61,669,0.875,670,1.421,671,2.311,672,1.788,673,1.421,674,1.206,675,1.206,676,1.61,677,1.421,678,2.478,679,2.386,680,2.386,681,1.065,682,1.206,683,1.206,684,1.206,685,1.065,686,2.386,687,2.025,688,0.959,689,1.421,690,1.421]],["title/color-config.html",[160,1.207,305,0.779]],["contents/color-config.html",[1,0.267,7,0.594,8,0.815,12,0.023,46,0.407,47,0.22,53,0.539,75,2.138,83,1.557,102,2.912,112,3.103,160,1.656,169,1.763,181,2.453,292,1.069,305,1.497,312,1.656,328,1.656,331,3.123,369,3.234,379,3.403,386,3.403,473,2.818,534,3.48,600,3.778,601,3.103,636,2.854,651,3.633]],["title/color-contrast.html",[1,0.138,93,0.251,473,1.238]],["contents/color-contrast.html",[1,0.323,2,0.111,3,0.559,4,1.896,5,0.696,6,0.377,7,0.574,8,0.584,9,0.937,10,0.447,12,0.017,16,0.037,25,1.077,26,0.368,28,1.727,30,0.972,34,0.325,37,0.536,41,1.752,42,0.736,44,0.687,46,0.368,47,0.219,49,0.418,51,0.612,53,0.542,54,0.98,56,0.737,59,0.462,63,0.469,65,0.996,67,0.61,68,0.743,69,0.696,74,1.168,75,0.894,78,0.574,82,0.912,86,0.896,87,0.791,90,0.98,93,0.456,95,1.149,97,0.69,99,1.932,102,2.743,103,1.423,116,1.193,141,1.104,177,1.434,197,0.894,232,3.075,292,1.047,295,2.022,298,2.022,305,1.53,318,2.946,338,1.393,369,3.273,381,2.069,389,1.298,412,1.831,414,0.894,473,2.862,481,3.024,496,1.79,514,2.586,520,2.461,524,3.075,525,1.423,526,4.192,527,4.093,528,5.345,529,5.345,530,3.686,532,4.005,534,3.492,542,2.579,561,3.868,563,0.837,569,1.58,571,1.423,586,3.075,587,4.233,636,1.859,640,1.685,651,3.564,691,3.813,692,4.556,693,5.037,694,3.414,695,4.192,696,4.796,697,4.601,698,5.212,699,5.65,700,1.859,701,2.108,702,3.285,703,1.79,704,2.108,705,3.285,706,5.231,707,2.108,708,2.461,709,2.217,710,2.108,711,2.108,712,2.108,713,2.108,714,3.024,715,4.093,716,2.108,717,3.285,718,2.108,719,1.58,720,2.788,721,1.026]],["title/color-themes.html",[535,3.352]],["contents/color-themes.html",[1,0.321,2,0.1,6,0.342,7,0.534,9,0.562,10,0.738,12,0.02,15,0.378,16,0.108,30,1.299,34,0.534,37,0.585,42,0.935,44,0.638,46,0.383,47,0.204,49,0.342,53,0.312,59,0.342,63,0.484,75,2.288,78,0.534,84,1.203,86,0.951,90,1.071,92,3.565,97,0.515,108,2.309,114,2.144,119,1.384,147,2.628,153,1.145,161,1.581,164,1.659,177,1.566,232,3.909,287,3.641,295,2.144,297,1.581,305,1.526,318,2.57,334,2.749,369,2.949,408,1.824,520,4.042,533,2.61,534,3.173,535,4.54,537,4.684,538,2.61,540,4.916,541,3.554,546,3.641,601,3.848,603,2.957,607,3.033,653,1.824,697,4.54,715,2.61,722,4.744,723,4.744,724,3.484,725,1.972,726,3.484,727,2.957,728,2.144,729,2.957,730,3.484,731,5.049,732,5.72,733,3.202,734,3.484,735,3.484,736,3.484,737,3.484,738,3.484,739,4.744,740,4.744,741,4.744,742,4.744,743,4.744,744,4.027,745,4.744,746,5.143,747,4.744,748,3.484,749,5.792,750,4.916,751,4.916,752,5.792,753,5.792,754,4.744,755,4.744,756,5.792,757,5.792,758,5.792,759,5.792,760,5.792,761,5.792,762,4.027,763,4.744,764,3.484,765,3.484]],["title/color-tokens.html",[26,0.296,305,0.779]],["contents/color-tokens.html",[1,0.314,2,0.097,3,0.511,5,0.681,6,0.231,7,0.603,8,0.755,9,0.834,10,1.326,12,0.02,16,0.121,21,0.992,25,0.596,30,1.417,31,0.777,33,0.932,34,0.444,37,0.561,39,3.972,41,1.224,42,0.518,44,0.531,46,0.451,47,0.222,49,0.439,51,0.932,53,0.502,54,0.89,55,1.196,56,1.123,58,1.204,59,0.439,63,0.402,64,1.186,65,0.776,67,0.596,68,0.726,74,1.509,75,1.902,78,0.444,79,0.556,81,0.773,84,0.637,86,0.876,87,1.08,90,1.267,93,0.475,97,0.607,98,0.482,102,1.457,110,1.562,115,1.681,117,1.275,119,1.275,122,1.275,149,2.167,150,1.976,151,2.167,152,1.902,153,1.473,154,1.624,155,1.385,156,1.123,157,1.196,158,2.222,159,1.362,160,1.055,162,1.681,163,1.457,167,2.192,168,1.196,169,1.123,170,1.681,171,1.562,172,1.681,173,2.167,175,1.457,176,1.457,177,0.932,178,1.457,179,1.562,290,1.562,292,0.681,293,1.976,305,1.543,314,1.123,317,2.725,318,2.496,320,1.562,321,1.362,323,1.055,332,1.055,359,2.538,369,2.722,386,2.167,408,1.681,414,1.362,428,2.192,437,1.457,473,2.485,505,3.775,534,3.193,537,3.872,546,2.167,589,1.562,591,1.562,601,1.976,639,2.167,640,0.932,651,1.817,669,1.976,671,2.406,693,2.725,698,2.725,709,2.167,715,2.406,719,2.406,731,2.406,733,2.167,766,3.821,767,3.211,768,3.211,769,3.211,770,3.211,771,2.725,772,2.725,773,2.725,774,3.807,775,3.807,776,3.807,777,3.211,778,5.168,779,2.725,780,3.211,781,3.211,782,4.485,783,3.211,784,1.817,785,1.976,786,1.817,787,2.725,788,1.562,789,2.725,790,3.211,791,3.211,792,3.211,793,3.211,794,3.211,795,2.725,796,3.211,797,2.725,798,3.211,799,3.211]],["title/color-utils.html",[58,0.83]],["contents/color-utils.html",[1,0.294,2,0.094,6,0.452,8,0.796,9,0.877,10,1.151,12,0.022,30,1.308,31,0.941,33,1.576,34,0.537,47,0.219,49,0.452,53,0.487,58,1.008,59,0.452,63,0.487,65,0.815,75,2.661,78,0.537,86,1.482,90,1.246,97,0.681,102,2.463,112,3.342,153,1.784,157,2.022,294,3.342,305,1.53,359,2.463,369,3.312,377,1.94,473,2.749,534,3.564,542,3.073,600,5.099,601,4.074,639,3.664,640,1.576,651,3.073,788,2.642,800,6.275,801,4.609,802,5.43,803,6.805,804,5.43,805,5.43]],["title/color-vars.html",[1,0.106,2,0.041,3,0.237,26,0.193,305,0.507]],["contents/color-vars.html",[1,0.318,2,0.119,3,0.67,4,2.156,5,1.387,6,0.448,7,0.578,8,0.373,9,0.51,10,0.939,11,1.176,12,0.022,13,2.01,14,0.861,15,0.481,16,0.117,17,0.861,18,1.653,19,1.653,20,0.669,21,0.975,22,1.786,23,1.432,24,1.176,25,1.086,26,0.521,27,1.254,28,1.104,29,1.549,30,1.409,31,0.887,32,1.536,33,1.612,34,0.549,35,2.205,36,2.205,37,0.689,39,2.99,40,1.653,41,1.515,42,0.896,44,0.657,45,1.786,46,0.472,47,0.194,48,0.809,49,0.437,50,1.176,51,0.916,52,1.338,53,0.283,54,1.102,55,1.176,56,1.104,57,1.337,58,0.586,59,0.481,60,1.104,61,0.916,62,1.338,63,0.459,64,1.32,65,0.935,66,1.085,67,0.586,68,0.713,69,0.939,70,1.432,71,3.432,72,3.151,73,3.976,74,1.679,75,2.171,76,3.746,77,3.747,78,0.506,79,0.547,80,2.855,81,1.067,82,1.002,83,1.715,84,0.88,85,2.156,86,1.209,87,1.067,88,2.01,89,2.156,90,0.627,91,2.99,92,2.727,93,0.255,94,1.254,95,1.104,96,1.536,97,0.481,98,0.474,99,1.879,102,2.01,305,1.531,473,1.76,696,4.964,797,2.679,806,5.552,807,2.679]],["title/color.html",[305,0.779,322,1.368]],["contents/color.html",[1,0.314,3,0.512,5,0.843,8,0.47,9,0.642,10,1.098,12,0.022,16,0.112,17,1.085,25,1.205,26,0.511,27,1.579,37,0.431,39,4.12,42,0.93,46,0.465,47,0.184,49,0.286,51,1.154,53,0.356,58,0.738,59,0.286,61,1.154,65,0.597,67,0.738,74,1.019,75,2.197,76,3.584,79,0.689,84,0.789,86,1.085,90,1.257,93,0.321,97,0.431,98,0.597,102,1.803,116,2.25,117,1.579,141,2.082,144,1.934,152,2.197,153,1.306,154,1.504,155,1.955,160,1.306,167,1.481,170,2.082,181,1.934,290,1.934,305,1.524,312,1.306,314,1.811,318,2.444,321,1.686,322,1.481,323,1.702,324,2.288,325,2.082,326,2.25,327,2.25,328,1.306,329,1.579,331,1.934,332,1.702,335,2.978,338,2.444,369,3.159,386,2.683,412,1.803,414,1.686,473,2.736,505,3.496,527,4.317,534,3.4,563,1.579,572,2.25,636,2.25,651,3.262,653,2.713,672,2.978,766,3.943,774,4.397,775,4.397,776,4.397,786,2.25,787,3.374,788,1.934,807,3.374,808,2.25,809,3.374,810,5.18,811,5.18,812,5.18,813,2.683,814,3.374,815,2.447,816,3.975,817,3.975,818,3.975,819,3.975,820,5.18,821,3.975]],["title/CONTRIBUTING.html",[570,3.352]],["contents/CONTRIBUTING.html",[0,1.847,1,0.25,12,0.021,15,0.49,18,2.368,19,2.368,20,0.958,24,1.684,25,0.839,44,0.535,56,1.581,60,1.581,67,1.136,83,1.396,87,1.089,111,1.684,153,1.486,155,1.89,166,4.053,168,1.684,169,1.966,176,2.052,178,2.551,197,1.918,198,3.052,285,2.559,292,0.958,314,1.966,346,3.388,353,3.461,360,4.13,417,3.795,431,3.838,432,5.195,433,4.773,434,3.838,443,3.388,467,2.052,468,4.131,532,3.052,542,2.559,570,3.388,636,2.559,653,3.205,681,3.388,703,3.838,784,2.559,788,2.2,795,3.838,801,3.838,813,3.052,814,3.838,815,2.783,822,6.12,823,5.623,824,5.623,825,3.052,826,5.623,827,2.783,828,4.522,829,4.522,830,4.522,831,2.783,832,5.623,833,4.522,834,4.522,835,4.522,836,4.522,837,4.522,838,4.522,839,4.773,840,4.522,841,5.623,842,4.522,843,5.778,844,3.052,845,4.522,846,6.585,847,5.623,848,4.522,849,3.838,850,4.522,851,5.623,852,5.435,853,5.623,854,3.838,855,4.522,856,4.522,857,4.522,858,4.522,859,3.388,860,4.522,861,4.522]],["title/index.html",[15,0.398,314,1.285]],["contents/index.html",[1,0.318,2,0.102,3,0.582,6,0.261,8,0.429,9,0.585,11,1.35,12,0.023,14,1.33,15,0.638,16,0.117,17,0.989,20,1.393,26,0.537,47,0.206,48,1.249,58,0.904,59,0.261,61,1.052,64,1.167,66,1.167,67,1.022,69,0.768,74,0.929,78,0.358,79,0.628,83,1.119,84,1.093,93,0.292,98,0.544,104,2.551,105,2.23,114,2.23,115,1.898,122,1.439,147,1.644,152,2.066,154,1.414,155,1.119,168,1.35,171,2.371,175,2.21,181,1.763,206,1.644,209,2.23,292,1.248,305,1.167,312,2.123,313,2.715,314,1.267,323,1.601,328,2.123,329,2.186,332,1.934,338,1.537,339,4.136,353,2.23,354,2.051,360,2.445,372,1.898,375,2.551,377,2.21,378,2.715,379,2.445,380,2.715,381,1.934,382,3.076,383,2.497,385,2.715,388,2.758,406,2.758,410,2.23,416,1.763,420,1.505,428,2.334,430,4.136,437,1.644,449,1.052,467,1.644,471,2.678,473,1.439,495,2.715,522,2.23,541,3.65,563,1.935,571,4.268,574,2.445,589,1.763,591,1.763,595,2.051,604,1.898,607,2.882,611,2.23,640,1.052,649,2.715,659,1.898,688,2.445,700,2.051,771,3.076,784,2.051,785,2.23,786,2.758,788,1.763,808,3.476,809,3.076,843,4.136,862,3.624,863,3.076,864,4.672,865,4.672,866,3.624,867,3.076,868,3.624,869,3.624,870,3.624,871,3.624,872,2.445,873,3.624,874,3.65,875,3.624,876,3.624,877,5.504,878,3.624,879,4.872,880,3.624,881,3.624,882,3.624,883,3.624,884,3.076,885,3.65,886,3.076,887,3.076,888,3.076,889,2.371,890,3.288,891,2.23,892,2.445,893,3.076,894,2.445,895,3.624,896,3.624,897,3.076,898,3.076,899,2.715,900,3.624,901,3.624,902,3.624,903,3.076,904,3.624,905,2.23,906,3.076,907,3.076,908,2.23,909,3.076,910,3.076,911,3.076,912,2.445,913,3.076,914,3.624,915,3.076,916,3.076,917,3.076]],["title/layout-queries.html",[16,0.054,588,1.918,918,2.335]],["contents/layout-queries.html",[1,0.321,2,0.101,3,0.252,6,0.387,7,0.617,8,0.71,9,0.412,10,1.237,12,0.022,15,0.545,16,0.113,17,1.239,25,1.158,28,1.758,31,0.658,33,1.46,34,0.593,37,0.545,41,1.749,42,0.91,44,0.691,46,0.455,47,0.199,48,0.654,49,0.42,53,0.482,55,0.95,58,1.294,59,0.466,60,0.892,61,0.741,63,0.451,64,0.962,65,0.383,66,0.541,69,0.962,78,0.497,81,1.093,82,1.026,83,0.788,84,0.901,90,0.754,92,3.469,93,0.206,97,0.545,98,0.383,106,0.696,154,1.103,156,0.892,157,1.691,158,1.803,159,1.082,161,2.059,162,1.336,163,1.158,164,0.892,165,3.081,167,0.95,181,2.447,197,1.611,294,1.57,314,1.758,318,2.719,331,1.242,332,1.248,333,2.846,338,1.611,352,2.569,359,2.831,371,1.57,377,1.158,383,2.722,390,1.722,392,3.401,400,0.95,408,1.336,416,1.242,417,1.722,418,1.912,420,1.803,428,1.082,467,2.281,468,2.793,514,1.989,522,2.338,524,1.722,525,2.564,532,1.722,542,2.569,565,2.569,574,3.393,584,4.672,585,4.803,586,4.509,587,5.034,588,3.773,589,2.209,590,5.203,626,2.564,627,1.722,637,2.564,669,1.57,671,1.912,674,2.166,688,3.063,691,3.063,720,3.225,725,1.444,750,4.268,751,4.955,773,3.853,788,1.242,825,1.722,891,1.57,894,1.722,905,1.57,918,4.9,919,1.912,920,2.552,921,1.912,922,5.376,923,3.401,924,6.13,925,2.552,926,1.57,927,1.722,928,2.166,929,2.793,930,2.552,931,2.377,932,3.853,933,4.631,934,3.767,935,4.539,936,4.539,937,5.028,938,4.539,939,3.19,940,2.552,941,3.799,942,2.552,943,5.376,944,3.799,945,2.552,946,5.376,947,2.552,948,2.552,949,3.799,950,2.552,951,2.552,952,1.912]],["title/layout-z-index.html",[953,2.752,954,2.479]],["contents/layout-z-index.html",[1,0.31,2,0.097,3,0.552,6,0.402,7,0.552,8,0.528,12,0.019,14,1.218,30,1.344,34,0.442,37,0.484,46,0.45,47,0.194,49,0.459,54,1.265,59,0.472,63,0.5,67,0.829,68,1.009,69,1.182,78,0.552,82,1.261,94,1.773,97,0.66,111,1.663,145,3.345,147,2.531,148,3.013,156,1.561,160,2.155,177,1.619,198,3.013,297,2.025,320,2.714,331,2.172,334,2.531,354,2.527,396,2.748,412,2.025,416,2.172,423,4.179,461,4.735,523,3.789,604,2.338,640,1.943,695,3.789,714,3.345,728,2.748,815,2.748,953,5.371,954,4.869,955,6.863,956,3.789,957,3.789,958,4.464,959,3.789,960,4.464,961,3.789,962,4.464,963,4.464,964,4.464]],["title/layout.html",[322,1.368,384,2.752]],["contents/layout.html",[1,0.317,2,0.085,12,0.02,15,0.532,16,0.085,42,0.954,46,0.395,49,0.353,55,1.825,59,0.353,68,1.108,74,1.626,93,0.477,153,1.61,174,3.672,290,2.385,312,1.941,321,2.078,322,1.825,323,1.61,324,2.518,325,2.566,326,2.774,327,2.774,328,1.61,329,1.946,331,2.385,352,2.774,360,3.307,383,2.224,384,4.751,420,1.824,450,4.426,565,2.774,584,4.546,585,3.672,586,3.307,588,4.051,589,2.385,640,1.423,659,2.566,918,4.932,929,3.016,933,3.307,934,3.672,953,3.672,954,3.307,959,5.014,965,4.901,966,4.901,967,4.901,968,4.901,969,4.901,970,4.901,971,3.672,972,4.901,973,4.901,974,4.901]],["title/LICENSE.html",[975,3.118,976,2.752]],["contents/LICENSE.html",[1,0.218,12,0.02,42,1.024,94,1.946,127,2.774,167,1.825,286,4.16,292,1.039,314,1.714,414,2.689,459,4.16,746,4.16,827,3.016,831,3.016,874,3.672,898,4.16,921,3.672,929,3.016,975,4.16,976,3.672,977,6.341,978,4.901,979,5.907,980,4.901,981,4.901,982,4.901,983,4.901,984,5.907,985,6.583,986,7.03,987,5.907,988,4.901,989,5.014,990,4.901,991,4.901,992,4.901,993,4.901,994,4.901,995,4.901,996,4.901,997,4.901,998,4.901,999,4.901,1000,5.907,1001,5.907,1002,4.901,1003,4.901,1004,5.907,1005,4.901,1006,4.901,1007,4.901,1008,4.901,1009,4.901,1010,4.901,1011,4.901,1012,4.901,1013,4.16,1014,4.901,1015,4.901,1016,4.901,1017,4.901,1018,4.901,1019,3.672,1020,4.901,1021,4.901,1022,4.901,1023,4.901]],["title/ratio-tokens.html",[26,0.296,381,1.207]],["contents/ratio-tokens.html",[1,0.321,2,0.096,3,0.488,5,0.782,6,0.355,7,0.586,8,0.657,9,0.796,10,1.045,12,0.022,14,1.006,15,0.535,16,0.121,26,0.524,31,0.854,34,0.586,37,0.602,44,0.583,46,0.398,47,0.211,48,1.264,49,0.458,51,1.07,53,0.442,54,0.978,57,0.888,58,0.915,59,0.458,63,0.498,64,1.256,65,0.833,66,0.782,67,0.684,68,0.834,78,0.549,83,1.139,84,0.732,87,0.888,90,1.102,93,0.298,97,0.67,98,0.74,152,1.564,155,1.522,156,1.289,157,1.836,158,1.958,159,1.564,160,1.211,162,1.931,163,1.673,164,1.724,167,2.208,168,1.373,177,1.793,178,1.673,179,1.794,196,3.143,206,1.673,208,1.373,287,4.169,290,1.794,292,1.256,297,2.519,314,1.289,323,1.211,332,1.211,334,2.236,338,1.564,381,2.371,383,2.236,400,1.836,406,2.087,412,2.519,413,2.269,416,1.794,428,1.564,514,2.908,525,3.327,546,2.488,563,1.464,591,1.794,627,2.488,631,2.488,697,3.693,714,3.693,728,2.269,784,2.087,785,2.269,786,2.087,905,2.269,926,2.269,928,3.13,939,2.087,1024,3.13,1025,2.269,1026,3.13,1027,3.687,1028,3.687,1029,3.687,1030,3.13,1031,3.687,1032,3.687,1033,5.928,1034,3.687,1035,4.184,1036,3.687,1037,3.687,1038,5.031,1039,3.687,1040,3.687,1041,3.687,1042,3.687]],["title/ratio-vars.html",[1,0.106,2,0.041,3,0.237,26,0.193,381,0.786]],["contents/ratio-vars.html",[1,0.32,2,0.118,3,0.658,4,2.132,5,1.377,6,0.451,7,0.584,8,0.383,10,0.685,12,0.021,13,1.467,15,0.351,16,0.115,25,1.095,26,0.536,27,1.284,28,1.131,29,1.576,30,1.421,31,0.899,32,1.574,33,1.629,34,0.555,35,2.229,36,2.229,37,0.694,40,1.693,41,1.531,42,0.906,44,0.664,45,1.83,46,0.453,47,0.188,48,0.829,49,0.468,50,1.205,51,0.939,52,1.371,53,0.29,54,1.114,55,1.205,56,1.131,57,1.352,58,0.6,59,0.483,60,1.131,61,0.939,62,1.371,63,0.465,64,1.329,65,0.941,66,1.1,67,0.6,68,0.731,69,0.955,70,1.467,78,0.513,79,0.56,80,2.866,81,1.086,82,1.019,83,1.733,84,0.895,85,2.193,86,1.23,87,1.086,88,2.045,89,2.193,90,0.642,93,0.261,94,1.284,95,1.131,96,1.574,97,0.489,98,0.485,99,1.911,381,2.371,595,2.936,762,3.826,890,3.042,893,4.403,939,3.724,971,3.377,1024,5.009,1025,3.998,1026,3.826,1043,4.507,1044,5.612,1045,5.428,1046,5.009,1047,3.377,1048,4.507,1049,3.234,1050,4.507,1051,3.234,1052,3.826]],["title/ratios.html",[206,1.667,381,1.207]],["contents/ratios.html",[1,0.325,2,0.08,3,0.458,4,1.431,5,1.21,7,0.458,12,0.021,26,0.374,34,0.458,37,0.503,44,0.548,46,0.461,47,0.182,49,0.445,51,1.657,59,0.445,81,1.116,88,2.103,119,1.841,168,1.726,205,3.934,206,2.59,208,1.726,209,2.852,211,3.472,212,3.934,292,0.982,321,1.965,332,1.523,334,2.103,350,5.482,381,2.219,414,1.965,548,4.278,594,5.482,595,3.232,614,3.934,926,3.514,1045,3.934,1046,3.934,1047,3.472,1052,3.934,1053,4.635,1054,4.635,1055,5.71,1056,4.635,1057,5.71,1058,5.71,1059,4.635,1060,4.635,1061,4.635,1062,5.71,1063,4.635,1064,5.71,1065,4.635,1066,4.635,1067,4.635,1068,4.635,1069,4.635,1070,4.635]],["title/scale-sizes.html",[16,0.064,420,1.134]],["contents/scale-sizes.html",[0,1.532,1,0.307,2,0.089,3,0.389,6,0.37,7,0.461,8,0.465,9,0.753,10,0.988,11,0.995,12,0.022,13,1.783,15,0.558,16,0.122,20,0.566,21,0.825,25,0.729,28,0.934,29,0.934,30,0.946,31,0.993,34,0.508,37,0.426,41,0.729,42,0.753,44,0.316,46,0.415,47,0.215,48,1.64,49,0.447,53,0.239,54,1.02,55,0.995,58,1.187,59,0.466,60,1.374,63,0.461,64,1.315,65,0.7,66,0.988,67,0.729,68,0.888,69,0.988,74,1.195,78,0.542,79,0.891,81,0.643,82,0.888,84,0.53,86,1.272,87,0.643,90,1.206,93,0.317,97,0.659,98,0.822,106,1.072,108,1.299,110,1.299,111,0.995,112,1.643,114,2.418,115,1.398,120,1.511,152,1.132,154,0.775,155,1.213,156,1.63,157,1.736,158,2.464,159,1.977,160,1.882,161,2.6,162,2.441,163,2.115,164,1.63,165,3.07,166,2.418,167,2.041,168,0.995,169,0.934,170,1.398,171,1.299,172,1.398,175,1.211,176,2.486,177,0.775,178,1.211,179,1.299,290,1.299,292,0.988,303,2.001,314,1.798,332,0.877,334,2.6,343,2.441,356,3.493,357,3.957,359,2.332,361,2.267,364,2.267,371,1.643,373,3.493,381,0.877,383,1.783,420,2.21,428,1.666,449,1.141,467,3.183,471,3.149,549,2.267,575,2.944,591,1.299,595,2.224,596,3.335,604,2.441,621,2.418,628,3.957,629,3.957,630,2.639,631,3.146,632,3.998,634,3.957,635,3.852,636,2.639,637,3.998,638,4.864,639,3.867,640,1.663,648,2.001,656,2.944,657,3.957,658,5.266,676,2.652,678,2.869,682,3.335,708,3.493,721,2.268,727,2.267,733,1.802,784,1.511,785,1.643,786,1.511,827,2.869,885,2.001,889,1.299,892,2.652,905,1.643,927,1.802,931,1.398,933,2.652,939,2.91,1025,2.418,1030,2.267,1071,2.67,1072,3.646,1073,2.652,1074,2.267,1075,2.67,1076,2.67,1077,2.67,1078,2.267,1079,2.652,1080,2.67,1081,4.662,1082,2.67,1083,3.929,1084,3.929,1085,3.929]],["title/scale-units.html",[467,1.667,632,2.479]],["contents/scale-units.html",[1,0.294,6,0.464,8,0.73,12,0.016,15,0.669,16,0.107,25,0.855,31,0.798,34,0.456,47,0.215,48,1.805,49,0.332,53,0.594,54,0.915,59,0.41,63,0.51,78,0.456,97,0.5,154,1.651,156,1.611,161,2.09,165,3.408,177,1.338,197,2.412,295,2.836,371,3.798,372,2.413,407,3.839,409,2.768,420,2.045,449,1.651,467,3.208,471,2.768,514,2.979,563,1.83,578,4.829,584,3.109,588,2.836,589,2.242,637,3.839,700,2.608,708,3.452,721,3.003,872,3.109,889,2.242,927,4.165,931,2.413,956,5.62,1086,4.608,1087,4.608,1088,4.608,1089,4.608,1090,4.608,1091,4.608,1092,4.608,1093,4.608]],["title/scale-vars.html",[1,0.12,2,0.047,3,0.268,420,0.836]],["contents/scale-vars.html",[1,0.319,2,0.119,3,0.672,4,2.146,5,1.391,6,0.45,7,0.581,8,0.378,9,0.516,10,0.948,11,1.191,12,0.021,13,2.029,14,0.873,15,0.485,16,0.117,17,0.873,18,1.675,19,1.675,20,0.678,21,0.987,22,1.81,23,1.451,24,1.191,25,1.091,26,0.523,27,1.27,28,1.118,29,1.564,30,1.415,31,0.894,32,1.556,33,1.621,34,0.552,35,2.218,36,2.218,37,0.692,40,1.675,41,1.524,42,0.902,44,0.661,45,1.81,46,0.451,47,0.188,48,0.82,49,0.438,50,1.191,51,0.928,52,1.356,53,0.287,54,1.108,55,1.191,56,1.118,57,1.345,58,0.594,59,0.482,60,1.118,61,0.928,62,1.356,63,0.462,64,1.325,65,0.938,66,1.093,67,0.594,68,0.723,69,0.948,70,1.451,78,0.51,79,0.554,80,2.861,81,1.077,82,1.011,83,1.724,84,0.888,85,2.176,86,1.22,87,1.077,88,2.029,89,2.176,90,0.635,93,0.258,94,1.27,95,1.118,96,1.556,97,0.485,98,0.48,99,1.896,106,1.407,420,2.227,889,2.509,926,3.174,939,2.531,971,4.184,1025,4.083,1072,3.437,1094,5.877,1095,3.796,1096,5.584,1097,6.089,1098,4.918,1099,4.472,1100,3.198,1101,3.198,1102,4.472]],["title/scale.html",[322,1.368,383,1.667]],["contents/scale.html",[1,0.32,2,0.067,7,0.384,8,0.46,9,0.824,12,0.022,15,0.422,16,0.105,20,0.824,26,0.46,28,1.785,30,1.229,34,0.505,37,0.554,44,0.46,47,0.213,48,1.462,49,0.41,53,0.458,54,0.772,56,1.359,58,0.722,59,0.464,63,0.349,64,0.824,65,0.583,74,0.997,78,0.384,79,0.674,82,0.879,84,0.772,90,1.013,93,0.46,95,1.359,97,0.554,98,0.583,141,2.673,144,1.891,147,2.586,153,1.277,154,1.128,159,2.165,164,1.785,174,2.912,177,1.909,196,3.226,197,2.165,208,1.448,285,3.226,287,4.438,292,1.082,297,1.764,312,1.277,322,1.448,323,1.277,324,2.264,325,2.035,326,2.2,327,2.2,328,1.277,329,1.544,331,1.891,334,2.316,351,4.333,381,2.282,383,3.166,400,1.448,405,2.2,408,2.673,412,1.764,414,1.648,415,4.838,417,2.623,418,2.912,420,2.133,449,1.128,467,2.586,471,3.2,563,1.544,572,2.2,589,1.891,621,2.392,632,2.623,656,2.912,678,3.142,721,2.484,728,2.392,825,2.623,891,2.392,894,2.623,927,2.623,932,3.299,933,2.623,1035,3.299,1047,2.912,1072,2.392,1073,2.623,1079,2.623,1098,2.912,1103,3.299,1104,3.887,1105,3.887,1106,3.887,1107,2.912,1108,3.299,1109,3.887,1110,3.887,1111,3.887,1112,3.887,1113,3.887,1114,5.7,1115,3.887,1116,3.887,1117,3.887,1118,3.887,1119,3.887,1120,3.299]],["title/token-api.html",[26,0.296,93,0.296]],["contents/token-api.html",[0,0.791,1,0.323,2,0.091,5,0.51,6,0.378,7,0.483,9,0.389,11,0.897,12,0.021,14,1.196,15,0.598,16,0.124,17,0.657,21,0.743,25,0.447,26,0.55,27,0.956,29,0.842,31,0.417,33,1.056,34,0.608,35,0.956,37,0.475,42,0.389,44,0.728,47,0.218,48,1.468,49,0.352,52,1.021,53,0.47,57,1.263,58,1.201,59,0.502,61,1.056,63,0.326,65,0.361,74,0.933,78,0.36,79,0.417,82,0.822,84,0.97,87,0.58,93,0.476,94,1.444,95,0.842,97,0.598,98,0.658,104,1.261,106,1.678,108,2.133,117,1.444,119,1.94,120,2.765,122,1.444,123,3.721,139,1.804,140,1.482,142,1.482,143,1.625,144,1.172,154,1.878,156,0.842,157,0.897,158,2.083,159,1.021,161,1.092,163,1.65,164,1.834,169,1.272,195,2.454,196,1.363,207,2.044,208,1.355,285,1.363,292,1.214,297,1.65,305,0.771,312,1.195,320,2.786,321,1.859,328,0.791,331,1.172,332,1.937,334,2.502,338,1.021,343,2.295,353,1.482,354,1.363,359,1.989,375,1.905,377,1.092,383,2.502,390,1.625,396,3.227,399,1.363,400,2.43,403,2.725,404,3.659,405,1.363,406,3.241,407,1.625,408,1.905,410,2.238,413,1.482,414,2.071,416,1.172,420,1.354,428,1.542,437,1.65,439,2.044,442,2.044,449,0.699,467,2.379,471,3.328,474,1.804,489,3.721,492,2.725,493,2.044,501,1.804,522,2.698,530,3.296,548,2.725,556,2.454,563,1.444,565,1.363,572,1.363,575,1.804,589,1.172,595,2.059,607,1.905,621,1.482,627,1.625,630,1.363,648,1.804,654,1.804,655,3.659,663,1.804,672,1.804,678,3.394,691,2.454,700,2.765,719,3.284,721,1.172,725,1.363,731,1.804,779,2.044,788,1.172,815,2.698,827,1.482,852,2.044,859,1.804,885,1.804,889,3.081,890,3.864,891,1.482,894,3.722,907,2.044,908,1.482,926,3.227,929,1.482,939,2.481,952,1.804,1025,2.698,1072,2.698,1073,2.454,1074,2.044,1079,1.625,1095,3.087,1098,2.725,1107,3.284,1121,2.044,1122,2.408,1123,2.044,1124,3.087,1125,2.408,1126,2.044,1127,2.044,1128,4.146,1129,2.408,1130,4.146,1131,3.087,1132,2.408,1133,2.044,1134,2.408,1135,2.408,1136,2.408,1137,3.637,1138,2.408,1139,2.044,1140,3.087,1141,2.408,1142,1.804,1143,2.408,1144,2.408,1145,2.958,1146,2.408,1147,2.408,1148,3.087,1149,3.087,1150,3.637,1151,2.408,1152,2.408,1153,3.637,1154,2.408,1155,2.408,1156,2.408]],["title/token-config.html",[26,0.296,160,1.207]],["contents/token-config.html",[1,0.223,6,0.362,7,0.497,8,0.71,12,0.017,16,0.087,20,1.359,26,0.484,31,1.15,34,0.497,44,0.595,47,0.212,53,0.538,57,1.444,65,0.996,93,0.406,97,0.545,122,2.382,160,1.651,197,2.718,206,2.721,208,1.872,292,1.065,312,1.651,352,2.845,359,2.28,399,3.394,400,2.387,401,4.493,437,2.721,443,4.493,466,5.441,468,3.093,474,3.766,481,3.766,486,4.266,487,5.09,488,4.266,498,4.266,499,4.266,538,3.766,849,4.266,1013,5.09,1078,4.266,1145,4.047,1157,5.026]],["title/token-inspect.html",[26,0.296,560,2.479]],["contents/token-inspect.html",[1,0.324,2,0.092,4,1.046,5,0.718,6,0.335,7,0.526,8,0.401,12,0.021,15,0.367,16,0.112,20,0.718,26,0.571,31,0.587,33,1.351,34,0.526,35,1.848,36,1.848,37,0.577,44,0.629,46,0.462,47,0.217,49,0.432,50,1.261,51,0.983,53,0.62,57,1.628,59,0.244,63,0.477,64,0.986,65,0.508,71,3.594,72,2.864,73,3.523,74,1.703,76,3.396,78,0.46,82,1.052,83,1.997,91,3.862,97,0.689,111,1.733,122,1.345,130,2.537,140,2.084,141,2.437,142,3.272,144,1.648,154,1.351,164,2.098,166,2.084,173,4.285,208,1.261,285,2.634,292,0.986,305,0.986,318,2.693,320,2.264,321,1.436,323,1.113,324,1.848,329,2.111,332,1.529,399,1.917,400,2.365,409,1.648,412,2.111,428,1.436,437,1.536,449,1.543,473,1.848,514,3.436,539,2.285,560,3.14,562,3.95,591,1.648,604,1.773,607,1.773,611,2.864,626,3.14,640,0.983,691,3.14,725,1.917,744,2.875,766,3.396,808,1.917,827,2.084,921,2.537,1038,5.262,1121,3.95,1142,2.537,1145,3.14,1158,2.875,1159,3.387,1160,2.875,1161,3.387,1162,3.387,1163,3.486,1164,2.875,1165,3.387,1166,4.653,1167,5.316,1168,5.723,1169,2.875,1170,3.387,1171,5.723,1172,4.288]],["title/token-internal.html",[47,0.1,298,1.918,388,1.764]],["contents/token-internal.html",[1,0.323,2,0.106,5,1.304,6,0.476,7,0.608,12,0.018,15,0.724,16,0.114,17,0.901,20,0.7,26,0.266,37,0.667,42,0.533,44,0.728,47,0.217,49,0.48,59,0.428,63,0.533,74,1.739,81,1.432,86,1.545,93,0.48,97,0.724,106,1.431,111,1.23,117,2.083,143,2.228,144,1.607,147,1.498,155,1.412,161,1.498,165,3.404,168,1.23,177,1.866,206,1.498,292,0.7,298,2.032,303,3.93,312,1.085,328,1.723,333,4.242,334,2.38,377,1.498,387,2.802,388,2.588,405,3.365,420,2.129,542,3.205,565,1.869,640,0.958,659,1.729,676,2.228,709,4.012,728,2.032,889,3.068,923,4.242,934,2.474,952,4.242,1072,2.032,1120,2.802,1123,2.802,1139,4.452,1148,4.452,1173,3.302,1174,3.302,1175,3.302,1176,5.662,1177,4.572,1178,6.306,1179,6.526,1180,6.526,1181,5.662,1182,5.662,1183,3.302,1184,5.945,1185,5.662,1186,3.302,1187,3.302,1188,6.428,1189,4.572,1190,5.662,1191,3.302,1192,5.662,1193,4.572,1194,5.945]],["title/token-register.html",[47,0.117,395,2.752]],["contents/token-register.html",[1,0.295,2,0.08,6,0.412,7,0.46,8,0.55,12,0.022,15,0.672,16,0.123,20,0.985,24,1.731,25,0.863,34,0.46,46,0.462,47,0.231,49,0.412,53,0.513,54,1.135,57,1.599,63,0.417,67,0.863,68,1.051,69,0.985,78,0.566,79,0.806,81,1.12,93,0.375,106,1.268,108,2.262,110,2.262,111,1.731,119,1.846,122,1.846,144,2.262,154,1.66,177,1.349,292,1.313,312,1.527,323,1.527,328,1.527,332,1.879,375,2.434,380,3.483,388,3.825,395,3.483,396,3.52,397,4.285,400,1.731,409,3.015,556,3.137,560,3.137,669,2.861,683,4.855,788,2.262,892,3.86,1158,3.946,1195,4.648,1196,3.946,1197,3.946,1198,4.648,1199,4.648]],["title/token-vars.html",[1,0.12,26,0.218,66,0.574,69,0.574]],["contents/token-vars.html",[0,1.065,1,0.318,2,0.115,3,0.651,4,2.141,5,1.33,6,0.425,7,0.514,12,0.021,15,0.609,16,0.118,17,0.884,20,0.687,25,0.838,26,0.575,29,1.133,30,1.353,31,1.109,33,1.508,34,0.556,35,2.063,36,2.063,37,0.68,41,1.232,42,0.839,44,0.615,46,0.477,47,0.221,48,1.157,49,0.461,50,1.207,51,0.941,52,1.374,53,0.504,54,1.115,55,1.207,56,1.133,57,1.353,58,0.602,59,0.483,60,1.133,61,0.941,62,1.374,63,0.466,64,1.19,65,0.941,66,1.252,67,0.602,68,0.733,69,1.252,70,1.47,71,3.461,72,3.196,73,4,74,1.706,76,3.798,77,3.79,78,0.514,79,0.562,80,2.867,81,1.087,82,1.02,83,1.734,84,0.896,85,1.577,86,1.232,87,1.087,88,2.048,89,2.196,91,3.046,92,2.778,93,0.261,94,1.287,95,1.133,96,1.577,97,0.49,98,0.486,99,1.914,102,2.048,106,0.884,107,1.47,169,1.133,305,1.47,323,1.065,369,2.527,381,1.065,389,2.778,420,1.001,449,0.941,501,2.428,554,2.751,908,1.994,1172,3.382,1200,5.193,1201,4.408,1202,3.241,1203,3.241]],["title/tokens.html",[26,0.296,322,1.368]],["contents/tokens.html",[1,0.316,2,0.107,3,0.645,4,1.563,5,1.073,6,0.223,7,0.306,8,0.517,9,0.888,12,0.022,14,0.844,15,0.474,16,0.115,20,1.381,21,0.955,24,1.626,25,0.574,26,0.57,29,1.527,30,0.745,31,0.536,34,0.544,37,0.335,41,1.382,42,0.937,44,0.599,46,0.249,47,0.22,49,0.418,57,1.398,58,0.811,59,0.418,61,1.597,62,1.311,65,0.464,66,0.926,71,2.472,72,2.687,73,3.707,74,1.649,75,1.852,76,3.409,77,3.713,79,0.536,80,1.311,81,0.745,82,0.699,84,1.005,86,0.844,93,0.409,98,0.655,99,1.852,102,1.403,106,0.844,108,2.464,110,2.464,111,1.151,119,1.228,122,1.734,130,2.316,134,2.472,140,1.903,150,2.687,153,1.016,154,0.897,155,0.955,157,1.626,171,2.125,181,1.504,206,1.981,208,1.151,209,1.903,292,1.381,293,1.903,297,1.403,298,1.903,305,1.381,314,1.527,318,1.311,320,2.125,322,1.151,323,1.435,324,2.392,325,1.619,326,1.75,327,1.75,328,1.979,329,1.734,332,2.077,338,1.852,343,1.619,353,1.903,354,3.114,356,2.316,359,2.496,363,2.624,372,1.619,373,2.316,375,2.287,377,1.403,379,2.086,381,1.016,385,2.316,388,2.866,396,1.903,397,2.316,398,2.624,399,1.75,400,1.151,401,2.316,402,2.624,403,3.272,404,3.272,405,1.75,406,1.75,407,2.086,408,1.619,409,2.125,410,2.687,411,2.624,412,1.403,413,3.116,420,0.955,428,1.311,449,0.897,471,1.504,522,1.903,547,2.624,559,2.316,564,3.272,571,2.947,572,2.472,574,2.086,631,2.086,640,0.897,649,2.316,653,1.619,659,1.619,676,2.086,688,2.947,732,3.706,766,3.285,772,3.706,808,1.75,813,2.086,854,2.624,863,2.624,864,3.706,865,2.624,867,2.624,874,2.316,884,2.624,888,2.624,889,1.504,890,2.086,891,1.903,892,2.086,899,2.316,903,2.624,906,2.624,911,2.624,912,2.947,913,2.624,915,2.624,916,2.624,917,3.706,929,1.903,1124,2.624,1126,2.624,1169,2.624,1172,3.272,1197,3.706,1201,2.624,1204,3.091,1205,3.091,1206,3.091,1207,3.091,1208,3.091,1209,3.091,1210,3.091,1211,3.091,1212,4.367,1213,3.091,1214,3.091,1215,3.091,1216,3.091,1217,3.091,1218,4.367,1219,4.367,1220,4.367,1221,3.091,1222,3.091,1223,2.624,1224,2.624,1225,3.091,1226,3.091,1227,3.091,1228,3.091,1229,3.091]],["title/type-a11y.html",[93,0.361]],["contents/type-a11y.html",[1,0.237,12,0.021,25,0.991,46,0.531,53,0.557,56,1.868,63,0.479,74,1.369,78,0.528,93,0.502,377,2.423,423,4.926,437,2.423,872,3.604,931,2.797,1130,4.533,1230,5.341,1231,5.341,1232,6.574,1233,6.215,1234,6.77,1235,5.58,1236,6.215]],["title/type-font-vars.html",[1,0.12,2,0.047,3,0.268,449,0.786]],["contents/type-font-vars.html",[1,0.32,2,0.117,3,0.665,4,2.101,5,1.372,6,0.466,7,0.567,8,0.354,9,0.483,10,0.905,11,1.115,12,0.023,13,1.937,14,0.817,15,0.463,16,0.118,17,0.817,18,1.568,19,1.568,20,0.635,21,0.925,22,1.695,23,1.359,24,1.115,25,1.064,26,0.515,27,1.189,28,1.047,29,1.493,30,1.381,31,0.862,32,1.457,33,1.574,34,0.536,35,2.154,36,2.154,37,0.68,40,1.568,41,1.358,42,0.876,44,0.589,46,0.438,47,0.2,48,0.768,49,0.476,50,1.115,51,0.869,52,1.27,53,0.486,54,1.077,55,1.115,56,1.047,57,1.306,58,0.556,59,0.5,60,1.047,61,0.869,62,1.27,63,0.446,64,1.3,65,0.921,66,1.263,67,0.556,68,0.677,69,1.215,70,1.359,74,1.608,78,0.492,79,0.519,80,2.83,81,1.028,82,0.965,83,1.675,84,0.847,85,2.077,86,1.165,87,1.028,88,1.937,89,2.077,90,0.594,93,0.242,94,1.189,95,1.047,96,1.457,97,0.463,98,0.449,99,1.27,172,2.605,449,2.102,468,3.338,606,3.984,640,1.444,643,2.881,666,2.881,668,2.881,1237,3.624,1238,4.465,1239,4.85,1240,4.063,1241,5.961,1242,5.423,1243,4.269,1244,2.995]],["title/type-fonts.html",[16,0.064,449,1.066]],["contents/type-fonts.html",[0,0.571,1,0.315,2,0.094,3,0.351,6,0.434,7,0.577,8,0.483,9,0.851,10,0.866,12,0.022,13,0.788,14,1.312,15,0.487,16,0.121,17,0.474,21,0.536,23,0.788,24,1.79,25,0.833,26,0.14,27,0.69,29,0.985,30,0.855,33,0.817,34,0.577,37,0.572,41,1.115,42,0.851,44,0.333,46,0.452,47,0.197,49,0.449,50,0.647,53,0.513,54,1.111,57,1.312,59,0.323,60,0.985,63,0.502,64,1.354,65,0.876,66,0.866,67,0.758,68,1.086,69,1.155,78,0.501,79,0.301,80,1.506,82,1.192,84,0.811,90,1.081,93,0.44,95,0.607,97,0.487,98,0.958,108,1.728,110,0.845,113,1.474,115,1.475,117,1.41,119,2.094,120,1.594,122,1.41,141,0.91,143,1.172,152,0.737,153,0.571,154,1.031,155,1.097,156,1.57,157,2.085,158,1.622,160,1.579,161,0.788,164,1.57,166,1.069,167,1.049,168,1.672,169,0.607,175,0.788,177,0.504,178,0.788,179,0.845,197,1.194,208,1.672,290,0.845,291,1.474,292,1.155,293,1.069,294,1.069,295,1.733,297,1.278,312,0.925,313,1.301,314,1.57,320,0.845,323,1.342,324,2.518,325,0.91,329,2.536,332,0.925,343,0.91,352,1.594,354,2.541,359,2.54,367,1.301,371,1.069,372,2.853,375,0.91,390,1.172,391,1.474,399,0.983,400,2.379,405,0.983,406,0.983,409,0.845,410,2.186,413,2.186,414,1.194,416,1.37,428,0.737,435,2.39,437,0.788,449,2.114,450,3.601,451,1.474,455,1.301,456,1.474,477,1.474,491,3.014,505,1.9,533,3.363,539,1.9,559,2.661,563,1.118,564,2.661,565,0.983,569,2.11,572,2.01,591,0.845,604,0.91,605,1.474,606,3.593,607,3.263,608,1.474,609,1.474,610,1.474,611,3.754,630,0.983,635,1.301,640,1.662,643,4.006,645,3.94,652,1.301,653,0.91,663,1.301,666,3.244,668,3.244,669,1.069,675,1.474,681,1.301,685,4.29,687,4.751,694,1.301,700,1.594,721,1.37,725,0.983,733,1.172,784,0.983,785,1.069,786,2.312,808,1.594,813,1.172,825,1.9,831,2.514,839,1.474,844,1.172,859,1.301,872,1.172,899,1.301,905,1.069,910,1.474,912,1.172,919,2.11,976,1.301,1019,1.301,1127,2.39,1133,1.474,1163,1.301,1196,1.474,1224,2.39,1238,4.243,1239,3.601,1240,2.661,1245,4.624,1246,3.014,1247,3.467,1248,1.737,1249,3.467,1250,2.816,1251,2.39,1252,1.737,1253,2.816,1254,1.737,1255,1.474,1256,3.014,1257,1.737,1258,2.816,1259,1.737,1260,1.737,1261,5.289,1262,1.737,1263,4.489,1264,1.737,1265,2.816,1266,4.085,1267,3.551,1268,1.737,1269,1.737,1270,1.737,1271,1.737,1272,1.737,1273,5.598,1274,3.551,1275,1.737,1276,1.737,1277,1.737,1278,1.737,1279,2.816,1280,1.737,1281,1.737,1282,2.816,1283,1.737,1284,1.737,1285,2.39,1286,1.737,1287,1.737,1288,4.489,1289,1.737,1290,1.737,1291,2.816,1292,2.816,1293,3.014,1294,1.474,1295,5.272,1296,3.551,1297,4.085,1298,1.737,1299,1.737,1300,1.737,1301,1.737,1302,1.737,1303,1.737,1304,1.737,1305,1.737,1306,1.737,1307,3.467,1308,1.737,1309,1.474,1310,2.816,1311,2.816,1312,2.816,1313,2.816,1314,4.085,1315,1.737,1316,1.737,1317,2.816,1318,2.39,1319,4.806,1320,1.474,1321,1.737,1322,1.737]],["title/type-helpers.html",[14,1.002,659,1.924]],["contents/type-helpers.html",[1,0.301,2,0.111,6,0.461,7,0.497,10,1.065,12,0.017,14,1.371,24,1.872,37,0.545,44,0.595,46,0.406,47,0.205,53,0.538,63,0.451,78,0.497,97,0.65,98,0.754,208,1.872,324,1.996,329,2.763,414,2.131,449,2.049,455,3.766,539,3.392,607,2.632,645,3.392,653,2.632,721,2.446,789,4.266,831,3.093,844,3.392,1164,4.266,1237,4.266,1238,4.047,1240,3.766,1247,4.266,1256,5.09,1285,5.441,1309,4.266,1323,5.997,1324,5.026,1325,5.026,1326,5.997,1327,5.026]],["title/type-pseudo.html",[931,1.924,1328,2.752]],["contents/type-pseudo.html",[6,0.469,12,0.021,46,0.526,59,0.469,63,0.584,69,1.381,79,0.906,84,1.293,108,2.543,111,1.946,155,2.012,176,3.11,343,2.736,640,1.517,709,3.526,886,6.054,931,3.589,1328,4.598,1329,5.226]],["title/type.html",[14,1.002,322,1.368]],["contents/type.html",[1,0.317,9,0.723,12,0.021,14,1.525,16,0.078,20,0.949,25,1.037,41,1.222,42,1.06,49,0.459,57,1.078,64,0.949,79,0.776,93,0.515,98,0.672,106,1.222,111,2.081,153,1.471,160,1.836,292,0.949,322,1.668,324,2.785,325,2.344,326,2.534,327,2.534,328,1.471,329,2.42,335,3.354,372,2.344,400,1.668,409,2.179,449,2.077,606,3.439,611,4.262,643,3.021,645,3.021,659,2.926,666,4.111,667,3.8,668,3.771,721,2.179,808,2.534,831,3.439,844,3.021,887,3.8,919,4.187,931,2.344,1079,3.021,1103,3.8,1107,3.354,1108,3.8,1131,3.8,1238,4.111,1239,4.187,1245,5.171,1246,3.8,1249,3.8,1251,4.743,1261,3.8,1293,3.8,1294,3.8,1307,4.743,1318,3.8,1320,3.8,1328,3.354,1330,4.477,1331,4.477,1332,4.477,1333,4.477,1334,4.477,1335,4.477,1336,4.477]],["title/utils.html",[1,0.106,6,0.172,16,0.041,20,0.507,640,0.694]],["contents/utils.html",[0,0.811,1,0.319,2,0.092,5,1.18,6,0.515,7,0.524,8,0.659,9,0.398,11,0.919,12,0.021,15,0.575,16,0.118,17,1.35,20,1.332,21,0.762,23,1.12,26,0.299,31,0.965,32,2.165,34,0.571,37,0.604,44,0.627,46,0.449,47,0.226,48,0.633,49,0.178,50,2.263,53,0.611,57,1.277,59,0.416,63,0.499,74,1.359,78,0.551,79,0.857,81,1.277,82,0.558,83,0.762,87,0.594,97,0.721,98,0.668,106,1.011,107,1.681,111,0.919,117,2.293,120,3.268,122,0.98,144,1.201,147,2.019,155,1.719,156,1.556,158,0.98,164,2.197,165,1.803,167,2.073,169,0.863,170,1.292,171,1.201,172,1.292,175,1.12,176,1.681,177,1.436,179,1.803,197,2.519,305,0.943,312,0.811,321,2.361,324,2.211,328,1.462,352,3.439,367,3.333,372,1.292,375,2.59,377,2.405,378,3.333,381,0.811,389,1.519,409,1.803,412,2.019,416,1.201,420,1.374,437,1.12,449,1.292,471,1.803,492,2.776,495,1.849,514,1.292,524,1.665,530,3.002,556,1.665,563,0.98,604,2.33,606,2.28,621,3.044,623,5.563,624,5.334,625,5.334,626,1.665,630,3.737,640,1.991,652,2.776,654,1.849,655,2.776,660,2.095,661,3.145,665,2.095,678,3.426,684,4.725,685,2.776,694,2.776,700,1.397,725,3.557,729,3.145,766,1.397,815,3.044,889,1.201,897,2.095,908,1.519,909,4.499,923,2.776,954,3.577,957,4.198,961,2.095,989,2.095,1073,1.665,1128,3.145,1140,2.095,1142,1.849,1145,2.501,1149,4.198,1160,2.095,1235,2.095,1255,4.725,1337,2.468,1338,4.449,1339,4.449,1340,4.945,1341,5.566,1342,4.449,1343,2.468,1344,3.705,1345,2.468,1346,3.705,1347,3.705,1348,2.468,1349,2.468,1350,3.705,1351,3.705,1352,3.705,1353,3.705,1354,3.705,1355,2.468,1356,2.468,1357,2.468,1358,4.945,1359,4.945]],["title/vars.html",[2,0.054,66,0.661,69,0.661]],["contents/vars.html",[0,1.285,1,0.318,2,0.118,3,0.668,4,1.583,5,1.335,6,0.453,7,0.507,11,1.457,12,0.023,16,0.114,17,1.399,20,1.335,26,0.508,31,1.051,33,1.135,34,0.565,35,2.036,36,2.036,37,0.556,41,1.719,42,0.828,44,0.606,46,0.461,47,0.206,48,1.314,49,0.481,53,0.351,54,1.135,59,0.465,60,1.368,61,1.135,62,1.659,63,0.46,65,0.858,66,1.416,67,0.726,68,0.884,69,1.416,78,0.507,82,0.884,84,1.017,98,0.858,117,2.271,119,2.036,169,1.368,208,1.909,211,2.93,292,0.829,305,1.48,312,1.684,323,1.285,328,1.684,338,1.659,389,3.734,392,3.84,393,3.32,394,3.32,400,1.909,473,1.553,563,1.553,591,1.903,630,2.901,766,3.434,908,2.407,912,2.639,1019,4.546,1163,2.93,1223,3.32,1360,3.911,1361,5.125,1362,3.911,1363,3.911,1364,3.911,1365,6.067,1366,6.067,1367,3.911,1368,3.911,1369,3.911,1370,3.911,1371,3.911,1372,3.911,1373,3.911,1374,5.125,1375,3.911,1376,3.911]]],"invertedIndex":[["",{"_index":1,"title":{"animate-change-vars.html":{"position":[[8,1]]},"animate-ease-vars.html":{"position":[[7,1]]},"animate-time-vars.html":{"position":[[6,1]]},"color-contrast.html":{"position":[[9,1]]},"color-vars.html":{"position":[[13,1]]},"ratio-vars.html":{"position":[[13,1]]},"scale-vars.html":{"position":[[6,1]]},"token-vars.html":{"position":[[7,1]]},"type-font-vars.html":{"position":[[6,1]]},"utils.html":{"position":[[18,1]]}},"contents":{"animate-change-vars.html":{"position":[[8,1],[85,1],[456,2],[615,1],[654,1],[674,1],[702,1],[728,2],[746,2],[788,2],[1142,1],[1345,1],[1430,2],[1438,1],[1464,1],[1466,1],[1486,1],[1558,1],[1612,2],[1754,3],[1864,1],[1957,3],[2324,1],[2409,2],[2421,1],[2509,1],[2533,1],[2626,1],[2842,1],[2860,3],[2921,3],[3360,1],[3445,2],[3457,1],[3543,1],[3567,1],[3650,1]]},"animate-change.html":{"position":[[35,1],[132,1],[247,2],[549,1],[551,2],[637,2],[739,2],[785,2],[890,2],[983,2],[1036,2],[1066,1],[1473,1],[1571,1],[2003,1],[2047,1],[2118,1],[2436,1],[2584,1],[2626,2],[2638,1],[2675,1],[2699,1],[2741,1],[2892,1],[3042,1],[3076,2],[3088,1],[3125,1],[3149,1],[3187,1]]},"animate-ease-vars.html":{"position":[[7,1],[82,1],[453,2],[620,1],[655,1],[675,1],[735,1],[760,2],[776,2],[815,2],[1175,1],[1381,1],[1479,2],[1487,1],[1512,1],[1514,1],[1534,1],[1661,1],[1727,2],[1867,3],[1977,1],[2068,3],[2432,1],[2530,2],[2542,1],[2626,1],[2650,1],[2743,1],[2971,1],[2987,3],[3048,3],[3492,1],[3590,2],[3602,1],[3706,1],[3730,1],[3828,1]]},"animate-ease.html":{"position":[[343,1],[345,3],[371,2],[374,1],[389,3],[407,2],[410,3],[430,2],[433,3],[459,2],[462,3],[515,2],[518,3],[573,2],[576,3],[631,2],[634,3],[689,2],[692,3],[743,2],[746,3],[800,2],[803,3],[855,2],[858,3],[912,2],[915,3],[968,2],[971,3],[1024,2],[1027,3],[1079,2],[1082,3],[1130,2],[1133,3],[1185,2],[1188,3],[1235,2],[1238,3],[1290,2],[1293,3],[1349,2],[1352,3],[1411,2],[1414,3],[1471,2],[1474,3],[1526,2],[1529,3],[1580,2],[1583,3],[1640,2],[1643,3],[1687,2],[1690,3],[1748,2],[1751,3],[1809,2],[1852,2],[1868,2],[1912,1],[2058,1],[2270,2],[2501,1],[2628,2],[2657,1],[3051,1],[3142,1],[3684,1]]},"animate-time-vars.html":{"position":[[6,1],[77,1],[444,2],[595,1],[630,1],[650,1],[674,1],[698,2],[714,2],[752,2],[1098,1],[1293,1],[1346,2],[1354,1],[1378,1],[1380,1],[1400,1],[1460,1],[1510,2],[1648,3],[1756,1],[1847,3],[2208,1],[2278,2],[2290,1],[2376,1],[2400,1],[2485,1],[2697,1],[2713,3],[2772,3],[3207,1],[3275,2],[3287,1],[3370,1],[3394,1],[3472,1]]},"animate-times.html":{"position":[[23,1],[57,1],[156,2],[410,1],[491,2],[549,2],[577,1],[1063,1],[1144,1],[1630,1]]},"animate.html":{"position":[[50,1],[345,1],[444,1],[493,2],[505,1],[580,2],[614,1],[791,1],[862,1],[941,1],[991,1],[1199,2],[1233,1],[1301,1],[1340,1],[1408,1]]},"CHANGELOG.html":{"position":[[323,1],[692,1],[1179,1],[1583,1],[1706,1],[1765,1],[4289,2],[4392,1],[6776,2],[6965,1],[7037,1],[7043,1],[7225,1],[7254,3],[7265,3],[7556,1],[7746,1],[7953,1],[8049,3],[8059,3],[8126,3],[8136,3],[8207,3],[8219,3],[8566,3],[8577,3],[8828,3],[8838,3],[8903,3],[8914,3],[9309,3],[9319,3],[10476,1],[11160,1],[11517,1],[11739,1],[13966,1],[14354,1]]},"color-config.html":{"position":[[64,1],[237,1]]},"color-contrast.html":{"position":[[225,1],[250,1],[309,1],[548,1],[561,1],[569,1],[576,1],[635,1],[733,1],[886,1],[921,1],[972,2],[980,1],[1053,2],[1056,1],[1076,1],[1092,1],[1112,1],[1144,1],[1195,2],[1203,1],[1283,2],[1286,1],[1306,1],[1341,1],[1873,1],[1903,1],[1984,1],[2223,1],[2236,1],[2244,1],[2251,1],[2310,1],[2597,1],[2648,2],[2656,1],[2733,2],[2736,1],[2756,1],[2821,1],[2856,1],[2907,2],[2915,1],[2999,2],[3002,1],[3022,1],[3106,1],[3173,1],[3359,1],[3495,1],[3520,1],[3579,1],[3818,1],[3831,1],[3839,1],[3846,1],[3905,1],[4179,1],[4230,2],[4238,1],[4307,2],[4310,1],[4330,1],[4346,1],[4381,1],[4432,2],[4440,1],[4516,2],[4519,1],[4539,1],[4554,1],[4880,1],[4910,1],[4991,1],[5230,1],[5243,1],[5251,1],[5258,1],[5317,1],[5646,1],[5697,2],[5705,1],[5778,2],[5781,1],[5801,1],[5841,1],[5876,1],[5927,2],[5935,1],[6015,2],[6018,1],[6038,1],[6077,1],[6360,2],[6372,2],[6387,2],[6405,1],[6428,1],[6543,1],[6692,1],[6705,1],[6713,1],[6722,1],[6917,2],[6975,2],[6978,2],[7039,2],[7055,2],[7078,2],[7081,2],[7104,2],[7403,1],[7428,1]]},"color-themes.html":{"position":[[523,1],[557,2],[729,1],[731,2],[763,2],[766,1],[781,2],[826,2],[829,2],[859,2],[862,2],[912,2],[915,2],[971,2],[974,2],[1030,2],[1033,2],[1076,2],[1079,2],[1107,2],[1110,2],[1158,2],[1161,2],[1215,2],[1218,2],[1272,2],[1540,1],[1569,1],[1719,1],[1830,2],[1833,1],[1869,1],[2148,1],[2463,1],[2526,1],[2617,2],[2620,1],[2656,1],[2941,1]]},"color-tokens.html":{"position":[[45,2],[304,1],[397,2],[455,2],[484,1],[1158,1],[1235,2],[1275,1],[1353,2],[1419,1],[1474,2],[1966,1],[2144,1],[2200,2],[2217,1],[2265,2],[2970,1],[2995,1],[3111,1],[3413,1],[3449,2],[3457,1],[3514,1],[3534,1],[3591,1]]},"color-utils.html":{"position":[[369,1],[394,1],[647,1],[1188,1],[1213,1],[1464,1]]},"color-vars.html":{"position":[[7,1],[81,1],[450,2],[606,1],[643,1],[663,1],[690,1],[740,2],[757,2],[797,2],[1147,1],[1346,1],[1431,2],[1439,1],[1464,1],[1466,1],[1486,1],[1555,1],[1607,2],[1747,3],[1856,1],[1948,3],[2312,1],[2397,2],[2409,1],[2495,1],[2519,1],[2608,1],[2822,1],[2839,3],[2899,3],[3336,1],[3421,2],[3433,1],[3515,1],[3539,1],[3618,1]]},"color.html":{"position":[[546,1],[548,2],[646,2],[730,2],[821,2],[872,1],[905,1],[1203,1],[1280,2],[1294,1],[1389,2],[1392,2],[1617,1],[1859,1],[1861,2],[1976,2],[2145,1]]},"CONTRIBUTING.html":{"position":[[581,1],[594,1]]},"index.html":{"position":[[280,1],[538,1],[655,1],[690,1],[717,2],[843,2],[1004,1],[1086,1],[1138,1],[1190,1],[1255,1],[1327,1],[1418,1],[1496,1],[1653,1],[1684,2],[1788,1],[1854,1],[1870,2],[1892,1],[1924,1],[1935,1],[1956,2],[1983,2],[1986,2],[2357,1],[2646,1]]},"layout-queries.html":{"position":[[52,2],[211,1],[486,1],[519,2],[572,1],[657,2],[1067,1],[1142,1],[1410,1],[2224,1],[2344,1],[2485,1],[2492,1],[2511,1],[2513,1],[2556,1],[2563,1],[2582,1],[2584,1],[2654,1],[2661,1],[2680,1],[2682,1],[2725,1],[2732,1],[2751,1],[2753,1],[3315,1],[3435,1],[3576,1],[3583,1],[3604,1],[3606,1],[3646,1],[3653,1],[3674,1],[3676,1],[3750,1],[3757,1],[3778,1],[3780,1],[3820,1],[3827,1],[3848,1],[3850,1],[4426,1],[4549,1],[4682,1],[4831,1],[4838,1],[4860,1],[4862,1],[4927,1],[4934,1],[4956,1],[4958,1],[4985,1],[5015,2],[5057,1],[5064,1],[5086,1],[5088,1],[5153,1],[5160,1],[5182,1],[5184,1],[5288,1],[5296,1]]},"layout-z-index.html":{"position":[[31,2],[332,1],[342,2],[358,2],[397,2],[417,2],[431,2],[436,2],[660,1],[992,1]]},"layout.html":{"position":[[437,1],[454,2],[471,1],[494,2],[579,1],[626,1],[644,1],[646,1],[659,1],[684,1],[701,1],[703,1]]},"LICENSE.html":{"position":[[22,1]]},"ratio-tokens.html":{"position":[[116,2],[268,1],[292,1],[333,2],[635,1],[660,1],[718,1],[984,2],[1022,2],[1025,2],[1061,2],[1077,2],[1091,2],[1094,2],[1109,2],[1415,1],[1803,1],[1828,1],[2083,1],[2094,1],[2212,2],[2253,2],[2256,2],[2287,2],[2290,2],[2329,2],[2332,2],[2365,2],[2381,2],[2395,2],[2398,2],[2410,2],[2413,2],[2431,2],[2434,2],[2449,2]]},"ratio-vars.html":{"position":[[13,1],[87,1],[232,2],[389,1],[414,1],[416,1],[436,1],[464,1],[489,2],[506,2],[546,2],[896,1],[1095,1],[1154,2],[1162,1],[1187,1],[1189,1],[1209,1],[1269,1],[1335,2],[1477,3],[1586,1],[1678,3],[2042,1],[2101,2],[2113,1],[2208,1],[2232,1],[2314,1],[2542,1],[2559,3],[2619,3],[3056,1],[3115,2],[3127,1],[3197,1],[3236,1],[3245,1],[3269,1],[3339,1],[3369,1],[3378,1]]},"ratios.html":{"position":[[317,1],[319,3],[345,2],[348,1],[363,3],[379,2],[382,3],[409,2],[412,3],[446,2],[449,3],[481,2],[484,3],[507,2],[510,3],[527,2],[530,3],[562,2],[565,3],[592,2],[595,3],[619,2],[622,3],[645,2],[648,3],[674,2],[677,3],[710,2],[713,3],[730,2],[733,3],[761,2],[764,3],[795,2],[798,3],[817,2],[820,3],[845,2],[889,2],[906,2]]},"scale-sizes.html":{"position":[[46,1],[97,1],[555,1],[604,1],[1155,1],[1257,1],[1285,2],[1727,1],[1902,1],[1946,2],[2612,1],[2695,1],[2707,1],[3702,1],[3726,1],[3735,1],[4070,1],[4082,1],[4510,1],[5001,1],[5025,1],[5034,1],[5369,1],[5381,1]]},"scale-units.html":{"position":[[180,1],[347,1],[373,1],[563,1],[845,1]]},"scale-vars.html":{"position":[[6,1],[77,1],[444,2],[596,1],[631,1],[651,1],[676,1],[700,2],[716,2],[754,2],[1100,1],[1295,1],[1366,2],[1374,1],[1398,1],[1400,1],[1420,1],[1482,1],[1532,2],[1670,3],[1778,1],[1869,3],[2230,1],[2301,2],[2313,1],[2396,1],[2420,1],[2503,1],[2715,1],[2731,3],[2790,3],[3225,1],[3296,2],[3308,1],[3389,1],[3413,1],[3488,1]]},"scale.html":{"position":[[28,1],[388,1],[467,1],[487,2],[498,1],[500,2],[567,2],[611,2],[648,2],[843,2],[921,1],[949,2],[1047,1],[1095,1],[1422,1],[1446,1],[1503,1],[1512,1],[1853,2],[1906,2],[1909,2],[1947,2],[1950,2],[1995,2],[2011,2],[2045,2],[2048,2],[2072,2],[2075,2],[2091,2]]},"token-api.html":{"position":[[167,1],[198,2],[538,1],[552,1],[680,2],[692,2],[706,1],[741,2],[834,2],[850,2],[863,1],[876,1],[932,1],[944,2],[1070,2],[1092,2],[1108,1],[1136,1],[1196,2],[1230,2],[1238,1],[1302,2],[1326,2],[1340,1],[1372,1],[1418,2],[1421,2],[1698,2],[1734,1],[1760,1],[1819,2],[1822,2],[1912,2],[1960,1],[1986,1],[2045,2],[2048,2],[2097,1],[2141,1],[2455,1],[2529,2],[2670,1],[2725,1],[2806,2],[3059,1],[3103,1],[3124,1],[3156,2],[3159,2],[3345,1],[3389,1],[3410,1],[3424,1],[3483,2],[3486,2],[3489,2],[3535,1],[4534,1],[4609,3],[4685,1],[4762,3],[4851,1],[4907,1],[4934,2],[4937,2],[4940,3],[4987,2],[5003,3],[5024,2],[5063,1],[5074,1],[5088,2],[5091,2],[5094,3],[5140,2],[5156,3],[5169,2],[5246,1],[5282,1],[5309,3],[5334,2],[5350,3],[5365,2],[5723,1],[5800,3],[5849,3],[5937,1],[5962,2],[5991,1],[6018,2],[6021,3],[6067,2],[6083,3],[6104,2]]},"token-config.html":{"position":[[29,1]]},"token-inspect.html":{"position":[[303,1],[318,3],[492,3],[540,2],[543,3],[589,2],[605,3],[614,2],[617,3],[627,2],[703,2],[861,1],[965,1],[1030,3],[1077,3],[1196,3],[1344,1],[1436,2],[1439,3],[1492,2],[1495,3],[1564,2],[1567,3],[1620,2],[1623,3],[1693,2],[1709,3],[1727,2],[1730,3],[1766,2],[1769,3],[1786,2],[1789,3],[1807,2],[1896,2],[2167,1],[2232,3],[2267,2],[2292,3],[2373,1],[2516,1],[2557,1],[2583,1],[2585,2],[2588,3],[2636,2],[2639,3],[2685,2],[2688,3],[2762,2],[2765,3],[2843,2],[2859,3],[2875,2],[2878,3],[2894,2],[2897,3],[2926,2],[2929,3],[2960,2],[3036,1]]},"token-internal.html":{"position":[[334,1],[429,2],[432,3],[473,2],[476,3],[519,2],[535,3],[551,2],[554,3],[571,2],[747,4],[763,1],[787,1],[861,1],[1001,1],[1072,2],[1075,3],[1118,2],[1134,3],[1151,2],[1342,1],[1344,2],[1358,1],[1382,1],[1463,1],[1609,1],[1679,2],[1682,3],[1721,2],[1737,3],[1751,2],[1931,4],[1947,1],[1971,1],[2047,1],[2200,1],[2248,2],[2251,3],[2294,2],[2310,3],[2327,2],[2494,4],[2510,1],[2534,1],[2607,1],[2757,1],[2804,2],[2807,3],[2846,2],[2862,3],[2876,2],[3089,4],[3105,1],[3129,1],[3202,1],[3328,1],[3374,2],[3377,3],[3414,2],[3430,3],[3443,2]]},"token-register.html":{"position":[[268,2],[314,1],[398,1],[458,2],[884,1]]},"token-vars.html":{"position":[[7,1],[170,2],[378,3],[443,1],[506,3],[791,1],[869,1],[976,2],[988,1],[1092,1],[1116,1],[1181,1],[1306,2],[1324,2],[1676,1],[1770,1],[1920,1],[2027,2],[2035,1],[2077,3],[2081,1],[2101,1],[2170,1],[2195,2],[2403,1],[2476,3],[2536,3],[2828,1],[2984,1],[3091,2],[3103,1],[3203,1],[3227,1],[3294,1],[3501,2]]},"tokens.html":{"position":[[125,1],[156,2],[360,1],[836,1],[1411,1],[1534,1],[1593,1],[2230,1],[2275,2],[2378,1],[2462,2],[2602,1],[2639,1],[2694,1],[3067,1],[3152,2],[3160,1],[3162,2],[3246,2],[3383,1],[3403,1],[3521,1],[3601,1],[3765,1],[3799,2],[3849,1],[3935,2],[3938,2],[3958,1],[4219,1],[4288,2]]},"type-a11y.html":{"position":[[231,1]]},"type-font-vars.html":{"position":[[6,1],[77,1],[444,2],[538,1],[551,1],[594,1],[596,2],[633,1],[668,1],[688,1],[745,1],[769,2],[785,2],[823,2],[1169,1],[1283,1],[1464,1],[1479,1],[1536,2],[1578,2],[1586,1],[1610,1],[1612,1],[1696,2],[1834,3],[1942,1],[2033,3],[2318,1],[2500,1],[2515,1],[2572,2],[2614,2],[2626,1],[2714,1],[2738,1],[2832,1],[3078,1],[3094,3],[3153,3],[3512,1],[3695,1],[3710,1],[3767,2],[3809,2],[3821,1],[3872,1],[3896,1],[3941,1]]},"type-fonts.html":{"position":[[103,1],[586,2],[917,2],[920,1],[1069,2],[2688,1],[3210,1],[4288,1],[4298,1],[4611,2],[4731,2],[4734,2],[4774,2],[4846,1],[4870,2],[4916,1],[4926,1],[5005,1],[5102,2],[5122,1],[5233,2],[5236,2],[5239,2],[5289,1],[5303,1],[5381,1],[5487,2],[5498,1],[5606,2],[5609,2],[5612,2],[5981,1],[5990,1],[6318,1],[6393,2],[7146,1],[7162,3],[7744,1],[8030,1],[8040,1],[8109,2],[8112,2],[8120,1],[8162,1],[8182,1],[8203,1],[8635,1],[8655,1],[8698,2],[8728,2],[8736,1],[8774,1],[8794,1],[8815,1],[9189,1],[9451,1],[9466,1],[9666,2],[9669,2],[10297,1],[10479,1],[10494,1],[10694,2],[10697,2],[10795,1],[10836,2],[10839,2]]},"type-helpers.html":{"position":[[223,1],[458,2],[469,2],[485,2],[528,2]]},"type.html":{"position":[[423,2],[498,1],[500,2],[571,1],[745,2],[748,2],[789,1],[881,2],[884,2],[933,2],[1046,2],[1114,2],[1248,1],[1280,1],[1293,1],[1328,1]]},"utils.html":{"position":[[549,1],[822,1],[927,2],[930,3],[977,2],[993,3],[1027,2],[1431,1],[1473,1],[1628,1],[2454,1],[2480,1],[2543,3],[2577,2],[2580,3],[2763,2],[2798,2],[2865,1],[2889,1],[2954,2],[2957,3],[2994,2],[3010,3],[3023,1],[3030,2],[3538,1],[3610,3],[3797,2],[3832,2],[3899,1],[3938,1],[3968,2],[3971,3],[4008,2],[4024,3],[4038,1],[4047,2],[4476,1],[4613,3],[4807,4],[4973,1],[5114,1],[5148,1],[5150,3],[5154,2],[5157,3],[5188,2],[5204,3],[5220,2],[5762,1],[5874,1],[5876,2],[5939,1],[5953,1],[5971,2],[5974,3],[6005,2],[6021,3],[6037,2]]},"vars.html":{"position":[[111,1],[806,1],[876,1],[920,2],[928,1],[961,1],[992,4],[1008,1],[1010,1],[1030,1],[1088,1],[1166,2],[1633,1],[1683,3],[1687,1],[1734,1],[1844,1],[1997,1],[2041,2],[2049,1],[2096,3],[2100,1],[2120,1],[2178,1]]}}}],["0",{"_index":232,"title":{},"contents":{"animate-ease.html":{"position":[[725,2],[1512,2],[1567,2],[1677,2],[1680,2]]},"CHANGELOG.html":{"position":[[5223,2]]},"color-contrast.html":{"position":[[571,1],[2246,1],[3841,1],[5253,1]]},"color-themes.html":{"position":[[873,2],[1120,2],[1913,2],[2706,2]]}}}],["0.01em",{"_index":935,"title":{},"contents":{"layout-queries.html":{"position":[[1885,7],[2981,7],[4087,7]]}}}],["0.03",{"_index":222,"title":{},"contents":{"animate-ease.html":{"position":[[611,5],[1390,5]]}}}],["0.035",{"_index":238,"title":{},"contents":{"animate-ease.html":{"position":[[792,7]]}}}],["0.04",{"_index":241,"title":{},"contents":{"animate-ease.html":{"position":[[835,5]]}}}],["0.045",{"_index":246,"title":{},"contents":{"animate-ease.html":{"position":[[904,7],[1453,6]]}}}],["0.05",{"_index":227,"title":{},"contents":{"animate-ease.html":{"position":[[669,5],[779,5],[1621,5]]}}}],["0.055",{"_index":217,"title":{},"contents":{"animate-ease.html":{"position":[[552,6]]}}}],["0.06",{"_index":229,"title":{},"contents":{"animate-ease.html":{"position":[[682,6]]}}}],["0.07",{"_index":276,"title":{},"contents":{"animate-ease.html":{"position":[[1570,5]]}}}],["0.085",{"_index":214,"title":{},"contents":{"animate-ease.html":{"position":[[495,6]]}}}],["0.1.0",{"_index":669,"title":{},"contents":{"CHANGELOG.html":{"position":[[12768,5]]},"color-tokens.html":{"position":[[1021,6]]},"layout-queries.html":{"position":[[342,6]]},"token-register.html":{"position":[[586,6]]},"type-fonts.html":{"position":[[1743,6]]}}}],["0.135",{"_index":281,"title":{},"contents":{"animate-ease.html":{"position":[[1728,6]]}}}],["0.15",{"_index":282,"title":{},"contents":{"animate-ease.html":{"position":[[1735,5]]}}}],["0.165",{"_index":265,"title":{},"contents":{"animate-ease.html":{"position":[[1279,6]]}}}],["0.175",{"_index":274,"title":{},"contents":{"animate-ease.html":{"position":[[1515,6]]}}}],["0.19",{"_index":219,"title":{},"contents":{"animate-ease.html":{"position":[[566,6]]}}}],["0.2",{"_index":306,"title":{},"contents":{"animate-time-vars.html":{"position":[[2369,6],[2478,6]]}}}],["0.22",{"_index":224,"title":{},"contents":{"animate-ease.html":{"position":[[624,6],[1225,5]]}}}],["0.265",{"_index":190,"title":{},"contents":{"animate-ease-vars.html":{"position":[[721,6]]},"animate-ease.html":{"position":[[1795,6]]}}}],["0.28",{"_index":244,"title":{},"contents":{"animate-ease.html":{"position":[[891,5]]}}}],["0.32",{"_index":258,"title":{},"contents":{"animate-ease.html":{"position":[[1120,5],[1335,5]]}}}],["0.335",{"_index":243,"title":{},"contents":{"animate-ease.html":{"position":[[847,7]]}}}],["0.355",{"_index":253,"title":{},"contents":{"animate-ease.html":{"position":[[1013,6],[1460,6]]}}}],["0.4",{"_index":194,"title":{},"contents":{"animate-ease-vars.html":{"position":[[1414,4],[1569,4],[1644,4],[2465,4],[2685,4],[3525,4]]},"animate-ease.html":{"position":[[2533,4]]},"animate.html":{"position":[[537,4]]}}}],["0.44",{"_index":256,"title":{},"contents":{"animate-ease.html":{"position":[[1069,5]]}}}],["0.45",{"_index":249,"title":{},"contents":{"animate-ease.html":{"position":[[955,5]]}}}],["0.46",{"_index":248,"title":{},"contents":{"animate-ease.html":{"position":[[949,5]]}}}],["0.5",{"_index":195,"title":{},"contents":{"animate-ease-vars.html":{"position":[[1419,4],[1574,4],[1649,4],[2470,4],[2690,4],[3530,4]]},"animate-ease.html":{"position":[[2538,4]]},"animate.html":{"position":[[542,4]]},"token-api.html":{"position":[[4930,3],[6014,3]]}}}],["0.515",{"_index":270,"title":{},"contents":{"animate-ease.html":{"position":[[1396,6]]}}}],["0.53",{"_index":216,"title":{},"contents":{"animate-ease.html":{"position":[[508,6]]}}}],["0.55",{"_index":189,"title":{},"contents":{"animate-ease-vars.html":{"position":[[715,5]]},"animate-ease.html":{"position":[[1627,5],[1789,5]]}}}],["0.565",{"_index":261,"title":{},"contents":{"animate-ease.html":{"position":[[1174,6]]}}}],["0.575",{"_index":260,"title":{},"contents":{"animate-ease.html":{"position":[[1167,6]]}}}],["0.5vw",{"_index":1354,"title":{},"contents":{"utils.html":{"position":[[3960,7],[4040,6]]}}}],["0.61",{"_index":252,"title":{},"contents":{"animate-ease.html":{"position":[[1007,5]]}}}],["0.675",{"_index":218,"title":{},"contents":{"animate-ease.html":{"position":[[559,6]]}}}],["0.68",{"_index":215,"title":{},"contents":{"animate-ease.html":{"position":[[502,5]]}}}],["0.685",{"_index":223,"title":{},"contents":{"animate-ease.html":{"position":[[617,6]]}}}],["0.715",{"_index":234,"title":{},"contents":{"animate-ease.html":{"position":[[735,7]]}}}],["0.735",{"_index":245,"title":{},"contents":{"animate-ease.html":{"position":[[897,6]]}}}],["0.745",{"_index":233,"title":{},"contents":{"animate-ease.html":{"position":[[728,6]]}}}],["0.795",{"_index":237,"title":{},"contents":{"animate-ease.html":{"position":[[785,6]]}}}],["0.82",{"_index":264,"title":{},"contents":{"animate-ease.html":{"position":[[1273,5]]}}}],["0.84",{"_index":255,"title":{},"contents":{"animate-ease.html":{"position":[[1063,5]]}}}],["0.855",{"_index":228,"title":{},"contents":{"animate-ease.html":{"position":[[675,6]]}}}],["0.86",{"_index":283,"title":{},"contents":{"animate-ease.html":{"position":[[1741,6]]}}}],["0.875",{"_index":1043,"title":{},"contents":{"ratio-vars.html":{"position":[[340,7],[457,6]]}}}],["0.885",{"_index":267,"title":{},"contents":{"animate-ease.html":{"position":[[1328,6]]}}}],["0.94",{"_index":250,"title":{},"contents":{"animate-ease.html":{"position":[[961,6]]}}}],["0.95",{"_index":278,"title":{},"contents":{"animate-ease.html":{"position":[[1633,6]]}}}],["0.955",{"_index":271,"title":{},"contents":{"animate-ease.html":{"position":[[1403,7]]}}}],["0.98",{"_index":242,"title":{},"contents":{"animate-ease.html":{"position":[[841,5]]}}}],["00ff",{"_index":1299,"title":{},"contents":{"type-fonts.html":{"position":[[4556,5]]}}}],["01/04/19",{"_index":516,"title":{},"contents":{"CHANGELOG.html":{"position":[[4912,8]]}}}],["01/06/20",{"_index":507,"title":{},"contents":{"CHANGELOG.html":{"position":[[4658,8]]}}}],["0153",{"_index":1302,"title":{},"contents":{"type-fonts.html":{"position":[[4577,5]]}}}],["02/22/21",{"_index":436,"title":{},"contents":{"CHANGELOG.html":{"position":[[2675,8]]}}}],["03/01/21",{"_index":427,"title":{},"contents":{"CHANGELOG.html":{"position":[[2596,8]]}}}],["06/30/20",{"_index":503,"title":{},"contents":{"CHANGELOG.html":{"position":[[4568,8]]}}}],["07/12/18",{"_index":670,"title":{},"contents":{"CHANGELOG.html":{"position":[[12776,8]]}}}],["07/18/18",{"_index":646,"title":{},"contents":{"CHANGELOG.html":{"position":[[11089,8]]}}}],["07/27/18",{"_index":622,"title":{},"contents":{"CHANGELOG.html":{"position":[[9715,8]]}}}],["08/03/18",{"_index":620,"title":{},"contents":{"CHANGELOG.html":{"position":[[9613,8]]}}}],["08/08/18",{"_index":616,"title":{},"contents":{"CHANGELOG.html":{"position":[[9516,8]]}}}],["08/26/19",{"_index":511,"title":{},"contents":{"CHANGELOG.html":{"position":[[4751,8]]}}}],["09/08/18",{"_index":613,"title":{},"contents":{"CHANGELOG.html":{"position":[[9346,8]]}}}],["09/08/20",{"_index":475,"title":{},"contents":{"CHANGELOG.html":{"position":[[3885,8]]}}}],["09em",{"_index":973,"title":{},"contents":{"layout.html":{"position":[[715,5]]}}}],["1",{"_index":147,"title":{},"contents":{"animate-change.html":{"position":[[998,1],[1003,1]]},"animate-ease.html":{"position":[[1020,3],[1075,3],[1117,2],[1126,3],[1181,3],[1222,2],[1231,3],[1286,3],[1467,3],[1522,3],[1576,3],[1683,3]]},"animate.html":{"position":[[669,1],[1047,1]]},"color-themes.html":{"position":[[845,2],[932,2],[1094,2],[1177,2]]},"index.html":{"position":[[1953,2]]},"layout-z-index.html":{"position":[[345,1],[402,1]]},"scale.html":{"position":[[722,2],[839,3],[1943,3]]},"token-internal.html":{"position":[[390,3]]},"utils.html":{"position":[[343,2],[624,1],[923,3]]}}}],["1.0",{"_index":618,"title":{},"contents":{"CHANGELOG.html":{"position":[[9536,3]]}}}],["1.0.0",{"_index":156,"title":{},"contents":{"animate-change.html":{"position":[[1336,6]]},"animate-ease.html":{"position":[[2914,6]]},"animate-times.html":{"position":[[926,6]]},"CHANGELOG.html":{"position":[[9508,5],[9598,5],[9700,5],[11074,5]]},"color-tokens.html":{"position":[[2852,6]]},"layout-queries.html":{"position":[[835,6]]},"layout-z-index.html":{"position":[[562,6]]},"ratio-tokens.html":{"position":[[498,6]]},"scale-sizes.html":{"position":[[2141,6],[3231,6],[4530,6]]},"scale-units.html":{"position":[[289,6]]},"token-api.html":{"position":[[4458,6]]},"type-fonts.html":{"position":[[6972,6],[7580,6],[8384,6],[9041,6],[10161,6]]},"utils.html":{"position":[[2331,6],[4432,6],[5696,6]]}}}],["1.0.1",{"_index":612,"title":{},"contents":{"CHANGELOG.html":{"position":[[9338,5]]}}}],["1.0666666667",{"_index":1067,"title":{},"contents":{"ratios.html":{"position":[[696,13]]}}}],["1.125",{"_index":1066,"title":{},"contents":{"ratios.html":{"position":[[667,6]]}}}],["1.2",{"_index":1065,"title":{},"contents":{"ratios.html":{"position":[[640,4]]}}}],["1.25",{"_index":1047,"title":{},"contents":{"ratio-vars.html":{"position":[[1263,5],[3309,6]]},"ratios.html":{"position":[[613,5]]},"scale.html":{"position":[[481,5]]}}}],["1.275",{"_index":268,"title":{},"contents":{"animate-ease.html":{"position":[[1341,7]]}}}],["1.3333333333",{"_index":1064,"title":{},"contents":{"ratios.html":{"position":[[578,13],[747,13]]}}}],["1.4",{"_index":196,"title":{},"contents":{"animate-ease-vars.html":{"position":[[1424,5],[1579,5],[1654,6],[2475,5],[2695,5],[3535,5]]},"animate-ease.html":{"position":[[2543,5]]},"animate.html":{"position":[[547,5]]},"ratio-tokens.html":{"position":[[2259,4],[2401,4],[2406,3]]},"scale.html":{"position":[[1912,4],[1937,4],[2051,4]]},"token-api.html":{"position":[[2756,4]]}}}],["1.40625",{"_index":1063,"title":{},"contents":{"ratios.html":{"position":[[553,8]]}}}],["1.4em",{"_index":1048,"title":{},"contents":{"ratio-vars.html":{"position":[[2200,7],[2306,7]]}}}],["1.5",{"_index":926,"title":{},"contents":{"layout-queries.html":{"position":[[651,5]]},"ratio-tokens.html":{"position":[[1105,3]]},"ratios.html":{"position":[[522,4],[725,4]]},"scale-vars.html":{"position":[[1341,5],[2276,5],[3271,5]]},"token-api.html":{"position":[[1190,5],[1790,4],[1941,5],[2016,4],[2499,4]]}}}],["1.55",{"_index":191,"title":{},"contents":{"animate-ease-vars.html":{"position":[[728,6]]},"animate-ease.html":{"position":[[1802,6]]}}}],["1.5em",{"_index":1102,"title":{},"contents":{"scale-vars.html":{"position":[[3381,7],[3480,7]]}}}],["1.5rem",{"_index":1099,"title":{},"contents":{"scale-vars.html":{"position":[[2387,8],[2494,8]]}}}],["1.6",{"_index":1052,"title":{},"contents":{"ratio-vars.html":{"position":[[3230,5],[3364,4]]},"ratios.html":{"position":[[502,4]]}}}],["1.61803399",{"_index":1046,"title":{},"contents":{"ratio-vars.html":{"position":[[1110,11],[1230,11],[2057,11],[2253,11],[3071,11]]},"ratios.html":{"position":[[833,11]]}}}],["1.6666666667",{"_index":1059,"title":{},"contents":{"ratios.html":{"position":[[467,13]]}}}],["1.7777777778",{"_index":1057,"title":{},"contents":{"ratios.html":{"position":[[432,13],[781,13]]}}}],["1.778",{"_index":1028,"title":{},"contents":{"ratio-tokens.html":{"position":[[306,6]]}}}],["1.875",{"_index":1056,"title":{},"contents":{"ratios.html":{"position":[[402,6]]}}}],["10/29/18",{"_index":583,"title":{},"contents":{"CHANGELOG.html":{"position":[[6990,8]]}}}],["100",{"_index":762,"title":{},"contents":{"color-themes.html":{"position":[[2141,6],[2934,6]]},"ratio-vars.html":{"position":[[3238,6],[3371,6]]}}}],["10px",{"_index":638,"title":{},"contents":{"CHANGELOG.html":{"position":[[10718,5],[10767,5],[12260,5],[12305,5]]},"scale-sizes.html":{"position":[[2451,5],[2496,5],[3541,5],[3586,5],[4840,5],[4885,5]]}}}],["111",{"_index":699,"title":{},"contents":{"color-contrast.html":{"position":[[966,5],[1189,5],[2642,5],[2901,5],[4224,5],[4426,5],[5691,5],[5921,5]]}}}],["12/03/21",{"_index":349,"title":{},"contents":{"CHANGELOG.html":{"position":[[57,8]]}}}],["12/05/18",{"_index":550,"title":{},"contents":{"CHANGELOG.html":{"position":[[6034,8]]}}}],["12/13/18",{"_index":544,"title":{},"contents":{"CHANGELOG.html":{"position":[[5629,8]]}}}],["12/20/18",{"_index":521,"title":{},"contents":{"CHANGELOG.html":{"position":[[4994,8]]}}}],["1244.4444444444px",{"_index":1118,"title":{},"contents":{"scale.html":{"position":[[2027,17]]}}}],["127",{"_index":1219,"title":{},"contents":{"tokens.html":{"position":[[2249,4],[2397,4]]}}}],["14.2857142857",{"_index":756,"title":{},"contents":{"color-themes.html":{"position":[[1916,15],[1939,14],[2709,15],[2732,14]]}}}],["14px",{"_index":1176,"title":{},"contents":{"token-internal.html":{"position":[[344,4],[546,4],[1027,5],[1635,5]]}}}],["15",{"_index":782,"title":{},"contents":{"color-tokens.html":{"position":[[1449,4],[1468,5]]}}}],["15.3846153846",{"_index":740,"title":{},"contents":{"color-themes.html":{"position":[[896,15],[1142,15]]}}}],["150m",{"_index":309,"title":{},"contents":{"animate-time-vars.html":{"position":[[3362,7],[3464,7]]},"animate.html":{"position":[[454,6]]}}}],["165",{"_index":1220,"title":{},"contents":{"tokens.html":{"position":[[2254,5],[2402,5]]}}}],["16px",{"_index":889,"title":{},"contents":{"index.html":{"position":[[1663,5],[1864,5]]},"scale-sizes.html":{"position":[[985,4]]},"scale-units.html":{"position":[[805,4]]},"scale-vars.html":{"position":[[1306,5],[2241,5],[3236,5]]},"token-api.html":{"position":[[177,5],[695,4],[716,5],[886,5],[1118,5],[1350,5],[1744,5],[1970,5],[2465,5],[2735,5],[3069,5],[3355,5]]},"token-internal.html":{"position":[[349,4],[566,4],[1011,5],[1619,5],[2210,5],[2767,5],[3338,5]]},"tokens.html":{"position":[[135,5]]},"utils.html":{"position":[[3909,5]]}}}],["17.1428571429px",{"_index":1119,"title":{},"contents":{"scale.html":{"position":[[2056,15]]}}}],["1em",{"_index":891,"title":{},"contents":{"index.html":{"position":[[1679,4]]},"layout-queries.html":{"position":[[5422,3]]},"scale.html":{"position":[[549,4]]},"token-api.html":{"position":[[193,4]]},"tokens.html":{"position":[[151,4]]}}}],["1px",{"_index":934,"title":{},"contents":{"layout-queries.html":{"position":[[1877,3],[2973,3],[4079,3],[5415,3]]},"layout.html":{"position":[[724,3]]},"token-internal.html":{"position":[[3439,3]]}}}],["1s",{"_index":200,"title":{},"contents":{"animate-ease-vars.html":{"position":[[3620,2],[3748,2]]},"animate-time-vars.html":{"position":[[550,4],[670,3]]}}}],["1vw",{"_index":655,"title":{},"contents":{"CHANGELOG.html":{"position":[[11519,4],[11540,3]]},"token-api.html":{"position":[[865,4],[901,4],[3084,4],[3370,4]]},"utils.html":{"position":[[2891,5],[2940,5]]}}}],["2",{"_index":334,"title":{},"contents":{"animate.html":{"position":[[489,3]]},"color-themes.html":{"position":[[646,3],[797,2],[991,2],[1048,2],[1234,2]]},"layout-z-index.html":{"position":[[361,1],[404,1]]},"ratio-tokens.html":{"position":[[1089,1],[2393,1]]},"ratios.html":{"position":[[376,2]]},"scale-sizes.html":{"position":[[498,3],[531,4],[1236,3],[1942,3],[3936,4],[5235,4]]},"scale.html":{"position":[[808,3],[1991,3]]},"token-api.html":{"position":[[1162,3],[3479,3],[4918,2],[5085,2],[5167,1],[6002,2]]},"token-internal.html":{"position":[[425,3],[2244,3],[2800,3]]}}}],["2.0",{"_index":551,"title":{},"contents":{"CHANGELOG.html":{"position":[[6047,3]]}}}],["2.0.0",{"_index":33,"title":{},"contents":{"animate-change-vars.html":{"position":[[495,6],[1103,6],[1706,6],[2803,6]]},"animate-ease-vars.html":{"position":[[492,6],[1136,6],[1821,6],[2932,6]]},"animate-time-vars.html":{"position":[[483,6],[1059,6],[1602,6],[2658,6]]},"CHANGELOG.html":{"position":[[6026,5],[6974,5]]},"color-tokens.html":{"position":[[2745,6]]},"color-utils.html":{"position":[[219,6],[1050,6]]},"color-vars.html":{"position":[[489,6],[1108,6],[1700,6],[2783,6]]},"layout-queries.html":{"position":[[2050,6],[3141,6],[4252,6],[5652,6]]},"ratio-vars.html":{"position":[[271,6],[857,6],[1430,6],[2503,6]]},"scale-vars.html":{"position":[[483,6],[1061,6],[1624,6],[2676,6]]},"token-api.html":{"position":[[1430,6],[4347,6]]},"token-inspect.html":{"position":[[264,6],[926,6]]},"token-vars.html":{"position":[[275,6],[1637,6],[2364,6]]},"type-font-vars.html":{"position":[[483,6],[1130,6],[1788,6],[3039,6]]},"type-fonts.html":{"position":[[6801,6],[9986,6]]},"vars.html":{"position":[[657,6]]}}}],["2.1.0",{"_index":520,"title":{},"contents":{"CHANGELOG.html":{"position":[[4986,5],[5614,5]]},"color-contrast.html":{"position":[[136,6],[1792,6]]},"color-themes.html":{"position":[[247,6],[1462,6],[2314,6]]}}}],["2.1.1",{"_index":515,"title":{},"contents":{"CHANGELOG.html":{"position":[[4904,5]]}}}],["2.1.2",{"_index":510,"title":{},"contents":{"CHANGELOG.html":{"position":[[4743,5]]}}}],["2.1.3",{"_index":506,"title":{},"contents":{"CHANGELOG.html":{"position":[[4650,5]]}}}],["2.1.4",{"_index":502,"title":{},"contents":{"CHANGELOG.html":{"position":[[4560,5]]}}}],["2.2.0",{"_index":474,"title":{},"contents":{"CHANGELOG.html":{"position":[[3877,5]]},"token-api.html":{"position":[[3799,6]]},"token-config.html":{"position":[[441,6]]}}}],["2.39",{"_index":1070,"title":{},"contents":{"ratios.html":{"position":[[811,5]]}}}],["200m",{"_index":302,"title":{},"contents":{"animate-time-vars.html":{"position":[[1304,6],[1415,6],[1452,7],[2220,6],[3218,6]]}}}],["2018–2020",{"_index":978,"title":{},"contents":{"LICENSE.html":{"position":[[24,9]]}}}],["206020",{"_index":77,"title":{},"contents":{"animate-change-vars.html":{"position":[[1503,8],[1548,9],[2571,9],[3605,9]]},"color-vars.html":{"position":[[1502,8],[1545,9],[2555,9],[3575,9]]},"token-vars.html":{"position":[[1140,9],[2117,8],[2160,9],[3257,9]]},"tokens.html":{"position":[[3413,8],[3444,9],[3482,9],[3511,9]]}}}],["21",{"_index":526,"title":{},"contents":{"CHANGELOG.html":{"position":[[5226,3]]},"color-contrast.html":{"position":[[573,2],[2248,2],[3843,2],[5255,2],[7075,2]]}}}],["222",{"_index":778,"title":{},"contents":{"color-tokens.html":{"position":[[1229,5],[2160,5],[3443,5]]}}}],["224",{"_index":811,"title":{},"contents":{"color.html":{"position":[[640,5],[1274,5]]}}}],["24em",{"_index":967,"title":{},"contents":{"layout.html":{"position":[[488,5]]}}}],["24px",{"_index":1072,"title":{},"contents":{"scale-sizes.html":{"position":[[386,7],[1165,5],[1912,5],[3859,6],[3914,4],[5158,6],[5213,4]]},"scale-vars.html":{"position":[[1437,5],[1475,6],[2454,6],[3445,6]]},"scale.html":{"position":[[534,5]]},"token-api.html":{"position":[[1095,4],[1329,4],[1382,5]]},"token-internal.html":{"position":[[354,5]]}}}],["25",{"_index":812,"title":{},"contents":{"color.html":{"position":[[815,5],[1383,5]]}}}],["250m",{"_index":307,"title":{},"contents":{"animate-time-vars.html":{"position":[[2432,7],[3433,7]]}}}],["28.5714285714",{"_index":757,"title":{},"contents":{"color-themes.html":{"position":[[1954,15],[1977,14],[2747,15],[2770,14]]}}}],["29.99em",{"_index":941,"title":{},"contents":{"layout-queries.html":{"position":[[2547,8],[2716,8]]}}}],["2nd",{"_index":460,"title":{},"contents":{"CHANGELOG.html":{"position":[[3443,3]]}}}],["2px",{"_index":1186,"title":{},"contents":{"token-internal.html":{"position":[[1747,3]]}}}],["2vw",{"_index":656,"title":{},"contents":{"CHANGELOG.html":{"position":[[11544,4]]},"scale-sizes.html":{"position":[[621,6],[1279,5]]},"scale.html":{"position":[[943,5]]}}}],["3",{"_index":728,"title":{},"contents":{"color-themes.html":{"position":[[411,1]]},"layout-z-index.html":{"position":[[400,1]]},"ratio-tokens.html":{"position":[[294,3]]},"scale.html":{"position":[[777,3]]},"token-internal.html":{"position":[[3370,3]]}}}],["3.0.0",{"_index":435,"title":{},"contents":{"CHANGELOG.html":{"position":[[2667,5]]},"type-fonts.html":{"position":[[1662,6],[8985,6]]}}}],["3.0.1",{"_index":426,"title":{},"contents":{"CHANGELOG.html":{"position":[[2588,5]]}}}],["3.5",{"_index":1195,"title":{},"contents":{"token-register.html":{"position":[[35,4]]}}}],["300m",{"_index":180,"title":{},"contents":{"animate-change.html":{"position":[[2605,5],[2720,5],[3060,5],[3171,5]]}}}],["30em",{"_index":924,"title":{},"contents":{"layout-queries.html":{"position":[[497,5],[583,4],[2437,6],[2619,6],[3528,6],[4775,6],[4896,5],[4994,5],[5122,5]]}}}],["30px",{"_index":1183,"title":{},"contents":{"token-internal.html":{"position":[[1146,4]]}}}],["31",{"_index":517,"title":{},"contents":{"CHANGELOG.html":{"position":[[4934,6]]}}}],["32em",{"_index":1153,"title":{},"contents":{"token-api.html":{"position":[[5302,6],[5360,4]]}}}],["32px",{"_index":1120,"title":{},"contents":{"scale.html":{"position":[[2086,4]]},"token-internal.html":{"position":[[2322,4]]}}}],["35deg",{"_index":764,"title":{},"contents":{"color-themes.html":{"position":[[2437,5]]}}}],["36",{"_index":512,"title":{},"contents":{"CHANGELOG.html":{"position":[[4799,6]]}}}],["36rem",{"_index":966,"title":{},"contents":{"layout.html":{"position":[[447,6]]}}}],["38",{"_index":513,"title":{},"contents":{"CHANGELOG.html":{"position":[[4855,6]]}}}],["3:1",{"_index":711,"title":{},"contents":{"color-contrast.html":{"position":[[6363,3]]}}}],["3em",{"_index":1095,"title":{},"contents":{"scale-vars.html":{"position":[[550,5],[671,4]]},"token-api.html":{"position":[[4871,4],[5957,4]]}}}],["3rd",{"_index":1075,"title":{},"contents":{"scale-sizes.html":{"position":[[733,3]]}}}],["3vw",{"_index":1353,"title":{},"contents":{"utils.html":{"position":[[2946,7],[3025,4]]}}}],["4",{"_index":963,"title":{},"contents":{"layout-z-index.html":{"position":[[420,1]]}}}],["4.0.0",{"_index":208,"title":{},"contents":{"animate-ease.html":{"position":[[188,6]]},"CHANGELOG.html":{"position":[[23,5],[42,5]]},"ratio-tokens.html":{"position":[[1707,6]]},"ratios.html":{"position":[[157,6]]},"scale.html":{"position":[[1327,6]]},"token-api.html":{"position":[[4165,6],[5639,6]]},"token-config.html":{"position":[[348,6]]},"token-inspect.html":{"position":[[2057,6]]},"tokens.html":{"position":[[1024,6]]},"type-fonts.html":{"position":[[860,6],[1936,6],[7659,6],[9120,6],[10228,6]]},"type-helpers.html":{"position":[[140,6]]},"vars.html":{"position":[[610,6],[1695,6]]}}}],["4.5:1",{"_index":712,"title":{},"contents":{"color-contrast.html":{"position":[[6375,5]]}}}],["40",{"_index":739,"title":{},"contents":{"color-themes.html":{"position":[[821,4],[1071,4]]}}}],["41",{"_index":476,"title":{},"contents":{"CHANGELOG.html":{"position":[[3899,5],[4414,5]]}}}],["42.8571428571",{"_index":758,"title":{},"contents":{"color-themes.html":{"position":[[1992,15],[2014,14],[2785,15],[2807,14]]}}}],["45em",{"_index":925,"title":{},"contents":{"layout-queries.html":{"position":[[513,5]]}}}],["46",{"_index":508,"title":{},"contents":{"CHANGELOG.html":{"position":[[4680,6]]}}}],["46.1538461538",{"_index":741,"title":{},"contents":{"color-themes.html":{"position":[[955,15],[1199,15]]}}}],["49",{"_index":440,"title":{},"contents":{"CHANGELOG.html":{"position":[[2925,4],[3192,6]]}}}],["49.99em",{"_index":949,"title":{},"contents":{"layout-queries.html":{"position":[[4918,8],[5144,8]]}}}],["5",{"_index":964,"title":{},"contents":{"layout-z-index.html":{"position":[[434,1]]}}}],["5.5em",{"_index":1150,"title":{},"contents":{"token-api.html":{"position":[[5018,5],[6098,5]]}}}],["50",{"_index":73,"title":{},"contents":{"animate-change-vars.html":{"position":[[1366,4],[1371,5],[1405,5],[2345,4],[2350,5],[2384,5],[3381,4],[3386,5],[3420,5]]},"color-vars.html":{"position":[[1367,4],[1372,5],[1406,5],[2333,4],[2338,5],[2372,5],[3357,4],[3362,5],[3396,5]]},"token-inspect.html":{"position":[[1365,4],[1370,5],[2536,4],[2541,5]]},"token-vars.html":{"position":[[890,4],[895,5],[950,6],[1941,4],[1946,5],[2001,6],[3005,4],[3010,5],[3065,6]]},"tokens.html":{"position":[[3088,4],[3093,5],[3127,5],[4239,4],[4244,5],[4282,5]]}}}],["500",{"_index":686,"title":{},"contents":{"CHANGELOG.html":{"position":[[14216,5],[14274,4]]}}}],["50em",{"_index":946,"title":{},"contents":{"layout-queries.html":{"position":[[3640,5],[3713,6],[3814,5],[4825,5],[5009,5]]}}}],["50m",{"_index":304,"title":{},"contents":{"animate-time-vars.html":{"position":[[2254,6],[3251,6]]}}}],["53",{"_index":470,"title":{},"contents":{"CHANGELOG.html":{"position":[[3767,6]]}}}],["54",{"_index":504,"title":{},"contents":{"CHANGELOG.html":{"position":[[4582,6]]}}}],["57.1428571429",{"_index":759,"title":{},"contents":{"color-themes.html":{"position":[[2029,15],[2050,14],[2822,15],[2843,14]]}}}],["5em",{"_index":972,"title":{},"contents":{"layout.html":{"position":[[695,5]]}}}],["600",{"_index":1279,"title":{},"contents":{"type-fonts.html":{"position":[[3364,4],[3391,5]]}}}],["61",{"_index":458,"title":{},"contents":{"CHANGELOG.html":{"position":[[3406,6]]}}}],["62",{"_index":776,"title":{},"contents":{"color-tokens.html":{"position":[[1188,5],[2194,5]]},"color.html":{"position":[[599,5],[1233,5]]}}}],["71.4285714286",{"_index":760,"title":{},"contents":{"color-themes.html":{"position":[[2065,15],[2088,14],[2858,15],[2881,14]]}}}],["75",{"_index":1221,"title":{},"contents":{"tokens.html":{"position":[[2456,5]]}}}],["76.9230769231",{"_index":742,"title":{},"contents":{"color-themes.html":{"position":[[1014,15],[1256,15]]}}}],["7:1",{"_index":713,"title":{},"contents":{"color-contrast.html":{"position":[[6390,3]]}}}],["85",{"_index":775,"title":{},"contents":{"color-tokens.html":{"position":[[1183,4],[2189,4]]},"color.html":{"position":[[594,4],[1228,4]]}}}],["85.7142857143",{"_index":761,"title":{},"contents":{"color-themes.html":{"position":[[2103,15],[2126,14],[2896,15],[2919,14]]}}}],["8;base64",{"_index":1312,"title":{},"contents":{"type-fonts.html":{"position":[[5474,12],[5593,12]]}}}],["8in",{"_index":1106,"title":{},"contents":{"scale.html":{"position":[[562,4]]}}}],["8px",{"_index":1191,"title":{},"contents":{"token-internal.html":{"position":[[2872,3]]}}}],["999",{"_index":718,"title":{},"contents":{"color-contrast.html":{"position":[[7025,5]]}}}],["_",{"_index":51,"title":{},"contents":{"animate-change-vars.html":{"position":[[900,1]]},"animate-ease-vars.html":{"position":[[927,1]]},"animate-ease.html":{"position":[[172,1]]},"animate-time-vars.html":{"position":[[858,1]]},"CHANGELOG.html":{"position":[[2145,1],[5861,1],[6407,1],[7348,1],[7520,1],[7917,1],[8665,2],[8756,2]]},"color-contrast.html":{"position":[[3446,1]]},"color-tokens.html":{"position":[[867,1]]},"color-vars.html":{"position":[[906,1]]},"color.html":{"position":[[1781,1]]},"ratio-tokens.html":{"position":[[222,1]]},"ratio-vars.html":{"position":[[655,1]]},"ratios.html":{"position":[[140,1],[220,1]]},"scale-vars.html":{"position":[[860,1]]},"token-inspect.html":{"position":[[225,1]]},"token-vars.html":{"position":[[1435,1]]},"type-font-vars.html":{"position":[[929,1]]}}}],["_a_var",{"_index":1364,"title":{},"contents":{"vars.html":{"position":[[696,6]]}}}],["_accoutrement_app",{"_index":1199,"title":{},"contents":{"token-register.html":{"position":[[1092,18]]}}}],["_brand",{"_index":71,"title":{},"contents":{"animate-change-vars.html":{"position":[[1347,9],[1385,9],[2326,9],[2364,9],[3362,9],[3400,9]]},"animate-time-vars.html":{"position":[[2210,9],[2235,9]]},"color-vars.html":{"position":[[1348,9],[1386,9],[2314,9],[2352,9],[3338,9],[3376,9]]},"token-inspect.html":{"position":[[1346,9],[1384,10],[1443,7],[1481,10],[1544,7],[1713,7],[1746,7]]},"token-vars.html":{"position":[[871,9],[909,9],[1922,9],[1960,9],[2986,9],[3024,9]]},"tokens.html":{"position":[[3069,9],[3107,9]]}}}],["_contrast",{"_index":599,"title":{},"contents":{"CHANGELOG.html":{"position":[[8264,9],[8284,9],[8429,9],[8449,9],[8478,9]]}}}],["_default",{"_index":1032,"title":{},"contents":{"ratio-tokens.html":{"position":[[443,9]]}}}],["_elast",{"_index":192,"title":{},"contents":{"animate-ease-vars.html":{"position":[[1383,11],[1439,12],[2434,11],[2490,12],[3494,11],[3550,12]]}}}],["_fast",{"_index":301,"title":{},"contents":{"animate-time-vars.html":{"position":[[1295,8],[1319,9],[3209,8],[3233,8]]}}}],["_fifth",{"_index":1035,"title":{},"contents":{"ratio-tokens.html":{"position":[[1028,7],[1097,7]]},"scale.html":{"position":[[711,10]]}}}],["_golden",{"_index":1030,"title":{},"contents":{"ratio-tokens.html":{"position":[[321,11]]},"scale-sizes.html":{"position":[[485,12]]}}}],["_i",{"_index":1236,"title":{},"contents":{"type-a11y.html":{"position":[[287,3],[326,3]]}}}],["_in",{"_index":185,"title":{},"contents":{"animate-ease-vars.html":{"position":[[560,5]]},"animate-ease.html":{"position":[[2588,5]]},"CHANGELOG.html":{"position":[[7955,3]]}}}],["_index.scss",{"_index":647,"title":{},"contents":{"CHANGELOG.html":{"position":[[11107,11]]}}}],["_major",{"_index":893,"title":{},"contents":{"index.html":{"position":[[1937,7]]},"ratio-vars.html":{"position":[[1137,8],[2084,8],[3098,8]]}}}],["_memo",{"_index":1155,"title":{},"contents":{"token-api.html":{"position":[[5474,6]]}}}],["_mi",{"_index":1372,"title":{},"contents":{"vars.html":{"position":[[1565,4]]}}}],["_minor",{"_index":596,"title":{},"contents":{"CHANGELOG.html":{"position":[[7558,6]]},"scale-sizes.html":{"position":[[3919,8],[5218,8]]}}}],["_octav",{"_index":1033,"title":{},"contents":{"ratio-tokens.html":{"position":[[987,8],[1080,8],[2215,8],[2384,8]]}}}],["_root",{"_index":1097,"title":{},"contents":{"scale-vars.html":{"position":[[1297,8],[1322,8],[2232,8],[2257,8],[3227,8],[3252,8]]}}}],["_testfont",{"_index":1241,"title":{},"contents":{"type-font-vars.html":{"position":[[1466,12],[1547,13],[2502,12],[2583,13],[3697,12],[3778,13]]}}}],["_token",{"_index":558,"title":{},"contents":{"CHANGELOG.html":{"position":[[6232,9]]}}}],["_widescreen",{"_index":1114,"title":{},"contents":{"scale.html":{"position":[[1856,12],[1890,15],[2014,12]]}}}],["a:hov",{"_index":816,"title":{},"contents":{"color.html":{"position":[[1851,7]]}}}],["aa",{"_index":529,"title":{},"contents":{"CHANGELOG.html":{"position":[[5253,3],[5257,2]]},"color-contrast.html":{"position":[[542,5],[550,3],[2217,5],[2225,3],[3812,5],[3820,3],[5224,5],[5232,3],[6281,4],[6291,2],[6349,3],[6367,4],[6686,5],[6694,3]]}}}],["aaa",{"_index":528,"title":{},"contents":{"CHANGELOG.html":{"position":[[5247,5]]},"color-contrast.html":{"position":[[563,5],[1277,5],[2238,5],[2993,5],[3833,5],[4510,5],[5245,5],[6009,5],[6286,4],[6381,5],[6707,5],[6988,6],[7031,7],[7091,6]]}}}],["abil",{"_index":1196,"title":{},"contents":{"token-register.html":{"position":[[194,7]]},"type-fonts.html":{"position":[[2277,7]]}}}],["abov",{"_index":929,"title":{},"contents":{"layout-queries.html":{"position":[[1695,7],[2823,7],[2889,5]]},"layout.html":{"position":[[526,8]]},"LICENSE.html":{"position":[[479,5]]},"token-api.html":{"position":[[2113,6]]},"tokens.html":{"position":[[3205,6]]}}}],["above('bann",{"_index":969,"title":{},"contents":{"layout.html":{"position":[[605,13]]}}}],["absolut",{"_index":578,"title":{},"contents":{"CHANGELOG.html":{"position":[[6787,8]]},"scale-units.html":{"position":[[614,8],[893,8]]}}}],["abstract",{"_index":150,"title":{},"contents":{"animate-change.html":{"position":[[1073,12]]},"animate-ease.html":{"position":[[2664,12]]},"animate-times.html":{"position":[[584,12]]},"color-tokens.html":{"position":[[491,12]]},"tokens.html":{"position":[[181,13],[2930,8]]}}}],["accent",{"_index":732,"title":{},"contents":{"color-themes.html":{"position":[[542,9],[1036,6],[1051,9],[1082,6],[1097,9],[1113,6],[1123,9],[1164,6],[1180,9],[1221,6],[1237,9]]},"tokens.html":{"position":[[2408,9],[2436,9]]}}}],["accept",{"_index":157,"title":{},"contents":{"animate-change.html":{"position":[[1348,7],[1406,7]]},"animate-ease.html":{"position":[[2926,7],[2984,7]]},"animate-times.html":{"position":[[938,7],[996,7]]},"CHANGELOG.html":{"position":[[1242,7],[1554,7],[3053,6],[9240,7],[9752,7],[10004,6],[10101,7],[10184,7],[10301,6],[10429,6],[10863,6],[11009,6],[11253,6],[11613,6],[11697,6],[11887,6],[12406,7]]},"color-tokens.html":{"position":[[2911,7]]},"color-utils.html":{"position":[[296,6],[1117,6]]},"layout-queries.html":{"position":[[847,7],[905,7],[977,7]]},"ratio-tokens.html":{"position":[[510,7],[568,7]]},"scale-sizes.html":{"position":[[2545,7],[3635,7],[4934,7]]},"token-api.html":{"position":[[4470,7]]},"tokens.html":{"position":[[1070,7],[1382,7]]},"type-fonts.html":{"position":[[2076,7],[3684,6],[7079,7],[7592,7],[8396,7],[9053,7],[9147,7],[9998,7],[10188,7],[10255,7]]}}}],["acces",{"_index":118,"title":{},"contents":{"animate-change.html":{"position":[[396,9]]}}}],["access",{"_index":93,"title":{"color-contrast.html":{"position":[[11,13]]},"token-api.html":{"position":[[0,9]]},"type-a11y.html":{"position":[[0,13]]}},"contents":{"animate-change-vars.html":{"position":[[2688,6]]},"animate-change.html":{"position":[[170,6],[1286,6],[2337,6],[2791,6]]},"animate-ease-vars.html":{"position":[[2817,6]]},"animate-ease.html":{"position":[[2216,7],[2404,10],[2856,6]]},"animate-time-vars.html":{"position":[[2543,6]]},"animate-times.html":{"position":[[288,10],[880,6]]},"animate.html":{"position":[[583,6],[1202,6]]},"CHANGELOG.html":{"position":[[1690,6],[5093,6],[5114,10],[5313,10],[5410,10],[6142,6],[10220,6],[12458,6],[13070,7]]},"color-contrast.html":{"position":[[157,6],[665,10],[2340,10],[3175,13],[3935,10],[4116,13],[5347,10],[5583,13]]},"color-tokens.html":{"position":[[0,9],[179,10],[2414,9],[2631,6],[2771,6]]},"color-vars.html":{"position":[[2668,6]]},"color.html":{"position":[[829,6]]},"index.html":{"position":[[2698,6]]},"layout-queries.html":{"position":[[1022,6]]},"layout.html":{"position":[[127,6],[497,6]]},"ratio-tokens.html":{"position":[[50,6]]},"ratio-vars.html":{"position":[[2388,6]]},"scale-sizes.html":{"position":[[2034,9],[2067,6]]},"scale-vars.html":{"position":[[2561,6]]},"scale.html":{"position":[[191,6],[952,6],[1355,6]]},"token-api.html":{"position":[[267,6],[368,9],[1020,6],[3906,9],[4367,6],[4823,6],[5032,6],[5909,6]]},"token-config.html":{"position":[[419,6]]},"token-internal.html":{"position":[[644,6],[1233,6],[1822,6],[2396,6],[2971,6]]},"token-register.html":{"position":[[1037,6]]},"token-vars.html":{"position":[[2249,6]]},"tokens.html":{"position":[[895,6],[1518,6],[3249,6]]},"type-a11y.html":{"position":[[0,13],[87,13]]},"type-font-vars.html":{"position":[[2924,6]]},"type-fonts.html":{"position":[[315,8],[1234,6],[1438,6],[2529,6],[6037,6],[6613,6],[6996,6],[7176,9],[7505,6]]},"type.html":{"position":[[94,6],[201,13],[553,6],[774,6]]}}}],["account",{"_index":974,"title":{},"contents":{"layout.html":{"position":[[755,7]]}}}],["accoutr",{"_index":15,"title":{"index.html":{"position":[[0,12]]}},"contents":{"animate-change-vars.html":{"position":[[207,12],[3208,12]]},"animate-change.html":{"position":[[1677,12]]},"animate-ease-vars.html":{"position":[[204,12],[3335,12]]},"animate-ease.html":{"position":[[3247,12]]},"animate-time-vars.html":{"position":[[199,12],[3059,12]]},"animate-times.html":{"position":[[1248,12]]},"animate.html":{"position":[[415,12]]},"CHANGELOG.html":{"position":[[0,12],[7205,12],[11192,15],[12964,12],[14008,12],[14425,12],[14443,12],[14462,12],[14482,12],[14501,12]]},"color-themes.html":{"position":[[48,12]]},"color-vars.html":{"position":[[203,12],[3186,12]]},"CONTRIBUTING.html":{"position":[[16,12]]},"index.html":{"position":[[30,12],[642,12],[677,12],[1032,15]]},"layout-queries.html":{"position":[[112,12],[533,12],[780,12],[1252,12]]},"layout.html":{"position":[[400,12]]},"ratio-tokens.html":{"position":[[823,12],[1903,12]]},"ratio-vars.html":{"position":[[2906,12]]},"scale-sizes.html":{"position":[[56,13],[2873,12],[4248,12],[5547,12]]},"scale-units.html":{"position":[[264,12],[318,12],[1239,13]]},"scale-vars.html":{"position":[[199,12],[3077,12]]},"scale.html":{"position":[[1654,12]]},"token-api.html":{"position":[[68,12],[140,12],[997,12],[3928,12],[3965,12],[4141,12]]},"token-inspect.html":{"position":[[39,12]]},"token-internal.html":{"position":[[218,12],[618,12],[708,12],[1207,12],[1297,12],[1796,12],[1886,12],[2370,12],[2460,12],[2919,12],[3035,12]]},"token-register.html":{"position":[[146,12],[367,12],[859,13]]},"token-vars.html":{"position":[[326,12],[1339,12],[1697,12],[2424,12]]},"tokens.html":{"position":[[19,12],[4084,13]]},"type-font-vars.html":{"position":[[199,12],[3447,12]]},"type-fonts.html":{"position":[[7244,12],[7842,12],[8552,12],[9286,12],[10337,12]]},"utils.html":{"position":[[503,12],[2269,12],[3456,12],[4374,12],[5640,12]]}}}],["accoutrement/sass/.....loc",{"_index":1284,"title":{},"contents":{"type-fonts.html":{"position":[[3916,22]]}}}],["key>..path",{"_index":1283,"title":{},"contents":{"type-fonts.html":{"position":[[3753,21]]}}}],["key>..svgid",{"_index":1286,"title":{},"contents":{"type-fonts.html":{"position":[[4008,22]]}}}],["key>.display",{"_index":1276,"title":{},"contents":{"type-fonts.html":{"position":[[3046,14]]}}}],["key>.format",{"_index":1272,"title":{},"contents":{"type-fonts.html":{"position":[[2783,14]]}}}],["key>.nam",{"_index":1268,"title":{},"contents":{"type-fonts.html":{"position":[[2594,11]]}}}],["key>.stack",{"_index":1269,"title":{},"contents":{"type-fonts.html":{"position":[[2690,12]]}}}],["key>.unicod",{"_index":1275,"title":{},"contents":{"type-fonts.html":{"position":[[2921,13]]}}}],["keyword",{"_index":928,"title":{},"contents":{"layout-queries.html":{"position":[[1561,7]]},"ratio-tokens.html":{"position":[[2146,8]]}}}],["kind",{"_index":1005,"title":{},"contents":{"LICENSE.html":{"position":[[660,5]]}}}],["known",{"_index":1112,"title":{},"contents":{"scale.html":{"position":[[1313,7]]}}}],["languag",{"_index":1212,"title":{},"contents":{"tokens.html":{"position":[[600,10],[627,8]]}}}],["larg",{"_index":530,"title":{},"contents":{"CHANGELOG.html":{"position":[[5260,6]]},"color-contrast.html":{"position":[[554,6],[2229,6],[3824,6],[5236,6],[6294,6],[6353,6],[6698,6]]},"token-api.html":{"position":[[1073,6],[1305,6],[1356,6],[1396,7]]},"utils.html":{"position":[[777,5],[2897,6],[2979,6]]}}}],["larger",{"_index":897,"title":{},"contents":{"index.html":{"position":[[2010,6]]},"utils.html":{"position":[[2085,6]]}}}],["layer",{"_index":955,"title":{},"contents":{"layout-z-index.html":{"position":[[68,7],[523,5],[669,7],[708,5],[798,5],[943,5],[1001,7],[1040,5]]}}}],["layout",{"_index":384,"title":{"layout.html":{"position":[[12,6]]}},"contents":{"CHANGELOG.html":{"position":[[767,6],[2398,7],[8605,6],[10072,6],[11858,6],[13447,7],[14475,6]]},"layout.html":{"position":[[12,6],[42,7],[259,6]]}}}],["learn",{"_index":673,"title":{},"contents":{"CHANGELOG.html":{"position":[[12917,5]]}}}],["leav",{"_index":1216,"title":{},"contents":{"tokens.html":{"position":[[2078,5]]}}}],["legaci",{"_index":363,"title":{},"contents":{"CHANGELOG.html":{"position":[[293,6],[1483,6]]},"tokens.html":{"position":[[1311,6]]}}}],["length",{"_index":165,"title":{},"contents":{"animate-change.html":{"position":[[1749,8]]},"animate-ease.html":{"position":[[3360,8]]},"animate-times.html":{"position":[[1318,8],[1342,6]]},"layout-queries.html":{"position":[[321,6],[1471,8],[1551,6],[2216,7],[2292,6],[3307,7],[3383,6],[4418,7],[4494,6],[4541,7],[4617,6]]},"scale-sizes.html":{"position":[[372,6],[2943,8],[2967,7],[3196,7],[3728,6],[3809,6],[4318,8],[4351,7],[5027,6],[5108,6]]},"scale-units.html":{"position":[[51,7],[356,8],[365,7],[387,6],[555,7],[623,6],[647,7],[673,8],[837,7],[902,6]]},"token-internal.html":{"position":[[789,7],[809,6],[863,7],[883,6],[1384,7],[1404,6],[1465,7],[1485,6],[1973,7],[1993,6],[2049,7],[2069,6],[2536,7],[2556,6],[2609,7],[2629,6],[3131,7],[3151,6],[3204,7],[3224,6]]},"utils.html":{"position":[[796,6],[4989,6]]}}}],["level",{"_index":461,"title":{},"contents":{"CHANGELOG.html":{"position":[[3447,5]]},"layout-z-index.html":{"position":[[122,5],[214,5]]}}}],["liabil",{"_index":1018,"title":{},"contents":{"LICENSE.html":{"position":[[897,10]]}}}],["liabl",{"_index":1015,"title":{},"contents":{"LICENSE.html":{"position":[[858,6]]}}}],["librari",{"_index":785,"title":{},"contents":{"color-tokens.html":{"position":[[1928,7]]},"index.html":{"position":[[429,7]]},"ratio-tokens.html":{"position":[[1377,7]]},"scale-sizes.html":{"position":[[1689,7]]},"type-fonts.html":{"position":[[5939,7]]}}}],["licens",{"_index":976,"title":{"LICENSE.html":{"position":[[4,7]]}},"contents":{"LICENSE.html":{"position":[[4,7]]},"type-fonts.html":{"position":[[1553,8]]}}}],["light",{"_index":369,"title":{},"contents":{"CHANGELOG.html":{"position":[[403,5],[5368,5],[5801,5],[5950,5],[8274,5],[8439,5]]},"color-config.html":{"position":[[231,5],[316,5],[345,6],[388,5]]},"color-contrast.html":{"position":[[450,5],[943,8],[1023,8],[1166,8],[1246,8],[1327,6],[2125,5],[2619,8],[2703,8],[2878,8],[2962,8],[3092,6],[3317,5],[3388,5],[3720,5],[4201,8],[4277,8],[4403,8],[4479,8],[5132,5],[5668,8],[5748,8],[5898,8],[5978,8]]},"color-themes.html":{"position":[[442,5],[926,5],[985,5],[1171,5],[1228,5]]},"color-tokens.html":{"position":[[804,5],[916,5],[1201,7],[1299,7]]},"color-utils.html":{"position":[[67,5],[152,6],[207,5],[249,5],[303,6],[344,5],[553,6],[627,7]]},"color.html":{"position":[[612,7],[697,7],[1246,7],[1318,7],[1611,5],[1704,6]]},"token-vars.html":{"position":[[935,13],[1986,13],[3050,13]]}}}],["light/$dark",{"_index":602,"title":{},"contents":{"CHANGELOG.html":{"position":[[8360,12]]}}}],["light/dark",{"_index":603,"title":{},"contents":{"CHANGELOG.html":{"position":[[8488,10]]},"color-themes.html":{"position":[[68,10]]}}}],["lighter",{"_index":800,"title":{},"contents":{"color-utils.html":{"position":[[102,7],[613,7],[661,7],[1431,7]]}}}],["limit",{"_index":989,"title":{},"contents":{"LICENSE.html":{"position":[[252,10],[704,7]]},"utils.html":{"position":[[4951,7]]}}}],["line",{"_index":1025,"title":{},"contents":{"ratio-tokens.html":{"position":[[270,5]]},"ratio-vars.html":{"position":[[1122,5],[1250,4],[2069,5],[2185,5],[2293,4],[3083,5],[3129,4],[3271,4],[3296,4]]},"scale-sizes.html":{"position":[[3790,4],[5089,4]]},"scale-vars.html":{"position":[[1347,7],[1450,5],[2282,7],[2336,9],[2379,7],[2429,5],[2488,5],[3277,7],[3310,4],[3415,4],[3439,5]]},"token-api.html":{"position":[[2672,4],[2741,5],[2789,6]]}}}],["linear",{"_index":287,"title":{},"contents":{"animate-ease.html":{"position":[[1981,7]]},"color-themes.html":{"position":[[1733,6],[1883,6],[2676,6]]},"ratio-tokens.html":{"position":[[2085,8],[2137,8],[2293,7],[2416,7],[2424,6]]},"scale.html":{"position":[[1134,6],[1217,7],[1514,9],[1831,8],[1953,7],[1981,9],[2078,7]]}}}],["link",{"_index":505,"title":{},"contents":{"CHANGELOG.html":{"position":[[4600,5]]},"color-tokens.html":{"position":[[1330,7],[1430,7],[1749,4],[2242,7]]},"color.html":{"position":[[783,7],[1351,7]]},"type-fonts.html":{"position":[[1527,4],[1635,5]]}}}],["lint",{"_index":847,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[816,8],[946,4]]}}}],["list",{"_index":640,"title":{"utils.html":{"position":[[11,6]]}},"contents":{"CHANGELOG.html":{"position":[[10805,5],[12343,5],[13250,4],[13836,4],[14268,5]]},"color-contrast.html":{"position":[[252,5],[325,4],[1905,5],[2000,4],[3522,5],[3595,4],[4912,5],[5007,4],[7430,5]]},"color-tokens.html":{"position":[[2997,5]]},"color-utils.html":{"position":[[396,5],[1215,5]]},"index.html":{"position":[[1520,6]]},"layout-z-index.html":{"position":[[9,6],[46,4],[111,5],[220,4],[303,5],[845,6]]},"layout.html":{"position":[[85,4]]},"scale-sizes.html":{"position":[[557,4],[2534,5],[3624,5],[3737,5],[4923,5],[5036,5]]},"token-inspect.html":{"position":[[381,4]]},"token-internal.html":{"position":[[299,6]]},"tokens.html":{"position":[[3576,5]]},"type-font-vars.html":{"position":[[1285,5],[2320,5],[3514,5]]},"type-fonts.html":{"position":[[2703,6],[2712,4],[2798,6],[2807,4],[2942,6],[3359,4],[3775,6],[3939,6],[3948,4],[4031,6],[4139,6]]},"type-pseudo.html":{"position":[[420,6]]},"utils.html":{"position":[[83,6],[202,5],[285,4],[362,5],[388,4],[422,4],[558,6],[565,6],[585,4],[658,4],[671,6],[691,5],[791,4],[2482,5],[2512,4],[4176,4],[4571,4],[4764,4],[4837,4],[5012,4],[5025,6],[5048,4],[5116,7],[5179,8]]}}}],["list.index",{"_index":1175,"title":{},"contents":{"token-internal.html":{"position":[[196,13]]}}}],["list.nth",{"_index":1177,"title":{},"contents":{"token-internal.html":{"position":[[377,12],[412,12]]}}}],["live",{"_index":870,"title":{},"contents":{"index.html":{"position":[[414,6]]}}}],["load",{"_index":1271,"title":{},"contents":{"type-fonts.html":{"position":[[2759,4]]}}}],["local",{"_index":1245,"title":{},"contents":{"type-fonts.html":{"position":[[105,7],[450,7],[2237,5],[3233,7],[3983,7],[5269,7],[5383,8],[5500,8],[8880,5]]},"type.html":{"position":[[512,7],[1007,5],[1128,5]]}}}],["locat",{"_index":291,"title":{},"contents":{"animate-ease.html":{"position":[[2124,9]]},"type-fonts.html":{"position":[[191,8]]}}}],["logic",{"_index":1160,"title":{},"contents":{"token-inspect.html":{"position":[[110,5]]},"utils.html":{"position":[[4208,5]]}}}],["long",{"_index":1133,"title":{},"contents":{"token-api.html":{"position":[[1553,4]]},"type-fonts.html":{"position":[[807,4]]}}}],["longer",{"_index":354,"title":{},"contents":{"CHANGELOG.html":{"position":[[154,6],[338,6],[445,6],[1235,6],[1332,6],[1463,6],[2851,6],[3245,6],[3473,6],[9136,6],[12399,6]]},"index.html":{"position":[[2554,6]]},"layout-z-index.html":{"position":[[572,6]]},"token-api.html":{"position":[[819,6]]},"tokens.html":{"position":[[743,6],[1063,6],[1160,6],[1291,6]]},"type-fonts.html":{"position":[[2069,6],[9140,6],[10074,6],[10181,6],[10248,6]]}}}],["longhand",{"_index":518,"title":{},"contents":{"CHANGELOG.html":{"position":[[4961,8]]}}}],["look",{"_index":480,"title":{},"contents":{"CHANGELOG.html":{"position":[[3993,4],[4464,4]]}}}],["lookup",{"_index":1145,"title":{},"contents":{"token-api.html":{"position":[[4267,7],[5387,6],[5705,6]]},"token-config.html":{"position":[[552,6],[661,6]]},"token-inspect.html":{"position":[[2273,6],[2982,6]]},"utils.html":{"position":[[1186,6],[5418,6]]}}}],["lowest",{"_index":523,"title":{},"contents":{"CHANGELOG.html":{"position":[[5107,6]]},"layout-z-index.html":{"position":[[81,6]]}}}],["lumin",{"_index":715,"title":{},"contents":{"color-contrast.html":{"position":[[6495,9],[6610,9],[7170,11],[7329,11],[7354,9],[7509,9],[7548,9]]},"color-themes.html":{"position":[[1312,11]]},"color-tokens.html":{"position":[[3686,11]]}}}],["luminos",{"_index":723,"title":{},"contents":{"color-themes.html":{"position":[[140,11],[229,11]]}}}],["machin",{"_index":1208,"title":{},"contents":{"tokens.html":{"position":[[362,8]]}}}],["made",{"_index":682,"title":{},"contents":{"CHANGELOG.html":{"position":[[13990,4]]},"scale-sizes.html":{"position":[[3903,4],[5202,4]]}}}],["main",{"_index":815,"title":{},"contents":{"color.html":{"position":[[1421,4]]},"CONTRIBUTING.html":{"position":[[1089,4]]},"layout-z-index.html":{"position":[[334,7]]},"token-api.html":{"position":[[5293,8],[5313,5],[5354,5]]},"utils.html":{"position":[[824,5],[849,5],[894,6],[997,6]]}}}],["maintain",{"_index":899,"title":{},"contents":{"index.html":{"position":[[2096,12]]},"tokens.html":{"position":[[706,11]]},"type-fonts.html":{"position":[[413,11]]}}}],["major",{"_index":350,"title":{},"contents":{"CHANGELOG.html":{"position":[[76,5],[197,5],[2543,8],[4420,5],[6916,5]]},"ratios.html":{"position":[[386,6],[453,6],[599,6],[652,6]]}}}],["make",{"_index":788,"title":{},"contents":{"color-tokens.html":{"position":[[2451,6]]},"color-utils.html":{"position":[[130,4],[962,4]]},"color.html":{"position":[[733,4]]},"CONTRIBUTING.html":{"position":[[623,4]]},"index.html":{"position":[[2062,6]]},"layout-queries.html":{"position":[[1412,6]]},"token-api.html":{"position":[[1516,4]]},"token-register.html":{"position":[[117,6]]}}}],["manag",{"_index":312,"title":{},"contents":{"animate-times.html":{"position":[[32,6]]},"animate.html":{"position":[[30,8]]},"color-config.html":{"position":[[77,8]]},"color.html":{"position":[[28,8]]},"index.html":{"position":[[163,6],[1092,8],[1144,8],[1196,8],[1261,8],[1333,8],[1599,8]]},"layout.html":{"position":[[29,8],[90,6]]},"scale.html":{"position":[[36,10]]},"token-api.html":{"position":[[355,8],[3825,6]]},"token-config.html":{"position":[[521,8]]},"token-internal.html":{"position":[[88,11]]},"token-register.html":{"position":[[316,6]]},"type-fonts.html":{"position":[[1092,8],[5696,11]]},"utils.html":{"position":[[57,6]]},"vars.html":{"position":[[56,6],[191,6]]}}}],["mani",{"_index":908,"title":{},"contents":{"index.html":{"position":[[2431,4]]},"token-api.html":{"position":[[1463,4]]},"token-vars.html":{"position":[[37,4]]},"utils.html":{"position":[[3737,4]]},"vars.html":{"position":[[157,4]]}}}],["manipul",{"_index":909,"title":{},"contents":{"index.html":{"position":[[2460,10]]},"utils.html":{"position":[[290,13],[1302,13],[2022,13],[2835,10],[3869,10]]}}}],["manual",{"_index":1369,"title":{},"contents":{"vars.html":{"position":[[1377,8]]}}}],["map",{"_index":16,"title":{"animate-change.html":{"position":[[18,4]]},"animate-ease.html":{"position":[[7,4]]},"animate-times.html":{"position":[[7,4]]},"layout-queries.html":{"position":[[17,4]]},"scale-sizes.html":{"position":[[5,4]]},"type-fonts.html":{"position":[[5,4]]},"utils.html":{"position":[[5,5]]}},"contents":{"animate-change-vars.html":{"position":[[220,4],[435,5],[810,3],[1169,5],[1199,3],[1312,3],[1655,3],[1795,4],[2238,5],[2253,3],[2901,3],[3193,5],[3221,3]]},"animate-change.html":{"position":[[18,5],[283,3],[384,3],[1199,4],[1325,4],[1360,3],[1422,3],[1566,4],[1581,3],[1662,5],[1697,3],[1910,4],[2127,6],[2134,8],[2162,4],[2262,4],[2378,4],[2833,4]]},"animate-ease-vars.html":{"position":[[217,4],[432,5],[837,3],[1201,5],[1231,3],[1349,3],[1770,3],[1908,4],[2348,5],[2363,3],[3028,3],[3320,5],[3348,3]]},"animate-ease.html":{"position":[[157,4],[1899,5],[2306,3],[2392,3],[2806,4],[2903,4],[2938,3],[3000,3],[3137,4],[3152,3],[3232,5],[3267,3],[3485,4],[3693,6],[3700,8],[3728,4],[3818,4]]},"animate-time-vars.html":{"position":[[212,4],[423,5],[772,3],[1123,5],[1153,3],[1262,3],[1553,3],[1687,4],[2126,5],[2141,3],[2752,3],[3044,5],[3072,3]]},"animate-times.html":{"position":[[7,5],[192,3],[276,3],[728,4],[758,3],[915,4],[950,3],[1012,3],[1139,4],[1154,3],[1233,5],[1268,3],[1433,4],[1639,6],[1646,8],[1674,4],[1763,4]]},"animate.html":{"position":[[120,4]]},"CHANGELOG.html":{"position":[[633,3],[694,4],[889,3],[1114,4],[1161,3],[1228,3],[1961,3],[2179,5],[2812,4],[3048,4],[4898,5],[4970,3],[6159,3],[6600,4],[6747,3],[6811,3],[7729,3],[8961,3],[9474,3],[9809,3],[10060,3],[10158,3],[10254,3],[10357,3],[10527,3],[10919,3],[11070,3],[11345,3],[12022,3],[12077,3],[12615,3],[12824,3],[12911,5],[13010,3],[13058,3],[13569,4],[14021,4]]},"color-contrast.html":{"position":[[3479,4]]},"color-themes.html":{"position":[[61,3],[103,3],[339,5],[356,3],[2185,5],[2986,5]]},"color-tokens.html":{"position":[[25,5],[81,3],[167,3],[664,4],[694,3],[1058,3],[1636,4],[1975,6],[1982,8],[2010,4],[2100,4],[2365,5],[2514,3],[2660,3],[2725,4],[3070,3],[3106,4],[3121,3],[3201,5],[3216,3],[3288,4]]},"color-vars.html":{"position":[[216,4],[429,5],[818,3],[1173,5],[1203,3],[1314,3],[1650,3],[1787,4],[2228,5],[2243,3],[2879,3],[3171,5],[3199,3]]},"color.html":{"position":[[97,4],[112,4],[1002,5],[1087,3],[1141,5],[1434,4]]},"index.html":{"position":[[1440,4],[1540,4],[1632,5],[1647,5],[1726,4],[1848,5],[1989,3],[2365,3],[2485,3],[2571,4],[2727,4]]},"layout-queries.html":{"position":[[27,5],[77,3],[287,3],[379,3],[768,4],[806,3],[859,3],[921,3],[1052,3],[1137,4],[1152,3],[1237,5],[1272,3],[1659,5]]},"layout.html":{"position":[[118,4]]},"ratio-tokens.html":{"position":[[96,5],[233,6],[522,3],[584,3],[713,4],[728,3],[808,5],[843,3],[1233,4],[1424,6],[1431,8],[1459,4],[1549,4],[1606,5],[1888,5],[1923,3]]},"ratio-vars.html":{"position":[[211,5],[567,3],[922,5],[952,3],[1063,3],[1517,4],[1958,5],[1973,3],[2599,3],[2891,5],[2919,3]]},"scale-sizes.html":{"position":[[27,5],[252,3],[444,3],[828,5],[868,3],[962,3],[990,5],[1400,4],[1736,6],[1743,8],[1771,4],[1860,4],[2028,5],[2102,4],[2213,3],[2268,3],[2561,3],[2690,4],[2717,3],[2858,5],[2893,3],[3303,3],[3358,3],[3651,3],[4065,4],[4092,3],[4233,5],[4268,3],[4602,3],[4657,3],[4950,3],[5364,4],[5391,3],[5532,5],[5567,3]]},"scale-units.html":{"position":[[277,5],[331,4],[1233,5]]},"scale-vars.html":{"position":[[212,4],[423,5],[774,3],[1125,5],[1155,3],[1264,3],[1575,3],[1709,4],[2148,5],[2163,3],[2770,3],[3062,5],[3090,3]]},"scale.html":{"position":[[90,3],[1406,4],[1639,5],[1674,3]]},"token-api.html":{"position":[[6,4],[81,5],[104,4],[161,5],[229,3],[495,3],[597,3],[646,4],[700,5],[870,5],[1010,5],[1297,4],[1334,5],[1577,3],[1728,5],[1954,5],[2081,3],[2384,3],[2449,5],[2621,4],[2719,5],[3053,5],[3339,5],[3941,3],[4031,3],[4129,3],[4154,4],[4384,3],[4482,3],[4543,5],[4549,5],[4557,3],[4635,3],[4680,4],[4695,3],[4805,3],[4832,3],[4845,5],[5046,3],[5057,5],[5221,4],[5270,4],[5288,4],[5574,4],[5697,3],[5732,5],[5738,5],[5746,3],[5837,3],[5892,3],[5918,3],[5931,5]]},"token-config.html":{"position":[[415,3]]},"token-inspect.html":{"position":[[52,3],[974,5],[980,5],[988,3],[2046,4],[2176,5],[2182,5],[2190,3]]},"token-internal.html":{"position":[[631,5],[721,4],[1220,5],[1310,4],[1809,5],[1899,4],[2383,5],[2473,4],[2932,5],[3048,4]]},"token-register.html":{"position":[[159,3],[245,5],[301,3],[380,5],[537,4],[616,3],[668,3],[725,3],[1033,3],[1086,5],[1143,3],[1221,5]]},"token-vars.html":{"position":[[95,3],[213,3],[314,5],[320,5],[339,3],[417,4],[1359,3],[1685,5],[1691,5],[1710,3],[1894,3],[2412,5],[2418,5],[2437,3],[2515,4]]},"tokens.html":{"position":[[75,4],[306,4],[760,4],[924,4],[1056,3],[1789,3],[2143,4],[2158,3],[2651,4],[3201,3],[3811,3],[4163,5]]},"type-font-vars.html":{"position":[[212,4],[423,5],[843,3],[1194,5],[1224,3],[1296,3],[1439,3],[1739,3],[1873,4],[2331,3],[2418,5],[2433,3],[3133,3],[3432,5],[3460,3],[3525,3]]},"type-fonts.html":{"position":[[759,3],[1050,5],[1084,3],[1159,3],[1509,5],[1691,3],[1868,3],[2052,3],[2181,4],[2385,3],[2476,3],[2498,5],[2563,3],[3212,4],[3693,3],[5687,3],[5729,3],[6005,5],[6088,5],[6094,5],[6100,3],[6217,4],[6513,5],[6582,4],[6791,3],[6822,3],[7019,3],[7070,3],[7095,3],[7229,5],[7264,3],[7314,5],[7344,3],[7543,4],[7608,3],[7806,4],[7827,5],[7862,3],[8412,3],[8516,4],[8537,5],[8572,3],[9030,4],[9069,3],[9251,3],[9271,5],[9306,3],[10322,5],[10357,3]]},"type.html":{"position":[[90,3]]},"utils.html":{"position":[[73,5],[516,4],[816,5],[1216,4],[1298,3],[1355,4],[1374,4],[1509,4],[1534,3],[1567,3],[1637,6],[1644,9],[1673,4],[1700,5],[1717,3],[2282,4],[2859,5],[3469,4],[3893,5],[4387,4],[5108,5],[5653,4],[5868,5]]},"vars.html":{"position":[[1246,3],[1342,4],[1396,5],[1471,3],[1743,5],[1760,3],[1970,4]]}}}],["map.get",{"_index":486,"title":{},"contents":{"CHANGELOG.html":{"position":[[4148,9]]},"token-config.html":{"position":[[241,9]]}}}],["map.ha",{"_index":1170,"title":{},"contents":{"token-inspect.html":{"position":[[2132,7]]}}}],["margin",{"_index":1181,"title":{},"contents":{"token-internal.html":{"position":[[1017,9],[1060,11],[1625,9],[1667,11]]}}}],["mark",{"_index":562,"title":{},"contents":{"CHANGELOG.html":{"position":[[6354,6]]},"token-inspect.html":{"position":[[202,6],[398,6]]}}}],["match",{"_index":1078,"title":{},"contents":{"scale-sizes.html":{"position":[[1089,5]]},"token-config.html":{"position":[[395,5]]}}}],["math",{"_index":676,"title":{},"contents":{"CHANGELOG.html":{"position":[[13217,5],[13887,4]]},"scale-sizes.html":{"position":[[506,4],[637,4]]},"token-internal.html":{"position":[[286,4]]},"tokens.html":{"position":[[3570,5]]}}}],["maven",{"_index":1331,"title":{},"contents":{"type.html":{"position":[[581,8]]}}}],["maven/maven_pro_bold",{"_index":1333,"title":{},"contents":{"type.html":{"position":[[713,21]]}}}],["maven/maven_pro_regular",{"_index":1332,"title":{},"contents":{"type.html":{"position":[[670,24]]}}}],["max",{"_index":586,"title":{},"contents":{"CHANGELOG.html":{"position":[[7032,4]]},"color-contrast.html":{"position":[[873,3],[2569,3],[4151,3],[5618,3]]},"layout-queries.html":{"position":[[1904,3],[2210,5],[2425,4],[2535,4],[2704,4],[2994,3],[3949,3],[4106,3],[4535,5],[4906,4],[5132,4],[5290,5],[5333,5],[5374,3],[5514,3],[5622,3],[5694,3]]},"layout.html":{"position":[[733,3]]}}}],["maximum",{"_index":524,"title":{},"contents":{"CHANGELOG.html":{"position":[[5171,7]]},"color-contrast.html":{"position":[[700,7],[2375,7],[3970,7],[5382,7]]},"layout-queries.html":{"position":[[4636,7]]},"utils.html":{"position":[[4981,7]]}}}],["max–./accoutr",{"_index":881,"title":{},"contents":{"index.html":{"position":[[782,18]]}}}],["to>/accoutrement/sass/anim",{"_index":330,"title":{},"contents":{"animate.html":{"position":[[306,31]]}}}],["to>/accoutrement/sass/color",{"_index":809,"title":{},"contents":{"color.html":{"position":[[397,29]]},"index.html":{"position":[[910,29]]}}}],["to>/accoutrement/sass/layout",{"_index":965,"title":{},"contents":{"layout.html":{"position":[[297,30]]}}}],["to>/accoutrement/sass/scal",{"_index":1104,"title":{},"contents":{"scale.html":{"position":[[352,29]]}}}],["to>/accoutrement/sass/token",{"_index":1215,"title":{},"contents":{"tokens.html":{"position":[[2013,30]]}}}],["to>/accoutrement/sass/tool",{"_index":882,"title":{},"contents":{"index.html":{"position":[[813,29]]}}}],["to>/accoutrement/sass/typ",{"_index":1330,"title":{},"contents":{"type.html":{"position":[[372,28]]}}}],["toast",{"_index":199,"title":{},"contents":{"animate-ease-vars.html":{"position":[[2597,9],[2708,6]]}}}],["togeth",{"_index":143,"title":{},"contents":{"animate-change.html":{"position":[[903,8]]},"token-api.html":{"position":[[1845,8]]},"token-internal.html":{"position":[[606,8]]},"type-fonts.html":{"position":[[5788,8]]}}}],["token",{"_index":26,"title":{"color-tokens.html":{"position":[[6,6]]},"color-vars.html":{"position":[[6,6]]},"ratio-tokens.html":{"position":[[6,6]]},"ratio-vars.html":{"position":[[6,6]]},"token-api.html":{"position":[[10,6]]},"token-config.html":{"position":[[0,6]]},"token-inspect.html":{"position":[[11,6]]},"token-vars.html":{"position":[[0,6]]},"tokens.html":{"position":[[12,6]]}},"contents":{"animate-change-vars.html":{"position":[[349,7],[2054,5],[2068,5],[2736,6],[2784,5],[3018,5],[3032,5],[3310,8],[3675,7]]},"animate-ease-vars.html":{"position":[[346,7],[1245,6],[2165,5],[2179,5],[2865,6],[2913,5],[3145,5],[3159,5],[3362,6],[3443,8],[3853,7]]},"animate-ease.html":{"position":[[151,5]]},"animate-time-vars.html":{"position":[[339,7],[1944,5],[1958,5],[2591,6],[2639,5],[2869,5],[2883,5],[3159,8],[3497,7]]},"CHANGELOG.html":{"position":[[619,8],[1119,7],[1295,5],[1387,5],[1519,7],[1567,5],[1628,5],[1729,5],[1807,5],[1935,7],[1985,5],[2040,5],[2173,5],[2260,7],[2708,7],[3209,7],[3423,7],[4106,7],[4168,7],[4230,7],[4458,5],[6163,6],[6225,6],[6264,5],[6302,6],[6751,5],[7218,6],[7246,6],[7258,5],[7273,8],[7322,5],[7491,6],[7617,7],[7683,5],[7733,6],[7888,6],[8636,6],[8727,6],[11223,7]]},"color-contrast.html":{"position":[[1435,7],[6457,5],[6572,5],[7459,5]]},"color-vars.html":{"position":[[344,7],[2045,5],[2059,5],[2716,6],[2764,5],[2996,5],[3010,5],[3287,8],[3643,7]]},"color.html":{"position":[[433,6],[461,5],[523,5],[1731,6],[1838,5]]},"index.html":{"position":[[182,6],[1545,6],[1556,5],[1615,6],[1840,7],[2403,5],[2471,6],[2565,5],[2807,5]]},"ratio-tokens.html":{"position":[[6,6],[74,5],[227,5],[1678,6],[1784,7],[2012,7],[2052,5]]},"ratio-vars.html":{"position":[[6,6],[126,7],[1384,6],[1775,5],[1789,5],[2436,6],[2484,5],[2716,5],[2730,5],[3007,8],[3403,7]]},"ratios.html":{"position":[[87,5]]},"scale-vars.html":{"position":[[339,7],[1966,5],[1980,5],[2609,6],[2657,5],[2887,5],[2901,5],[3177,8],[3513,7]]},"scale.html":{"position":[[1400,5],[1439,6],[1496,6]]},"token-api.html":{"position":[[0,5],[18,7],[153,7],[223,5],[261,5],[283,7],[385,5],[987,6],[2712,6],[4204,5],[4252,5],[4285,5],[4388,6],[4564,5],[5050,6],[5430,7],[5543,5],[5674,5],[5753,5],[5792,7],[5965,7],[6058,8],[6134,7]]},"token-config.html":{"position":[[150,5],[611,7]]},"token-inspect.html":{"position":[[11,6],[56,5],[170,7],[189,5],[326,5],[531,8],[580,8],[695,6],[798,5],[841,5],[1022,7],[1038,5],[1182,5],[1220,7],[1866,7],[1889,5],[2004,7],[2022,5],[2080,5],[2224,7],[2240,5],[2324,5],[2431,5],[2469,5]]},"token-internal.html":{"position":[[82,5]]},"token-vars.html":{"position":[[0,6],[89,5],[163,5],[217,6],[346,6],[370,7],[382,5],[484,5],[603,5],[617,5],[831,5],[1249,7],[1298,6],[1316,6],[1352,6],[1407,5],[1503,6],[1717,6],[1805,5],[1880,6],[2188,5],[2219,7],[2241,7],[2297,6],[2345,5],[2444,6],[2468,7],[2480,5],[2868,5],[3494,5]]},"tokens.html":{"position":[[12,6],[32,6],[90,8],[159,6],[506,5],[754,5],[1004,5],[1123,5],[1215,5],[1347,7],[1395,5],[1456,5],[1557,5],[1635,5],[1763,7],[1813,5],[1868,5],[1984,6],[2137,5],[2190,6],[2303,6],[2346,6],[2645,5],[2687,6],[2808,7],[2874,6],[4146,5]]},"type-font-vars.html":{"position":[[339,7],[2130,5],[2144,5],[2972,6],[3020,5],[3250,5],[3264,5],[3653,8],[4000,7]]},"type-fonts.html":{"position":[[10948,7]]},"utils.html":{"position":[[1126,7],[1406,6]]},"vars.html":{"position":[[420,5],[753,5],[843,5],[1159,5],[1183,7]]}}}],["token($color",{"_index":1172,"title":{},"contents":{"token-inspect.html":{"position":[[2611,14],[2661,14],[2724,14],[2803,14]]},"token-vars.html":{"position":[[3129,14],[3172,14]]},"tokens.html":{"position":[[3316,14],[3359,14]]}}}],["token($map",{"_index":1147,"title":{},"contents":{"token-api.html":{"position":[[4409,11]]}}}],["token($sourc",{"_index":598,"title":{},"contents":{"CHANGELOG.html":{"position":[[7790,14]]}}}],["token('_priv",{"_index":1161,"title":{},"contents":{"token-inspect.html":{"position":[[515,15]]}}}],["token('publ",{"_index":1162,"title":{},"contents":{"token-inspect.html":{"position":[[566,13]]}}}],["token.get",{"_index":906,"title":{},"contents":{"index.html":{"position":[[2381,11]]},"tokens.html":{"position":[[2531,11]]}}}],["token.get($color",{"_index":1222,"title":{},"contents":{"tokens.html":{"position":[[2611,18]]}}}],["token.register('mi",{"_index":1228,"title":{},"contents":{"tokens.html":{"position":[[4003,18]]}}}],["token.register('rgba",{"_index":1229,"title":{},"contents":{"tokens.html":{"position":[[4178,22]]}}}],["tokens.$handl",{"_index":398,"title":{},"contents":{"CHANGELOG.html":{"position":[[1410,14]]},"tokens.html":{"position":[[1238,14]]}}}],["token’",{"_index":85,"title":{},"contents":{"animate-change-vars.html":{"position":[[2143,7],[3107,7]]},"animate-ease-vars.html":{"position":[[2254,7],[3234,7]]},"animate-time-vars.html":{"position":[[2033,7],[2958,7]]},"color-vars.html":{"position":[[2134,7],[3085,7]]},"ratio-vars.html":{"position":[[1864,7],[2805,7]]},"scale-vars.html":{"position":[[2055,7],[2976,7]]},"token-vars.html":{"position":[[692,7]]},"type-font-vars.html":{"position":[[2219,7],[3339,7]]}}}],["tool",{"_index":323,"title":{},"contents":{"animate.html":{"position":[[20,5]]},"CHANGELOG.html":{"position":[[6254,5],[11139,7],[13090,5]]},"color-tokens.html":{"position":[[962,6]]},"color.html":{"position":[[18,5],[1798,5]]},"index.html":{"position":[[366,5],[990,7]]},"layout.html":{"position":[[19,5]]},"ratio-tokens.html":{"position":[[21,5]]},"scale.html":{"position":[[47,6]]},"token-inspect.html":{"position":[[18,5]]},"token-register.html":{"position":[[83,5]]},"token-vars.html":{"position":[[141,5]]},"tokens.html":{"position":[[482,5],[696,5]]},"type-fonts.html":{"position":[[372,4],[1310,4],[1345,5],[6593,5]]},"vars.html":{"position":[[260,5]]}}}],["tools.$breakpoint",{"_index":922,"title":{},"contents":{"layout-queries.html":{"position":[[466,19],[552,19],[2591,19],[3683,19],[4965,19]]}}}],["tools.$chang",{"_index":38,"title":{},"contents":{"animate-change-vars.html":{"position":[[536,15],[573,13],[1329,15],[2308,15],[3344,15]]},"animate-change.html":{"position":[[2568,15],[3026,15]]}}}],["tools.$color",{"_index":696,"title":{},"contents":{"color-contrast.html":{"position":[[906,14],[1129,14],[2582,14],[2841,14],[4164,14],[4366,14],[5631,14],[5861,14]]},"color-vars.html":{"position":[[530,14],[565,12],[1331,14],[2297,14],[3321,14]]}}}],["tools.$eas",{"_index":184,"title":{},"contents":{"animate-ease-vars.html":{"position":[[533,14],[578,13],[1366,14],[2417,14],[3477,14]]}}}],["tools.$font",{"_index":1237,"title":{},"contents":{"type-font-vars.html":{"position":[[524,13],[2486,13]]},"type-helpers.html":{"position":[[378,11]]}}}],["tools.$ratio",{"_index":1024,"title":{},"contents":{"ratio-tokens.html":{"position":[[253,14]]},"ratio-vars.html":{"position":[[312,14],[348,12],[1080,14],[2027,14],[3041,14]]}}}],["tools.$siz",{"_index":1094,"title":{},"contents":{"scale-vars.html":{"position":[[524,13],[556,11],[1281,13],[2216,13],[3211,13]]}}}],["tools.$tim",{"_index":299,"title":{},"contents":{"animate-time-vars.html":{"position":[[524,13],[555,11],[1279,13],[2194,13],[3193,13]]}}}],["tools.above('green",{"_index":947,"title":{},"contents":{"layout-queries.html":{"position":[[3729,20]]}}}],["tools.above(50em",{"_index":945,"title":{},"contents":{"layout-queries.html":{"position":[[3558,17]]}}}],["tools.add",{"_index":733,"title":{},"contents":{"color-themes.html":{"position":[[569,9],[659,9]]},"color-tokens.html":{"position":[[2277,9]]},"scale-sizes.html":{"position":[[1958,9]]},"type-fonts.html":{"position":[[6405,9]]}}}],["tools.animate('fad",{"_index":182,"title":{},"contents":{"animate-change.html":{"position":[[2649,19]]}}}],["tools.below('r",{"_index":942,"title":{},"contents":{"layout-queries.html":{"position":[[2635,18]]}}}],["tools.below(30em",{"_index":940,"title":{},"contents":{"layout-queries.html":{"position":[[2467,17]]}}}],["tools.between('r",{"_index":950,"title":{},"contents":{"layout-queries.html":{"position":[[5027,20]]}}}],["tools.between(30em",{"_index":948,"title":{},"contents":{"layout-queries.html":{"position":[[4805,19]]}}}],["tools.chang",{"_index":43,"title":{},"contents":{"animate-change-vars.html":{"position":[[626,12],[1449,13],[2432,12],[2467,12]]}}}],["tools.color",{"_index":806,"title":{},"contents":{"color-vars.html":{"position":[[617,11],[1450,12],[2420,11],[2454,11]]}}}],["tools.compile($map",{"_index":1156,"title":{},"contents":{"token-api.html":{"position":[[6036,21]]}}}],["tools.contrast",{"_index":706,"title":{},"contents":{"color-contrast.html":{"position":[[4247,15],[4449,15],[5716,17],[5946,17],[6937,16],[6995,16]]}}}],["tools.custom",{"_index":1374,"title":{},"contents":{"vars.html":{"position":[[1644,12],[2060,12]]}}}],["tools.eas",{"_index":186,"title":{},"contents":{"animate-ease-vars.html":{"position":[[631,10],[1498,12],[2553,10],[2585,10]]}}}],["tools.font",{"_index":1240,"title":{},"contents":{"type-font-vars.html":{"position":[[644,10],[1597,11],[2637,10],[2668,10]]},"type-fonts.html":{"position":[[8135,10],[8747,10],[9681,10]]},"type-helpers.html":{"position":[[415,10]]}}}],["tools.get($map",{"_index":1149,"title":{},"contents":{"token-api.html":{"position":[[4955,17],[5105,17]]},"utils.html":{"position":[[2961,17],[3975,17],[5161,17],[5978,17]]}}}],["tools.get($mi",{"_index":1152,"title":{},"contents":{"token-api.html":{"position":[[5256,13]]}}}],["tools.get($s",{"_index":1178,"title":{},"contents":{"token-internal.html":{"position":[[443,19],[488,19],[1087,19],[1692,19],[2263,19],[2817,19],[3386,19]]}}}],["tools.ha",{"_index":1171,"title":{},"contents":{"token-inspect.html":{"position":[[2599,11],[2649,11],[2712,11],[2791,11]]}}}],["tools.i",{"_index":1038,"title":{},"contents":{"ratio-tokens.html":{"position":[[2224,10],[2264,10],[2301,10],[2341,10]]},"token-inspect.html":{"position":[[496,10],[547,10],[1451,10],[1505,10],[1579,10],[1636,10]]}}}],["tools.ident($nam",{"_index":1367,"title":{},"contents":{"vars.html":{"position":[[963,20]]}}}],["tools.import",{"_index":1322,"title":{},"contents":{"type-fonts.html":{"position":[[10851,12]]}}}],["tools.ratio",{"_index":1044,"title":{},"contents":{"ratio-vars.html":{"position":[[400,12],[1173,12],[2124,11],[2161,11]]}}}],["tools.ratio('_fifth",{"_index":1036,"title":{},"contents":{"ratio-tokens.html":{"position":[[1036,24]]}}}],["tools.ratio('_octav",{"_index":1034,"title":{},"contents":{"ratio-tokens.html":{"position":[[996,25]]}}}],["tools.scale(16px",{"_index":1117,"title":{},"contents":{"scale.html":{"position":[[1961,19]]}}}],["tools.scale(24px",{"_index":1116,"title":{},"contents":{"scale.html":{"position":[[1917,19]]}}}],["tools.scale(700px",{"_index":1115,"title":{},"contents":{"scale.html":{"position":[[1869,20]]}}}],["tools.shad",{"_index":735,"title":{},"contents":{"color-themes.html":{"position":[[616,12]]}}}],["tools.siz",{"_index":1096,"title":{},"contents":{"scale-vars.html":{"position":[[607,10],[1385,11],[2324,10],[2355,10]]}}}],["tools.strip",{"_index":747,"title":{},"contents":{"color-themes.html":{"position":[[1760,12],[2537,12]]}}}],["tools.tim",{"_index":300,"title":{},"contents":{"animate-time-vars.html":{"position":[[606,10],[1365,11],[2301,10],[2332,10]]}}}],["tools.token",{"_index":1201,"title":{},"contents":{"token-vars.html":{"position":[[999,11],[1042,11],[2046,12]]},"tokens.html":{"position":[[3221,12]]}}}],["tools.transition('fad",{"_index":183,"title":{},"contents":{"animate-change.html":{"position":[[3099,25]]}}}],["tools.var",{"_index":99,"title":{},"contents":{"animate-change-vars.html":{"position":[[3474,9],[3510,9]]},"animate-ease-vars.html":{"position":[[3623,9]]},"animate-time-vars.html":{"position":[[3309,9],[3339,9]]},"color-contrast.html":{"position":[[989,9],[1212,9],[2667,9],[2926,9]]},"color-vars.html":{"position":[[3449,9],[3483,9]]},"ratio-vars.html":{"position":[[3142,9],[3199,11]]},"scale-vars.html":{"position":[[3323,9],[3356,9]]},"token-vars.html":{"position":[[3119,9],[3162,9]]},"tokens.html":{"position":[[3306,9],[3349,9]]},"type-font-vars.html":{"position":[[3836,9]]}}}],["top",{"_index":958,"title":{},"contents":{"layout-z-index.html":{"position":[[210,3]]}}}],["tort",{"_index":1021,"title":{},"contents":{"LICENSE.html":{"position":[[942,4]]}}}],["total",{"_index":677,"title":{},"contents":{"CHANGELOG.html":{"position":[[13321,7]]}}}],["trace",{"_index":1167,"title":{},"contents":{"token-inspect.html":{"position":[[1055,6],[1090,5],[1132,5]]}}}],["transform",{"_index":132,"title":{},"contents":{"animate-change.html":{"position":[[668,9]]}}}],["transit",{"_index":105,"title":{},"contents":{"animate-change.html":{"position":[[37,11],[105,11],[320,12],[647,11],[1852,12],[2778,12],[2804,11],[2860,10],[2924,11],[2985,12],[3151,11]]},"animate-ease-vars.html":{"position":[[3665,11],[3787,11]]},"animate-time-vars.html":{"position":[[3289,11],[3396,11]]},"animate.html":{"position":[[52,12],[103,11],[677,10],[709,10],[746,10],[850,11],[953,11],[1266,11],[1470,12]]},"index.html":{"position":[[1105,11]]}}}],["transition('fad",{"_index":345,"title":{},"contents":{"animate.html":{"position":[[1381,16]]}}}],["translat",{"_index":202,"title":{},"contents":{"animate-ease-vars.html":{"position":[[3677,9],[3799,9]]}}}],["treat",{"_index":694,"title":{},"contents":{"color-contrast.html":{"position":[[593,7],[2268,7],[3863,7],[5275,7]]},"type-fonts.html":{"position":[[2363,7]]},"utils.html":{"position":[[2771,6],[3805,6]]}}}],["tri",{"_index":1202,"title":{},"contents":{"token-vars.html":{"position":[[2600,3]]}}}],["trigger",{"_index":849,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[917,9]]},"token-config.html":{"position":[[116,7]]}}}],["trim",{"_index":624,"title":{},"contents":{"CHANGELOG.html":{"position":[[9870,4],[9925,4],[11360,4],[12490,6]]},"utils.html":{"position":[[5453,6],[5460,5],[5570,7],[5673,5],[5682,7],[5746,4],[5815,7],[5840,7],[5931,7],[5955,8],[5996,8]]}}}],["trim($str",{"_index":650,"title":{},"contents":{"CHANGELOG.html":{"position":[[11306,13]]}}}],["true",{"_index":83,"title":{},"contents":{"animate-change-vars.html":{"position":[[1952,4],[2011,4],[2916,4],[2975,4]]},"animate-ease-vars.html":{"position":[[2063,4],[2122,4],[3043,4],[3102,4]]},"animate-time-vars.html":{"position":[[1842,4],[1901,4],[2767,4],[2826,4]]},"color-config.html":{"position":[[285,4]]},"color-vars.html":{"position":[[1943,4],[2002,4],[2894,4],[2953,4]]},"CONTRIBUTING.html":{"position":[[589,4]]},"index.html":{"position":[[562,5]]},"layout-queries.html":{"position":[[1328,4]]},"ratio-tokens.html":{"position":[[2020,4]]},"ratio-vars.html":{"position":[[1673,4],[1732,4],[2614,4],[2673,4]]},"scale-vars.html":{"position":[[1864,4],[1923,4],[2785,4],[2844,4]]},"token-inspect.html":{"position":[[435,4],[609,4],[1124,4],[1686,6],[2409,4],[2870,4],[2921,4],[2955,4]]},"token-vars.html":{"position":[[501,4],[560,4],[2531,4],[2590,4]]},"type-font-vars.html":{"position":[[2028,4],[2087,4],[3148,4],[3207,4]]},"utils.html":{"position":[[2645,5]]}}}],["truth",{"_index":900,"title":{},"contents":{"index.html":{"position":[[2131,6]]}}}],["ttf",{"_index":1294,"title":{},"contents":{"type-fonts.html":{"position":[[4398,7]]},"type.html":{"position":[[653,6]]}}}],["turn",{"_index":627,"title":{},"contents":{"CHANGELOG.html":{"position":[[10211,4]]},"layout-queries.html":{"position":[[1013,4]]},"ratio-tokens.html":{"position":[[2043,4]]},"token-api.html":{"position":[[4110,4]]}}}],["two",{"_index":709,"title":{},"contents":{"color-contrast.html":{"position":[[6162,3],[6892,3]]},"color-tokens.html":{"position":[[341,5]]},"token-internal.html":{"position":[[595,3],[1782,3],[2356,3],[2905,3],[3295,3]]},"type-pseudo.html":{"position":[[434,3]]}}}],["type",{"_index":14,"title":{"type-helpers.html":{"position":[[0,4]]},"type.html":{"position":[[12,4]]}},"contents":{"animate-change-vars.html":{"position":[[200,6]]},"animate-ease-vars.html":{"position":[[197,6]]},"animate-time-vars.html":{"position":[[192,6]]},"CHANGELOG.html":{"position":[[2225,4],[8942,4],[10931,4],[11470,4],[12357,4],[13162,5],[14126,5],[14514,4]]},"color-vars.html":{"position":[[196,6]]},"index.html":{"position":[[1072,5],[1250,4]]},"layout-z-index.html":{"position":[[579,4]]},"ratio-tokens.html":{"position":[[1728,4]]},"scale-vars.html":{"position":[[192,6]]},"token-api.html":{"position":[[391,6],[2371,6],[4061,5]]},"tokens.html":{"position":[[110,6]]},"type-font-vars.html":{"position":[[192,6]]},"type-fonts.html":{"position":[[438,6],[855,4],[1931,4],[7654,4],[9115,4],[10223,4]]},"type-helpers.html":{"position":[[135,4]]},"type.html":{"position":[[12,4],[336,4]]}}}],["typekit",{"_index":1252,"title":{},"contents":{"type-fonts.html":{"position":[[523,7]]}}}],["typo",{"_index":434,"title":{},"contents":{"CHANGELOG.html":{"position":[[2661,5],[9369,6]]},"CONTRIBUTING.html":{"position":[[1009,6]]}}}],["typograph",{"_index":382,"title":{},"contents":{"CHANGELOG.html":{"position":[[744,11]]},"index.html":{"position":[[1216,11]]}}}],["typographi",{"_index":887,"title":{},"contents":{"index.html":{"position":[[1353,10]]},"type.html":{"position":[[22,10]]}}}],["u+0000",{"_index":1298,"title":{},"contents":{"type-fonts.html":{"position":[[4548,7]]}}}],["u+0131",{"_index":1300,"title":{},"contents":{"type-fonts.html":{"position":[[4562,7]]}}}],["u+0152",{"_index":1301,"title":{},"contents":{"type-fonts.html":{"position":[[4570,6]]}}}],["u+02c6",{"_index":1303,"title":{},"contents":{"type-fonts.html":{"position":[[4583,8]]}}}],["un",{"_index":674,"title":{},"contents":{"CHANGELOG.html":{"position":[[13144,2]]},"layout-queries.html":{"position":[[5633,2]]}}}],["unchang",{"_index":89,"title":{},"contents":{"animate-change-vars.html":{"position":[[2210,9],[3174,9]]},"animate-ease-vars.html":{"position":[[2321,9],[3301,9]]},"animate-time-vars.html":{"position":[[2100,9],[3025,9]]},"color-vars.html":{"position":[[2201,9],[3152,9]]},"ratio-vars.html":{"position":[[1931,9],[2872,9]]},"scale-vars.html":{"position":[[2122,9],[3043,9]]},"token-vars.html":{"position":[[759,9],[2796,9]]},"type-font-vars.html":{"position":[[2286,9],[3406,9]]}}}],["under",{"_index":683,"title":{},"contents":{"CHANGELOG.html":{"position":[[14026,5]]},"token-register.html":{"position":[[505,5],[1147,5]]}}}],["understand",{"_index":1213,"title":{},"contents":{"tokens.html":{"position":[[641,11]]}}}],["understood",{"_index":866,"title":{},"contents":{"index.html":{"position":[[242,10]]}}}],["unfound",{"_index":1356,"title":{},"contents":{"utils.html":{"position":[[4719,7]]}}}],["unicod",{"_index":1266,"title":{},"contents":{"type-fonts.html":{"position":[[2428,7],[2981,7],[3005,7],[4531,8]]}}}],["unit",{"_index":467,"title":{"scale-units.html":{"position":[[0,4]]}},"contents":{"CHANGELOG.html":{"position":[[3618,4],[10496,7],[10569,7],[10627,4],[10783,4],[11969,7],[12119,7],[12177,4],[12321,4]]},"CONTRIBUTING.html":{"position":[[570,4]]},"index.html":{"position":[[1968,7]]},"layout-queries.html":{"position":[[598,7],[2102,5],[3193,5],[4304,5]]},"scale-sizes.html":{"position":[[330,4],[1197,7],[1351,7],[2128,6],[2171,7],[2310,7],[2368,4],[2512,4],[2697,4],[2786,4],[2992,6],[3135,7],[3218,6],[3261,7],[3400,7],[3458,4],[3602,4],[3847,5],[4072,4],[4161,4],[4376,6],[4512,4],[4560,7],[4699,7],[4757,4],[4901,4],[5146,5],[5371,4],[5460,4],[5700,6]]},"scale-units.html":{"position":[[11,5],[35,7],[78,6],[227,6],[243,6],[429,5],[456,5],[482,5],[603,6],[688,6],[882,6],[1078,5]]},"scale.html":{"position":[[185,5],[734,7],[1020,5]]},"token-api.html":{"position":[[1804,7],[2030,7],[2107,5],[2513,7],[3444,7]]}}}],["units(16px",{"_index":1135,"title":{},"contents":{"token-api.html":{"position":[[1709,11]]}}}],["units(times(16px",{"_index":1136,"title":{},"contents":{"token-api.html":{"position":[[1923,17]]}}}],["unknown",{"_index":1257,"title":{},"contents":{"type-fonts.html":{"position":[[1363,7]]}}}],["unless",{"_index":1255,"title":{},"contents":{"type-fonts.html":{"position":[[947,6]]},"utils.html":{"position":[[441,6],[1586,6],[2207,6],[3394,6],[4312,6],[5578,6]]}}}],["unlik",{"_index":1209,"title":{},"contents":{"tokens.html":{"position":[[564,6]]}}}],["unreleas",{"_index":347,"title":{},"contents":{"CHANGELOG.html":{"position":[[31,10]]}}}],["unresolv",{"_index":457,"title":{},"contents":{"CHANGELOG.html":{"position":[[3338,10]]}}}],["unset",{"_index":438,"title":{},"contents":{"CHANGELOG.html":{"position":[[2795,5],[3308,5]]}}}],["up",{"_index":417,"title":{},"contents":{"CHANGELOG.html":{"position":[[2356,2],[3998,2],[4469,2]]},"CONTRIBUTING.html":{"position":[[455,2],[1176,2]]},"layout-queries.html":{"position":[[5588,3]]},"scale.html":{"position":[[1168,2]]}}}],["updat",{"_index":178,"title":{},"contents":{"animate-change.html":{"position":[[2219,7]]},"animate-ease.html":{"position":[[3776,7]]},"animate-times.html":{"position":[[1722,7]]},"CHANGELOG.html":{"position":[[82,7]]},"color-tokens.html":{"position":[[2058,7]]},"CONTRIBUTING.html":{"position":[[547,6],[704,6]]},"ratio-tokens.html":{"position":[[1507,7]]},"scale-sizes.html":{"position":[[1819,7]]},"type-fonts.html":{"position":[[6176,7]]}}}],["upgrad",{"_index":429,"title":{},"contents":{"CHANGELOG.html":{"position":[[2615,7],[3736,7],[4624,7],[4760,7]]}}}],["uri",{"_index":1291,"title":{},"contents":{"type-fonts.html":{"position":[[4212,4],[5291,4]]}}}],["uri’",{"_index":1309,"title":{},"contents":{"type-fonts.html":{"position":[[5259,5]]},"type-helpers.html":{"position":[[176,6]]}}}],["url",{"_index":1256,"title":{},"contents":{"type-fonts.html":{"position":[[1037,5],[2305,4],[4107,5]]},"type-helpers.html":{"position":[[15,5],[51,5]]}}}],["url(\"../fonts/sans/mi",{"_index":1327,"title":{},"contents":{"type-helpers.html":{"position":[[488,21]]}}}],["url('my/path",{"_index":1324,"title":{},"contents":{"type-helpers.html":{"position":[[342,14]]}}}],["url('sans/mi",{"_index":1325,"title":{},"contents":{"type-helpers.html":{"position":[[426,12]]}}}],["us",{"_index":12,"title":{},"contents":{"animate-change-vars.html":{"position":[[164,6],[704,4],[834,5],[1186,3],[1812,3],[2271,3],[3239,3]]},"animate-change.html":{"position":[[488,3],[753,5],[1238,4],[1715,3],[1820,4]]},"animate-ease-vars.html":{"position":[[161,6],[737,4],[861,5],[1218,3],[1925,3],[2380,3],[3372,3]]},"animate-ease.html":{"position":[[95,4],[251,4],[1812,4],[1936,5],[2811,4],[3285,3]]},"animate-time-vars.html":{"position":[[156,6],[676,4],[796,5],[1140,3],[1704,3],[2157,3],[3088,3]]},"animate-times.html":{"position":[[836,4],[1284,3]]},"animate.html":{"position":[[294,4],[875,3],[1306,3]]},"CHANGELOG.html":{"position":[[479,5],[2217,4],[2576,5],[2930,3],[3086,4],[3199,5],[3264,5],[3413,5],[3506,5],[3681,4],[3774,3],[4322,4],[5567,6],[6628,5],[6768,6],[8310,4],[9033,4],[12811,3],[13028,4],[13134,4],[13544,5],[13768,5]]},"color-config.html":{"position":[[202,6],[404,3],[431,4],[573,3],[600,4]]},"color-contrast.html":{"position":[[1488,4],[4601,4],[6173,5],[7275,4],[7624,4]]},"color-themes.html":{"position":[[363,3],[1485,6],[2191,4],[2337,6]]},"color-tokens.html":{"position":[[878,3],[1038,4],[1477,4],[1834,6],[3648,4]]},"color-utils.html":{"position":[[164,5],[236,3],[319,3],[995,5],[1067,3],[1139,3]]},"color-vars.html":{"position":[[160,6],[692,4],[842,5],[1190,3],[1804,3],[2260,3],[3216,3],[3678,4]]},"color.html":{"position":[[385,4],[451,5],[761,5],[1057,5],[1102,5],[1811,4]]},"CONTRIBUTING.html":{"position":[[583,5],[739,5],[1081,3]]},"index.html":{"position":[[698,3],[770,4],[801,4],[898,4],[950,5],[974,3],[1015,5],[1027,4],[1687,5],[2423,3],[2561,3]]},"layout-queries.html":{"position":[[106,5],[140,3],[359,4],[527,5],[1294,3],[1665,4],[1996,5],[2302,3],[3087,5],[3393,3],[4198,5],[4504,3],[4627,3],[5354,5]]},"layout-z-index.html":{"position":[[439,4],[852,4]]},"layout.html":{"position":[[285,4],[385,3]]},"LICENSE.html":{"position":[[277,4],[1024,3]]},"ratio-tokens.html":{"position":[[64,5],[350,4],[860,3],[1161,4],[1283,6],[1940,3],[2507,4]]},"ratio-vars.html":{"position":[[466,4],[591,5],[939,3],[1534,3],[1990,3],[2936,3]]},"ratios.html":{"position":[[51,4],[243,4],[848,4]]},"scale-sizes.html":{"position":[[149,4],[308,4],[472,5],[753,5],[847,5],[1040,4],[1288,4],[1595,6],[2107,5],[2909,3],[3054,4],[4284,3],[5583,3]]},"scale-units.html":{"position":[[182,6]]},"scale-vars.html":{"position":[[156,6],[678,4],[798,5],[1142,3],[1726,3],[2179,3],[3106,3]]},"scale.html":{"position":[[340,4],[651,5],[976,5],[1287,6],[1392,3],[1691,3]]},"token-api.html":{"position":[[14,3],[651,3],[1032,5],[1570,4],[2929,3],[3527,3],[3699,5],[3758,5],[4091,3],[4395,5],[4644,3],[6152,4]]},"token-config.html":{"position":[[589,4]]},"token-inspect.html":{"position":[[73,6],[630,4],[1874,4],[2259,6],[2362,5],[3044,4]]},"token-internal.html":{"position":[[2091,3],[2651,3],[3246,3]]},"token-register.html":{"position":[[356,3],[558,3],[765,4],[1025,3]]},"token-vars.html":{"position":[[64,6],[356,3],[815,4],[1283,4],[2454,3],[2852,4],[3349,4]]},"tokens.html":{"position":[[64,5],[750,3],[2054,5],[2148,5],[2338,5],[2521,5],[2795,3],[2828,5],[3669,3],[3968,5]]},"type-a11y.html":{"position":[[154,5],[266,4]]},"type-font-vars.html":{"position":[[156,6],[747,4],[867,5],[1211,3],[1261,5],[1337,3],[1890,3],[2296,5],[2372,3],[2449,3],[3476,3],[3490,5],[3566,3]]},"type-fonts.html":{"position":[[39,6],[1014,4],[1581,5],[2111,3],[2852,3],[3423,3],[3975,3],[5615,4],[5762,3],[5847,6],[6519,5],[6894,4],[7280,3],[7396,4],[7878,3],[8257,4],[8588,3],[9322,3],[9803,4],[10031,4],[10373,3]]},"type-helpers.html":{"position":[[560,4]]},"type-pseudo.html":{"position":[[451,4],[506,4]]},"type.html":{"position":[[360,4],[908,6],[1197,5]]},"utils.html":{"position":[[18,3],[1098,4],[1798,4],[2811,3],[3129,4],[3845,3],[4193,5],[5260,4],[6105,4]]},"vars.html":{"position":[[42,6],[468,4],[765,4],[1119,4],[1367,4],[1418,3],[1515,4],[1542,4],[1560,4]]}}}],["usag",{"_index":509,"title":{},"contents":{"CHANGELOG.html":{"position":[[4713,5]]}}}],["user",{"_index":546,"title":{},"contents":{"CHANGELOG.html":{"position":[[5760,4]]},"color-themes.html":{"position":[[110,4],[345,4],[509,5]]},"color-tokens.html":{"position":[[2841,4]]},"ratio-tokens.html":{"position":[[463,4]]}}}],["util",{"_index":377,"title":{},"contents":{"CHANGELOG.html":{"position":[[573,11],[794,10],[11320,7],[11431,7],[13255,9]]},"color-utils.html":{"position":[[6,7]]},"index.html":{"position":[[121,9],[1486,9]]},"layout-queries.html":{"position":[[5253,5]]},"token-api.html":{"position":[[341,9]]},"token-internal.html":{"position":[[231,9]]},"tokens.html":{"position":[[3523,7]]},"type-a11y.html":{"position":[[30,9]]},"utils.html":{"position":[[5,9],[39,9],[208,7],[1221,7],[1938,7]]}}}],["valid",{"_index":525,"title":{},"contents":{"CHANGELOG.html":{"position":[[5202,5]]},"color-contrast.html":{"position":[[7192,5]]},"layout-queries.html":{"position":[[311,5],[1545,5]]},"ratio-tokens.html":{"position":[[1660,6],[2186,5]]}}}],["valu",{"_index":59,"title":{},"contents":{"animate-change-vars.html":{"position":[[1052,6],[1843,7],[1881,5],[1983,5],[2060,5],[2100,5],[2162,5],[2765,5],[2947,5],[3024,5],[3064,5],[3126,5]]},"animate-change.html":{"position":[[81,6],[478,6],[1135,6],[1159,7],[1638,5],[1769,5]]},"animate-ease-vars.html":{"position":[[1002,6],[1085,6],[1956,7],[1994,5],[2094,5],[2171,5],[2211,5],[2273,5],[2894,5],[3074,5],[3151,5],[3191,5],[3253,5]]},"animate-ease.html":{"position":[[302,6],[360,10],[2105,6],[2485,6],[2729,6],[3209,5]]},"animate-time-vars.html":{"position":[[1008,6],[1735,7],[1773,5],[1873,5],[1950,5],[1990,5],[2052,5],[2620,5],[2798,5],[2875,5],[2915,5],[2977,5]]},"animate-times.html":{"position":[[369,6],[426,7],[448,6],[527,6],[664,6],[1211,5]]},"CHANGELOG.html":{"position":[[1735,5],[2328,6],[2723,5],[4265,5],[4888,6],[5134,6],[5188,6],[6615,8],[6646,9],[6887,5],[10535,6],[12085,6]]},"color-contrast.html":{"position":[[122,7],[270,5],[578,6],[1732,6],[1923,5],[2253,6],[3412,6],[3540,5],[3848,6],[4815,6],[4930,5],[5260,6],[6444,6],[6559,6],[7444,5],[7519,6]]},"color-themes.html":{"position":[[705,6],[1641,5]]},"color-tokens.html":{"position":[[262,6],[326,7],[353,6],[433,6],[581,6],[3178,5]]},"color-utils.html":{"position":[[189,5],[748,5],[1021,5],[1564,5]]},"color-vars.html":{"position":[[1057,6],[1835,7],[1873,5],[1974,5],[2051,5],[2091,5],[2153,5],[2745,5],[2925,5],[3002,5],[3042,5],[3104,5]]},"color.html":{"position":[[1827,7]]},"index.html":{"position":[[2369,6]]},"layout-queries.html":{"position":[[328,7],[1105,5],[1209,5],[1494,5],[1908,5],[1968,6],[2998,6],[3059,6],[4110,5],[4170,6],[5519,5],[5581,6],[5626,6]]},"layout-z-index.html":{"position":[[252,6],[642,6],[766,5],[926,5],[1123,5]]},"layout.html":{"position":[[73,6]]},"ratio-tokens.html":{"position":[[686,5],[785,5],[954,5],[1854,5],[2115,5],[2171,5]]},"ratio-vars.html":{"position":[[806,6],[1565,7],[1603,5],[1704,5],[1781,5],[1821,5],[1883,5],[2465,5],[2645,5],[2722,5],[2762,5],[2824,5]]},"ratios.html":{"position":[[113,6],[276,6],[334,10]]},"scale-sizes.html":{"position":[[235,8],[281,5],[379,6],[587,6],[2276,6],[2774,6],[3183,5],[3366,6],[4149,6],[4517,6],[4665,6],[5448,6]]},"scale-units.html":{"position":[[935,5],[1063,5]]},"scale-vars.html":{"position":[[1010,6],[1757,7],[1795,5],[1895,5],[1972,5],[2012,5],[2074,5],[2638,5],[2816,5],[2893,5],[2933,5],[2995,5]]},"scale.html":{"position":[[519,6],[1154,6],[1431,7],[1469,5],[1540,5],[1784,6]]},"token-api.html":{"position":[[54,6],[601,7],[1501,5],[1586,8],[1762,9],[1988,9],[2187,5],[2338,5],[2684,6],[2905,6],[3024,6],[3105,9],[3242,6],[3282,6],[3391,9],[3952,7],[4236,5],[4291,5],[4748,5],[4777,5],[4863,7],[4881,7],[4900,6],[4948,6],[4978,8],[5011,6],[5549,6],[5864,5],[5949,7],[5984,6],[6029,6],[6091,6]]},"token-inspect.html":{"position":[[1971,8]]},"token-internal.html":{"position":[[599,6],[1185,5],[1786,6],[2360,6],[2909,6]]},"token-vars.html":{"position":[[422,7],[464,5],[532,5],[609,5],[649,5],[711,5],[1586,6],[2326,5],[2562,5],[2646,5],[2686,5],[2748,5]]},"tokens.html":{"position":[[383,6],[657,6],[724,6],[1563,5],[2213,7]]},"type-font-vars.html":{"position":[[1079,6],[1300,5],[1360,6],[1638,8],[1921,7],[1959,5],[2059,5],[2136,5],[2176,5],[2238,5],[2335,5],[2395,6],[2858,8],[3001,5],[3179,5],[3256,5],[3296,5],[3358,5],[3529,5],[3589,6],[3967,8]]},"type-fonts.html":{"position":[[2349,5],[3438,5],[3697,6],[4000,7],[7462,8]]},"type-pseudo.html":{"position":[[172,5],[292,5],[438,6]]},"utils.html":{"position":[[2375,7],[2851,7],[3269,6],[3598,11],[3756,6],[3885,7],[5884,5]]},"vars.html":{"position":[[63,6],[943,6],[997,10],[1272,6],[1347,7],[1776,6]]}}}],["value/adjust",{"_index":573,"title":{},"contents":{"CHANGELOG.html":{"position":[[6582,17],[12894,16]]}}}],["var",{"_index":4,"title":{},"contents":{"animate-change-vars.html":{"position":[[32,3],[65,3],[587,3],[759,3],[859,3],[1046,5],[1529,4],[1577,3],[1995,5],[2552,4],[2599,4],[2645,3],[2675,3],[2959,5],[3304,4],[3584,4],[3623,4],[3671,3],[3691,3]]},"animate-ease-vars.html":{"position":[[31,3],[64,3],[592,3],[789,3],[886,3],[1079,5],[1607,4],[1694,3],[2106,5],[2715,4],[2776,3],[2806,3],[3086,5],[3437,4],[3687,3],[3751,4],[3809,3],[3849,3],[3883,3]]},"animate-ease.html":{"position":[[1881,3]]},"animate-time-vars.html":{"position":[[28,3],[59,3],[567,3],[727,3],[819,3],[1002,5],[1435,4],[1477,3],[1885,5],[2415,4],[2461,4],[2502,3],[2532,3],[2810,5],[3153,4],[3416,4],[3447,4],[3493,3],[3511,3]]},"CHANGELOG.html":{"position":[[5048,3],[5068,3],[5657,3],[5676,3],[7269,3],[8067,3],[8144,3],[8227,3],[8585,3],[8846,3],[8922,3],[9327,3]]},"color-contrast.html":{"position":[[10,3],[735,6],[1315,4],[1468,3],[1503,3],[1527,3],[1683,3],[2776,4],[3042,4],[3080,4],[3127,3],[3149,3]]},"color-vars.html":{"position":[[30,3],[62,3],[578,3],[710,3],[770,3],[866,3],[1051,5],[1527,4],[1573,3],[1986,5],[2537,4],[2582,4],[2626,3],[2656,3],[2937,5],[3281,4],[3555,4],[3592,4],[3639,3],[3658,3],[3693,3]]},"ratio-vars.html":{"position":[[36,3],[68,3],[361,3],[519,3],[615,3],[800,5],[1301,3],[1716,5],[2281,4],[2346,3],[2376,3],[2657,5],[3001,4],[3284,4],[3341,4],[3399,3],[3432,3]]},"ratios.html":{"position":[[919,3]]},"scale-vars.html":{"position":[[28,3],[59,3],[568,3],[729,3],[821,3],[1004,5],[1456,4],[1499,3],[1907,5],[2435,4],[2477,4],[2520,3],[2550,3],[2828,5],[3171,4],[3428,4],[3461,4],[3509,3],[3527,3]]},"token-inspect.html":{"position":[[648,3]]},"token-vars.html":{"position":[[544,5],[1128,4],[1161,4],[1245,3],[1580,5],[2142,4],[2237,3],[2574,5],[2935,4],[3243,4],[3274,4],[3367,3],[3390,3],[3411,3],[3432,3],[3454,3],[3476,3],[3514,3]]},"tokens.html":{"position":[[3432,4],[3468,4],[3499,4]]},"type-font-vars.html":{"position":[[28,3],[59,3],[605,3],[798,3],[890,3],[1073,5],[1663,3],[2071,5],[2802,4],[2883,3],[2913,3],[3191,5],[3647,4],[3911,4],[3996,3],[4014,3]]},"vars.html":{"position":[[1137,3],[1179,3]]}}}],["vararg",{"_index":1081,"title":{},"contents":{"scale-sizes.html":{"position":[[2179,6],[3269,6],[4568,6]]}}}],["variabl",{"_index":3,"title":{"animate-change-vars.html":{"position":[[14,9]]},"animate-ease-vars.html":{"position":[[13,9]]},"animate-time-vars.html":{"position":[[12,9]]},"color-vars.html":{"position":[[19,9]]},"ratio-vars.html":{"position":[[19,9]]},"scale-vars.html":{"position":[[12,9]]},"type-font-vars.html":{"position":[[12,9]]}},"contents":{"animate-change-vars.html":{"position":[[14,9],[107,9],[191,8],[303,8],[404,9],[823,10],[958,9],[1228,9],[1834,8],[1895,9],[2118,8],[2703,8],[3082,8],[3274,8]]},"animate-change.html":{"position":[[262,8],[1940,9],[2243,9]]},"animate-ease-vars.html":{"position":[[13,9],[104,9],[188,8],[300,8],[401,9],[850,10],[985,9],[1266,9],[1947,8],[2008,9],[2229,8],[2832,8],[3209,8],[3407,8]]},"animate-ease.html":{"position":[[110,9],[228,9],[2285,8],[3514,9],[3799,9]]},"animate-time-vars.html":{"position":[[12,9],[99,9],[183,8],[295,8],[394,9],[785,10],[916,9],[1180,9],[1726,8],[1787,9],[2008,8],[2558,8],[2933,8],[3123,8]]},"animate-times.html":{"position":[[171,8],[1461,9],[1744,9]]},"CHANGELOG.html":{"position":[[653,11],[682,9],[900,10],[2121,10],[5705,8],[6126,11],[7231,9],[7437,11],[7585,8],[7982,8],[8026,9],[8104,9],[8183,9],[8543,9],[8806,9],[8880,9],[9287,9],[10504,8],[11977,8]]},"color-contrast.html":{"position":[[87,9],[190,10],[746,8],[842,8],[891,8],[1114,8],[1580,9],[1838,10]]},"color-tokens.html":{"position":[[60,8],[1665,9],[2081,9]]},"color-vars.html":{"position":[[13,9],[103,9],[187,8],[299,8],[399,9],[831,10],[964,9],[1231,9],[1826,8],[1887,9],[2109,8],[2683,8],[3060,8],[3251,8]]},"color.html":{"position":[[1048,8],[1648,9]]},"index.html":{"position":[[1408,9],[1449,9],[2670,9],[2712,9]]},"layout-queries.html":{"position":[[5551,8]]},"layout-z-index.html":{"position":[[546,9],[611,9]]},"ratio-tokens.html":{"position":[[1261,9],[1530,9]]},"ratio-vars.html":{"position":[[19,9],[181,9],[580,10],[713,9],[980,9],[1556,8],[1617,9],[1839,8],[2403,8],[2780,8],[2971,8]]},"ratios.html":{"position":[[197,9]]},"scale-sizes.html":{"position":[[1428,9],[1841,9]]},"scale-vars.html":{"position":[[12,9],[99,9],[183,8],[295,8],[394,9],[787,10],[918,9],[1182,9],[1748,8],[1809,9],[2030,8],[2576,8],[2951,8],[3141,8]]},"token-vars.html":{"position":[[667,8],[837,9],[1395,11],[1493,9],[1738,9],[1811,9],[2264,8],[2704,8],[2874,9],[2905,8]]},"tokens.html":{"position":[[413,9],[860,9],[909,9],[2700,9],[2714,9],[2782,9],[2972,9],[3004,9],[3178,9],[3260,9]]},"type-font-vars.html":{"position":[[12,9],[99,9],[183,8],[295,8],[394,9],[856,10],[987,9],[1251,9],[1912,8],[1973,9],[2194,8],[2939,8],[3314,8],[3617,8]]},"type-fonts.html":{"position":[[1978,9],[5733,9],[6198,9]]},"vars.html":{"position":[[26,9],[133,9],[198,9],[286,9],[408,8],[775,8],[1253,8],[1438,9],[1486,9]]}}}],["variables('_mi",{"_index":1373,"title":{},"contents":{"vars.html":{"position":[[1603,14]]}}}],["variables('nam",{"_index":212,"title":{},"contents":{"animate-ease.html":{"position":[[324,18]]},"ratios.html":{"position":[[298,18]]}}}],["variant",{"_index":685,"title":{},"contents":{"CHANGELOG.html":{"position":[[14207,8]]},"type-fonts.html":{"position":[[2102,8],[2200,8],[2220,7],[3300,7],[3330,8],[3654,8],[3902,7],[8931,9],[9420,9],[9756,10],[9971,8]]},"utils.html":{"position":[[5287,10],[5351,7]]}}}],["variat",{"_index":722,"title":{},"contents":{"color-themes.html":{"position":[[85,10],[448,10]]}}}],["variou",{"_index":559,"title":{},"contents":{"CHANGELOG.html":{"position":[[6246,7]]},"tokens.html":{"position":[[102,7]]},"type-fonts.html":{"position":[[222,7],[425,7],[6632,7]]}}}],["version",{"_index":364,"title":{},"contents":{"CHANGELOG.html":{"position":[[300,8]]},"scale-sizes.html":{"position":[[693,8]]}}}],["vh",{"_index":1088,"title":{},"contents":{"scale-units.html":{"position":[[497,3]]}}}],["via",{"_index":832,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[235,3],[1215,3]]}}}],["view",{"_index":541,"title":{},"contents":{"CHANGELOG.html":{"position":[[5578,7]]},"color-themes.html":{"position":[[1496,7],[2348,7]]},"index.html":{"position":[[0,4],[13,4]]}}}],["viewport",{"_index":932,"title":{},"contents":{"layout-queries.html":{"position":[[1809,8],[2905,8],[4010,8]]},"scale.html":{"position":[[891,9]]}}}],["violet",{"_index":753,"title":{},"contents":{"color-themes.html":{"position":[[1822,7],[2119,6],[2610,6],[2912,6]]}}}],["visibl",{"_index":1230,"title":{},"contents":{"type-a11y.html":{"position":[[58,10]]}}}],["vmax",{"_index":1090,"title":{},"contents":{"scale-units.html":{"position":[[507,5]]}}}],["vmin",{"_index":1089,"title":{},"contents":{"scale-units.html":{"position":[[501,5]]}}}],["vw",{"_index":1087,"title":{},"contents":{"scale-units.html":{"position":[[493,3]]}}}],["want",{"_index":21,"title":{},"contents":{"animate-change-vars.html":{"position":[[264,6]]},"animate-change.html":{"position":[[1962,4]]},"animate-ease-vars.html":{"position":[[261,6]]},"animate-ease.html":{"position":[[57,4],[3536,4]]},"animate-time-vars.html":{"position":[[256,6]]},"animate-times.html":{"position":[[1483,4]]},"color-tokens.html":{"position":[[1687,4]]},"color-vars.html":{"position":[[260,6]]},"scale-sizes.html":{"position":[[1450,4]]},"scale-vars.html":{"position":[[256,6]]},"token-api.html":{"position":[[1481,4]]},"tokens.html":{"position":[[1965,4]]},"type-font-vars.html":{"position":[[256,6]]},"type-fonts.html":{"position":[[4659,5]]},"utils.html":{"position":[[1391,4]]}}}],["warn",{"_index":466,"title":{},"contents":{"CHANGELOG.html":{"position":[[3556,5],[4158,5],[4211,7]]},"token-config.html":{"position":[[124,8],[261,5],[285,7]]}}}],["warranti",{"_index":1004,"title":{},"contents":{"LICENSE.html":{"position":[[644,8],[719,10]]}}}],["way",{"_index":912,"title":{},"contents":{"index.html":{"position":[[2633,3]]},"tokens.html":{"position":[[823,3],[886,4]]},"type-fonts.html":{"position":[[6640,5]]},"vars.html":{"position":[[49,3]]}}}],["wcag",{"_index":527,"title":{},"contents":{"CHANGELOG.html":{"position":[[5233,4]]},"color-contrast.html":{"position":[[6183,4],[6743,4],[6861,4],[7115,4],[7349,4],[7488,4],[7534,4]]},"color.html":{"position":[[176,4],[1507,4],[1551,4]]}}}],["web",{"_index":451,"title":{},"contents":{"CHANGELOG.html":{"position":[[3134,3]]},"type-fonts.html":{"position":[[3126,3]]}}}],["webfont",{"_index":611,"title":{},"contents":{"CHANGELOG.html":{"position":[[9122,10],[9229,10],[12379,10]]},"index.html":{"position":[[1270,9]]},"token-inspect.html":{"position":[[720,10],[1913,10]]},"type-fonts.html":{"position":[[0,8],[9,7],[2774,8],[6525,8],[6562,7],[8886,7],[9566,9],[9613,9],[9656,9],[9825,10],[9850,10],[10594,9],[10641,9],[10684,9],[10864,9]]},"type.html":{"position":[[37,7],[124,7],[401,7],[695,9],[735,9],[943,8],[1013,8],[1034,11],[1156,9]]}}}],["weight",{"_index":370,"title":{},"contents":{"CHANGELOG.html":{"position":[[409,6],[14235,6]]}}}],["weight/styl",{"_index":1262,"title":{},"contents":{"type-fonts.html":{"position":[[1778,12]]}}}],["welcom",{"_index":824,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[66,8],[181,7]]}}}],["well",{"_index":386,"title":{},"contents":{"CHANGELOG.html":{"position":[[857,4],[5144,4]]},"color-config.html":{"position":[[105,4]]},"color-tokens.html":{"position":[[2733,5]]},"color.html":{"position":[[1890,4]]}}}],["we’ll",{"_index":27,"title":{},"contents":{"animate-change-vars.html":{"position":[[361,5]]},"animate-ease-vars.html":{"position":[[358,5]]},"animate-ease.html":{"position":[[2060,5]]},"animate-time-vars.html":{"position":[[351,5]]},"color-vars.html":{"position":[[356,5]]},"color.html":{"position":[[1521,5]]},"ratio-vars.html":{"position":[[138,5]]},"scale-vars.html":{"position":[[351,5]]},"token-api.html":{"position":[[1475,5]]},"type-font-vars.html":{"position":[[351,5]]},"type-fonts.html":{"position":[[3561,5]]}}}],["we’r",{"_index":1138,"title":{},"contents":{"token-api.html":{"position":[[2643,5]]}}}],["we’v",{"_index":557,"title":{},"contents":{"CHANGELOG.html":{"position":[[6200,5]]}}}],["whenev",{"_index":1084,"title":{},"contents":{"scale-sizes.html":{"position":[[4036,8],[5335,8]]}}}],["whether",{"_index":286,"title":{},"contents":{"animate-ease.html":{"position":[[1920,7]]},"LICENSE.html":{"position":[[908,7]]}}}],["whichev",{"_index":702,"title":{},"contents":{"color-contrast.html":{"position":[[2488,9],[4004,9]]}}}],["white",{"_index":651,"title":{},"contents":{"CHANGELOG.html":{"position":[[11365,5]]},"color-config.html":{"position":[[161,5],[290,5],[352,5]]},"color-contrast.html":{"position":[[1047,5],[1085,6],[1270,6],[2727,5],[2814,6],[2986,6],[4301,5],[4339,6],[4503,6],[5772,5],[5834,6],[6002,6],[6930,6],[7068,6]]},"color-tokens.html":{"position":[[985,5]]},"color-utils.html":{"position":[[86,6],[284,6]]},"color.html":{"position":[[1658,6],[2068,6],[2122,6]]}}}],["whitespac",{"_index":661,"title":{},"contents":{"CHANGELOG.html":{"position":[[12518,10]]},"utils.html":{"position":[[5466,10],[5715,10]]}}}],["widescreen",{"_index":1069,"title":{},"contents":{"ratios.html":{"position":[[768,12]]}}}],["widget",{"_index":767,"title":{},"contents":{"color-tokens.html":{"position":[[557,6]]}}}],["width",{"_index":933,"title":{},"contents":{"layout-queries.html":{"position":[[1818,6],[2327,7],[2335,8],[2369,6],[2430,6],[2540,6],[2709,6],[2914,6],[3418,7],[3426,8],[3460,6],[3521,6],[3633,6],[3807,6],[4019,7],[4665,7],[4673,8],[4707,6],[4768,6],[4889,6],[4911,6],[5115,6],[5137,6]]},"layout.html":{"position":[[737,5]]},"scale-sizes.html":{"position":[[4473,5],[5656,5]]},"scale.html":{"position":[[1068,6]]}}}],["width/height",{"_index":944,"title":{},"contents":{"layout-queries.html":{"position":[[2846,14],[3953,14]]}}}],["within",{"_index":1349,"title":{},"contents":{"utils.html":{"position":[[2414,6]]}}}],["without",{"_index":414,"title":{},"contents":{"CHANGELOG.html":{"position":[[2132,8],[5849,7]]},"color-contrast.html":{"position":[[3428,7]]},"color-tokens.html":{"position":[[849,7]]},"color.html":{"position":[[1763,7]]},"LICENSE.html":{"position":[[213,7],[244,7],[636,7]]},"ratios.html":{"position":[[207,8]]},"scale.html":{"position":[[1373,7]]},"token-api.html":{"position":[[3547,7],[3691,7],[5579,7],[5689,7]]},"type-fonts.html":{"position":[[8941,7],[10722,7]]},"type-helpers.html":{"position":[[183,7]]}}}],["woff",{"_index":1293,"title":{},"contents":{"type-fonts.html":{"position":[[4390,7],[9514,6],[10542,6]]},"type.html":{"position":[[646,6]]}}}],["woff2",{"_index":1273,"title":{},"contents":{"type-fonts.html":{"position":[[2834,7],[4380,9],[5007,8],[5032,5],[5124,8],[5155,5],[5424,8],[5543,8],[9506,7],[10534,7]]}}}],["woff2;charset=utf",{"_index":1311,"title":{},"contents":{"type-fonts.html":{"position":[[5456,17],[5575,17]]}}}],["word",{"_index":1278,"title":{},"contents":{"type-fonts.html":{"position":[[3325,4]]}}}],["work",{"_index":636,"title":{},"contents":{"CHANGELOG.html":{"position":[[10685,5],[12231,5]]},"color-config.html":{"position":[[263,4]]},"color-contrast.html":{"position":[[1661,5],[4748,5]]},"color.html":{"position":[[1129,4]]},"CONTRIBUTING.html":{"position":[[534,5]]},"scale-sizes.html":{"position":[[2422,5],[3512,5],[4811,5]]}}}],["world",{"_index":1359,"title":{},"contents":{"utils.html":{"position":[[5131,6],[5214,5],[5947,5],[6031,5]]}}}],["wrap",{"_index":1329,"title":{},"contents":{"type-pseudo.html":{"position":[[331,4]]}}}],["wrapper",{"_index":789,"title":{},"contents":{"color-tokens.html":{"position":[[2502,7]]},"type-helpers.html":{"position":[[31,7]]}}}],["write",{"_index":859,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[1233,5]]},"token-api.html":{"position":[[5177,5]]},"type-fonts.html":{"position":[[799,7]]}}}],["written",{"_index":663,"title":{},"contents":{"CHANGELOG.html":{"position":[[12654,7]]},"token-api.html":{"position":[[2347,7]]},"type-fonts.html":{"position":[[3346,7]]}}}],["wrong",{"_index":472,"title":{},"contents":{"CHANGELOG.html":{"position":[[3821,5]]}}}],["x",{"_index":791,"title":{},"contents":{"color-tokens.html":{"position":[[2531,4]]}}}],["yaml",{"_index":1210,"title":{},"contents":{"tokens.html":{"position":[[571,5]]}}}],["yarn",{"_index":843,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[522,4],[660,4],[795,4],[888,4],[941,4],[951,4],[961,4]]},"index.html":{"position":[[625,4],[668,4]]}}}],["yellow",{"_index":750,"title":{},"contents":{"color-themes.html":{"position":[[1793,7],[1970,6],[2581,7],[2763,6]]},"layout-queries.html":{"position":[[4852,7],[4948,7],[5078,7],[5174,7]]}}}],["you’r",{"_index":884,"title":{},"contents":{"index.html":{"position":[[943,6]]},"tokens.html":{"position":[[2047,6]]}}}],["you’v",{"_index":839,"title":{},"contents":{"CONTRIBUTING.html":{"position":[[401,6],[976,6]]},"type-fonts.html":{"position":[[6539,6]]}}}],["z",{"_index":953,"title":{"layout-z-index.html":{"position":[[0,1]]}},"contents":{"layout-z-index.html":{"position":[[0,2],[21,2],[60,1],[153,1],[322,2],[457,1],[477,1],[537,2],[700,1],[758,1],[836,2],[867,1],[884,1],[905,1],[957,2],[1032,1],[1099,1],[1177,1]]},"layout.html":{"position":[[65,1]]}}}],["zero",{"_index":1343,"title":{},"contents":{"utils.html":{"position":[[743,4]]}}}]],"pipeline":["stemmer"]},"store":{"animate-change-vars.html":{"filename":"animate-change-vars.html","title":"Changes » CSS Variables","contents":"Changes » CSS Variables $change-var-prefix (string) scss $change-var-prefix: 'change-' !default; Since CSS variables are often defined in a global space, it can be useful to prefix different variable types. Accoutrement maps help solve that problem in Sass, so we wanted to carry that over into our CSS variable support. Set a prefix for all change-tokens, and we’ll apply it when setting or calling css variables based on your change maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$changes: ('my-change': pink); tools.$change-var-prefix: 'prefix_'; html { @include tools.change--('my-change') } css compiled html { --prefix_my-change: pink; } Used By @mixin changes--() @mixin change--() @function var-change() @mixin changes--() Convert any change-map into CSS variables, using the global $change-var-prefix. Change names that start with _ or - are considered “private” and will not be output as variables Changes that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $changes (map) Optionally use a custom map of changes to set as css variables {CSS output} (code block) Custom properties for all public changes in the map Example scss tools.$changes: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); html { @include tools.changes--; } css compiled html { --change-text: #206020; --change-border: var(--change-text, #206020); } Requires $change-var-prefix (string) @mixin change--() Set a single custom property based on a map-change, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $change: (*) Change name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $change $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $changes (map) Optional map of changes to use as a palette source Example scss tools.$changes: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); .example { @include tools.change--('border'); @include tools.change--('outline', 'border', red); } css compiled .example { --change-border: var(--change-text, #206020); --change-outline: var(--change-border, red); } Requires $change-var-prefix (string) @function var-change() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $change: (*) Change name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: (map) Optional Accoutrement map of changes to use as source @return (string) CSS variable call, in the format: var(--, ) Example scss tools.$changes: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); .example { border-change: tools.var-change('border'); change: tools.var-change('text', black); } css compiled .example { border-change: var(--change-border, #206020); change: var(--change-text, black); } Requires @function var-token() $change-var-prefix (string)"},"animate-change.html":{"filename":"animate-change.html","title":"Combined \"Change\" Maps","contents":"Combined “Change” Maps: Animations & Transitions Combine your $times and $easing values to create entire transitions and animations – all stored in one place and easy to access for consistent “changes” across your project. $changes scss $changes: () !default; A variable storing the map of all your standardized changes (transitions and animations). Any changes added to the $changes map will be accesible to the change() function by default. Define each change with a name and value, or use interpolation to compose more complex changes. $changes: ( // single animation 'glow': glow time('slow') ease('in-out-quad') infinite alternate, // single transitions 'slide': transform time('fast'), 'fade': opacity time('fade') ease('out-quad'), // interolate using '#name' (quotes optional) // to build on existing \"changes\" 'slide-in': #slide ease('out-back'), 'slide-out': '#slide' ease('in'), // or string together multiple \"changes\" 'sidebar-in': ('#slide-in', '#fade' time('delay')), // or create a 1-to-1 alias 'modal-in': #sidebar-in, ); Name your changes anything – from abstractions like fade, to concrete patterns like sidebar-in. Values can be CSS-ready values, references other changes in the map, or format strings to interpolate. Used By @mixin add-changes() @function change() Access a named change in your $changes map. Since 1.0.0: NEW: Accepts $do map argument, for on-the-fly adjustments NEW: Accepts $source map argument, for custom source-palette Parameters & Return $name: (string) The name of a change in your configuration (e.g. fade-in) $do: null (map | null) A map of function/ratio adjustments to run on the returned value $source: $changes (map) Optional accoutrement-format map of changes to use as the origin palette @return (length) The change value requested Requires @function get() [private] Used By @mixin animate() @mixin transition() @mixin add-changes() Merge individual change maps into the global $changes variable, in case you want to define changes in smaller groups – such as button-changes, page-changes, etc – before merging them into a single global changes-palette. Parameters & Output $maps: (map...) Pass any number of maps to be merged and added {CSS output} (code block) An updated global $changes variable, with new maps merged in. Requires @function multi-merge() $changes @mixin animate() Access named animations in your $changes map, and apply them to the animation property. Parameters & Output $names: (string) Named animations to apply {CSS output} (code block) The requested animations, applied in CSS Example scss tools.$changes: ( 'fade-in': fade-in 300ms ease-out both, ); .example { @include tools.animate('fade-in'); } css compiled .example { animation: fade-in 300ms ease-out both; } Requires @function change() @mixin transition() Access named transitions in your $changes map, and apply them to the transition property. Parameters & Output $names: (string) Named transitions to apply {CSS output} (code block) The requested transitions, applied in CSS Example scss tools.$changes: ( 'fade': opacity 300ms ease-out, ); .example { @include tools.transition('fade'); } css compiled .example { transition: opacity 300ms ease-out; } Requires @function change()"},"animate-ease-vars.html":{"filename":"animate-ease-vars.html","title":"Easing » CSS Variables","contents":"Easing » CSS Variables $easing-var-prefix (string) scss $easing-var-prefix: 'ease-' !default; Since CSS variables are often defined in a global space, it can be useful to prefix different variable types. Accoutrement maps help solve that problem in Sass, so we wanted to carry that over into our CSS variable support. Set a prefix for all easing-tokens, and we’ll apply it when setting or calling css variables based on your easing maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$easing: ('my-ease': '#_in-out-back'); tools.$easing-var-prefix: 'prefix_'; html { @include tools.ease--('my-ease') } css compiled html { --prefix_my-ease: cubic-bezier(0.68, -0.55, 0.265, 1.55); } Used By @mixin easing--() @mixin ease--() @function var-ease() @mixin easing--() Convert any easing-map into CSS variables, using the global $easing-var-prefix. Easing names that start with _ or - are considered “private” and will not be output as variables Easing values that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $easing (map) Optionally use a custom map of easing tokens to set as css variables {CSS output} (code block) Custom properties for all public easing in the map Example scss tools.$easing: ( '_elastic': cubic-bezier(0.5, -0.4, 0.5, 1.4), 'modal': '#_elastic', 'error-message': '#modal', ); html { @include tools.easing--; } css compiled html { --ease-modal: cubic-bezier(0.5, -0.4, 0.5, 1.4); --ease-error-message: var(--ease-modal, cubic-bezier(0.5, -0.4, 0.5, 1.4)); } Requires $named-easing $easing-var-prefix (string) @mixin ease--() Set a single custom property based on a map-easing, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $ease: (*) Easing name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $ease $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $easing (map) Optional map of easing to use as a palette source Example scss tools.$easing: ( '_elastic': cubic-bezier(0.5, -0.4, 0.5, 1.4), 'modal': '#_elastic', 'error-message': '#modal', ); .example { @include tools.ease--('modal'); @include tools.ease--('toast', 'modal', ease-in); } css compiled .example { --ease-modal: cubic-bezier(0.5, -0.4, 0.5, 1.4); --ease-toast: var(--ease-modal, ease-in); } Requires $named-easing $easing-var-prefix (string) @function var-ease() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $ease: (*) Easing name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: (map) Optional Accoutrement map of easing tokens to use as source @return (string) CSS variable call, in the format: var(--, ) Example scss tools.$easing: ( '_elastic': cubic-bezier(0.5, -0.4, 0.5, 1.4), 'modal': '#_elastic', 'error-message': '#modal', ); .example { animation: fade 1s tools.var-ease('error-message', ease-in); transition: translate var-ease('modal'); } css compiled .example { animation: fade 1s var(--ease-error-message, ease-in); transition: translate var-ease(\"modal\"); } Requires @function var-token() $named-easing $easing-var-prefix (string)"},"animate-ease.html":{"filename":"animate-ease.html","title":"Easing Maps","contents":"A classic set of built-in easing functions, if you don’t want to define your own. These can be used either as variables (with the ease- prefix), or in token maps (with the _ prefix) Since 4.0.0: NEW: Now available as individual variables Example scss @use 'animate/easing-named' as named; @each $name, $value in meta.module-variables('named') { /*! $#{$name}: #{$value}; */ } css compiled /*! $in: ease-in; */ /*! $out: ease-out; */ /*! $in-out: ease-in-out; */ /*! $in-quad: cubic-bezier(0.55, 0.085, 0.68, 0.53); */ /*! $in-cubic: cubic-bezier(0.55, 0.055, 0.675, 0.19); */ /*! $in-quart: cubic-bezier(0.895, 0.03, 0.685, 0.22); */ /*! $in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06); */ /*! $in-sine: cubic-bezier(0.47, 0, 0.745, 0.715); */ /*! $in-expo: cubic-bezier(0.95, 0.05, 0.795, 0.035); */ /*! $in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.335); */ /*! $in-back: cubic-bezier(0.6, -0.28, 0.735, 0.045); */ /*! $out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94); */ /*! $out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1); */ /*! $out-quart: cubic-bezier(0.165, 0.84, 0.44, 1); */ /*! $out-quint: cubic-bezier(0.23, 1, 0.32, 1); */ /*! $out-sine: cubic-bezier(0.39, 0.575, 0.565, 1); */ /*! $out-expo: cubic-bezier(0.19, 1, 0.22, 1); */ /*! $out-circ: cubic-bezier(0.075, 0.82, 0.165, 1); */ /*! $out-back: cubic-bezier(0.175, 0.885, 0.32, 1.275); */ /*! $in-out-quad: cubic-bezier(0.455, 0.03, 0.515, 0.955); */ /*! $in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1); */ /*! $in-out-quart: cubic-bezier(0.77, 0, 0.175, 1); */ /*! $in-out-quint: cubic-bezier(0.86, 0, 0.07, 1); */ /*! $in-out-sine: cubic-bezier(0.445, 0.05, 0.55, 0.95); */ /*! $in-out-expo: cubic-bezier(1, 0, 0, 1); */ /*! $in-out-circ: cubic-bezier(0.785, 0.135, 0.15, 0.86); */ /*! $in-out-back: cubic-bezier(0.68, -0.55, 0.265, 1.55); */ Used By @function ease() @mixin easing--() @mixin ease--() @function var-ease() Easing Maps: Curves & Steps Whether you are using CSS-named easing, like ease-in-out and linear, or defining your own easing with cubic-bezier() and steps()/frames() – we’ll help you organize and standardize your values in a single location. We also provide a classic set of built-in easing functions, which you can rename, access, or override as desired. $easing scss $easing: () !default; A variable storing the map of all easing globally-available on your project. Any easing added to the $easing map will be accessible to the ease() function by default. Define each easing with a name and value… $easing: ( 'elastic': cubic-bezier(0.5, -0.4, 0.5, 1.4), 'sidebar-in': ease-out, 'sidebar-out': '#_in-back', 'modal-in': '#sidebar-in', ); Name your easing anything – from abstractions like elastic, to concrete patterns like sidebar-in. Values can be CSS-ready easing functions, or references other easings in the map. Used By @mixin add-easing() @function ease() Access a named easing function in your $easing map. Since 1.0.0: NEW: Accepts $do map argument, for on-the-fly adjustments NEW: Accepts $source map argument, for custom source-palette Parameters & Return $name: 'ease' (string) The name of an easing in your configuration $do: null (map | null) A map of function/ratio adjustments to run on the returned value $source: $easing (map) Optional accoutrement-format map of easings to use as the origin palette (in additional to the provided defaults) @return (length) The pre-defined easing Requires @function get() [private] $named-easing @mixin add-easing() Merge individual easing maps into the global $easing variable, in case you want to define easings in smaller groups such as fade-easing, slide-easing, etc before merging them into a single global easing-palette. Parameters & Output $maps: (map...) Pass any number of maps to be merged. {CSS output} (code block) An updated global $easing variable, with new maps merged in. Requires @function multi-merge() $easing"},"animate-time-vars.html":{"filename":"animate-time-vars.html","title":"Times » CSS Variables","contents":"Times » CSS Variables $time-var-prefix (string) scss $time-var-prefix: 'time-' !default; Since CSS variables are often defined in a global space, it can be useful to prefix different variable types. Accoutrement maps help solve that problem in Sass, so we wanted to carry that over into our CSS variable support. Set a prefix for all time-tokens, and we’ll apply it when setting or calling css variables based on your time maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$times: ('my-time': 1s); tools.$time-var-prefix: 'prefix_'; html { @include tools.time--('my-time') } css compiled html { --prefix_my-time: 1s; } Used By @mixin times--() @mixin time--() @function var-time() @mixin times--() Convert any time-map into CSS variables, using the global $time-var-prefix. Time names that start with _ or - are considered “private” and will not be output as variables Times that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $times (map) Optionally use a custom map of times to set as css variables {CSS output} (code block) Custom properties for all public times in the map Example scss tools.$times: ( '_fast': 200ms, 'text': '#_fast', 'fade': '#text', ); html { @include tools.times--; } css compiled html { --time-text: 200ms; --time-fade: var(--time-text, 200ms); } Requires $time-var-prefix (string) @mixin time--() Set a single custom property based on a map-time, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $time: (*) Time name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $time $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $times (map) Optional map of times to use as a palette source Example scss tools.$times: ( '_brand': 200ms, 'text': '#_brand' ('plus': 50ms), 'fade': '#text', ); .example { @include tools.time--('fade'); @include tools.time--('color-change', 'fade', 0.2s); } css compiled .example { --time-fade: var(--time-text, 250ms); --time-color-change: var(--time-fade, 0.2s); } Requires $time-var-prefix (string) @function var-time() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $time: (*) Time name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: (map) Optional Accoutrement map of times to use as source @return (string) CSS variable call, in the format: var(--, ) Example scss tools.$times: ( '_fast': 200ms, 'text': '#_fast' ('plus': 50ms), 'fade': '#text', ); .example { transition: opacity tools.var-time('fade'), color tools.var-time('text', 150ms); } css compiled .example { transition: opacity var(--time-fade, 250ms), color var(--time-text, 150ms); } Requires @function var-token() $time-var-prefix (string)"},"animate-times.html":{"filename":"animate-times.html","title":"Timing Maps","contents":"Timing Maps: Durations & Delays Manage all your duration & delay patterns in a single place - with explicitly documented relationships. $times scss $times: () !default; A variable storing the map of all timing globally-available on your project. Any times added to the $times map will be accessible to the time() function by default. Define each time with a name, base-value, and optional adjustments… $times: ( 'fast': , 'slow': ('': ''), // will return: function-name($base-value, $arguments...) ); Name your times anything – from abstractions like fast, to concrete patterns like button-background-hover. Base-values can be CSS-ready times, or references other times in the map. Adjustments are a nested map of functions and arguments, for adjusting times directly in your palette. Used By @mixin add-times() @function time() Access a named time in your $times map. Since 1.0.0: NEW: Accepts $do map argument, for on-the-fly adjustments NEW: Accepts $source map argument, for custom source-palette Parameters & Return $time: (string) The name of a time in your configuration $do: null (map | null) A map of function/ratio adjustments to run on the returned value $source: $times (map) Optional accoutrement-format map of times to use as the origin palette @return (length) The calculated length of time Requires @function get() [private] @mixin add-times() Merge individual time maps into the global $times variable, in case you want to define times in smaller groups such as duration-times, delay-times, etc before merging them into a single global times-palette. Parameters & Output $maps: (map...) Pass any number of maps to be merged. {CSS output} (code block) An updated global $times variable, with new maps merged in. Requires @function multi-merge() $times"},"animate.html":{"filename":"animate.html","title":"QuickStart: Animate","contents":"QuickStart: Animate Tools for managing animations & transitions. Organize all your timing, easing, and transitions into maps Document relationships directly in the code Import If you already imported accoutrement/sass/tools you are ready to go. You can also import the color module on its own: @use '/accoutrement/sass/animate'; Timing & Easing Establish your timing and easing palettes, with the standard Accoutrement syntax: $times: ( 'fast': 150ms, 'medium': '#fast' ('times': 2), ); $easing: ( 'elastic': cubic-bezier(0.5, -0.4, 0.5, 1.4), 'fade-in': '#in-out-quad', ); Access them anywhere: .example { animation: slide-in time('fast') ease('in-out-quad') 1 both; transition-delay: time('fast'); transition-duration: time('medium'); transition-timing-function: ease('elastic'); } Related $times @function time() $easing @function ease() Transitions & Animations Use your timing and easing patterns to compose reusable “changes” – including transitions and animations: $changes: ( 'slide-in': slide-in time('fast') ease('in-out-quad') 1 both, 'delay-in': '#slide-in' time('medium'), 'fade-ease': time('medium') ease(in), 'fade-colors': color '#fade-ease', background-color '#fade-ease', ); Access them anywhere: .example { animation: change('slide-in'); transition: change('fade-colors'); } Or use the mixin shortcuts: .example { @include animate('slide-in'); @include transition('fade-colors'); } Related $changes @function change() @mixin animate() @mixin transition()"},"CHANGELOG.html":{"filename":"CHANGELOG.html","title":"Changelog","contents":"Accoutrement Changelog 4.0.0 - UNRELEASED 4.0.0-beta.2 - 12/03/21 This is a major update, moving over to Sass modules, and removing some features that no longer seem necessary. (previous betas had major breaking issues) BREAKING: Requires Sass modules, and other recent features of Dart Sass. Legacy versions of Sass (Node & Ruby) are no longer supported BREAKING: The old “init” module, which provided light-weight browser normalization, is no longer included. We now recommend using CSS Remedy. BREAKING: The old “core” module has been broken into individual modules for “utilities” (extending several Sass modules), “tokens” (the map syntax parser), “variables” (converting Sass variables & maps to CSS custom properties), and “ratios” (for typographic scales and layout aspect ratios) Sass Utilities: NEW: These functions are now available directly, as well as being registered in the map syntax Variables: NEW: ident() function adds -- and an optional prefix to any string, in order to generate a custom property identifier. NEW: custom-props() mixin generates custom properties for every key/value pair in a map. Tokens: NEW: A module just for the custom map syntax parser & function registration BREAKING: The $functions map no longer accepts alias references or any other aspects of the token syntax BREAKING: Ratios are no longer first-class adjustments (like functions) in the token syntax BREAKING: tokens.$handle-missing-keys defaults to null, and no longer supports the legacy silent option. BREAKING: get-token() is renamed get(), and only accepts bare token names (no # prefix), including the outer->inner nested token syntax. NEW: The new compile() function provides direct access to parse & resolve an arbitrary token value (including aliases with # prefix), rather than calling a specific token by name. NEW: All the built-in Sass module functions are registered by default, as . NEW: has-token() function checks a map to see if the given token is defined, and supports the outer->inner nested token syntax. Ratios: NEW: Built-in named ratios are now available as individual variables, (without the _ prefix that is applied in token maps) NEW: is-ratio() function can be used to type-check ratios, including ratio tokens. Scale: NEW: scale() function applies a modular scale to any value, allowing you to move up or down the scale any number of steps. Layout: BREAKING: Removed global-box-sizing BREAKING: Removed clearfix BREAKING: Removed fluid-ratio BREAKING: Removed position. Can achieve the majority of functionality in CSS using Inset 3.0.1 - 03/01/21 INTERNAL: Upgrade dev dependencies. DOCS: Fix changelog typo. 3.0.0 - 02/22/21 BREAKING: Change to get-token() return value when the key path cannot be resolved, and $handle-missing-keys is unset or silent: Maps along the missing key path are no longer interpolated into the returned string. This is part of the fix for #49. Use $handle-missing-keys for more precise missing subkey behavior. (Thanks to John Crim @johncrim) NEW/BREAKING: Font maps accept display key, which can be used to set font-display property for importing web-fonts. (thanks to André Schließer @schliesser) BUGFIX (#49): Using get-token() to resolve a missing key no longer errors when using dart-sass and $handle-missing-keys is unset or silent. Instead, the unresolved path is returned. (Thanks to John Crim @johncrim) BUGFIX (#61): Using get-token() to obtain a 2nd level or deeper submap no longer causes a fatal error when using dart-sass and $handle-missing-keys is null, warn, or error. (Thanks to John Crim @johncrim) INTERNAL: Run unit tests with dart-sass (in addition to node-sass, which was used prior). (Thanks to John Crim @johncrim) INTERNAL: Upgrade dev dependencies. DOCS (#53): Use html rather than :root for examples. DOCS: Wrong parameter name in contrast-ratio() function docs. 2.2.0 - 09/08/20 NEW: (#41) Global $handle-missing-keys allows you to control exactly what should happen when a key look-up fails. The default silent provides backwards-compatible silent-failure. Other options include: null: get-token() will return null, similar to Sass map.get() warn: get-token() will return null, and also throw a warning error: get-token() will throw an error if the value is not found NEW: \\\\ (an escaped backslash) can be used to ignore (\\\\#not-an-alias) or end (#alias\\\\not-part-of-alias) a # reference INTERNAL: (#41) Major performance improvements to the token look-up algorithm Huge thanks to James Camilleri (@jcamilleri13) for all the improvements here. 2.1.4 - 06/30/20 DOCS (#54): Fix broken links in docs INTERNAL: Upgrade dev dependencies. 2.1.3 - 01/06/20 Core: BUGFIX (#46): Fixes register-function() usage with Sass module syntax 2.1.2 - 08/26/19 Upgrade dev dependencies. Core: BUGFIX (#36): Fixes an issue with quote() in dart-sass. BUGFIX (#38): Fixes an issue with false values in maps. 2.1.1 - 01/04/19 Core: BUGFIX (#31): Fixes an issue with longhand map memoization 2.1.0 - 12/20/18 Plugin: Color NEW: contrast(), contrasted(), var-contrast(), and var-contrasted() provide access to the lowest accessible contrast value, as well as than the (default) maximum contrast value. Pass a valid contrast ratio (0-21) or WCAG standard (aaa, aa, aa-large) to set a cutoff ratio, and return the minimum accessible color NEW: shades-of() generates a range of light and dark color-shades to help build accessible themes based on a few origin colors NEW: stripe-colors() function and mixin generate a color-stops or a full striped gradient background. This is useful for viewing the result from shades-of() 2.1.0-beta.1 - 12/13/18 Plugin: Color NEW: var-contrast() and var-contrasted() provide CSS variable parallels to contrast() and contrasted() NEW: User-defined contrast defaults (contrast-light and contrast-dark) can be defined with or without the _ private-color prefix NEW: Contrast-related functions and mixins provide a smart second light-or-dark default option when only one is defined (previously an error) 2.0.0 - 12/05/18 The 2.0 release is primarily focused on support for CSS Custom Properties (aka CSS Variables), and access to nested-map tokens with #outside->inside syntax. We’ve also added private tokens (_token), and various tools for token-inspection. All factory-default tokens (contrast-colors, named ratios, etc) are now marked as private, and will need to be called with a _ prefix. See the full details below. Thanks to Joel Schou (@joelschou) for extensive contributions, designing and testing several of these features. Core: BREAKING: Explicit value/adjustments maps require a '%value' key (used to be named 'value'), in order to avoid possible conflicts or false-positives NEW (BREAKING alpha.1): all nested-map token references (using ->) must be absolute paths from the map root, rather than assuming the most closely related sibling or ancestor value BUGFIX (from alpha.1): Major improvements to compile time when parsing -> syntax 2.0.0-alpha.1 - 10/29/18 Core: NEW: $adjust-query-overlap (max | min | false) allows you to control if and how media-queries are adjusted to avoid overlap between min/max queries (thanks to @joelschou) NEW: Support for integrating accoutrement tokens & CSS variables with tokens--(), token--(), var-token(), and plugin-specific shortcuts BREAKING: Token names starting with _ or - are considered “private” to Sass, and will not be output when auto-generating CSS (variables, font-names, etc.) BREAKING: Default ratio tokens are now prefixed with _ (search/replace e.g. minor-third -> _minor-third) to avoid CSS-variable output NEW: is-private-token() and is-alias-for() are now public functions, to help with token-inspection BREAKING: Support for nested-map tokens with -> syntax, both in #hash->references and get-token($source, 'function->calls') (thanks to @joelschou) Plugin: Animate BREAKING: Default easing tokens are now prefixed with _ (search/replace e.g. in-out-quad -> _in-out-quad) to avoid CSS-variable output NEW: Support for easing CSS variables with easing--(), ease--(), and var-ease() NEW: Support for time CSS variables with times--(), time--(), and var-time() NEW: Support for change CSS variables with changes--(), change--(), and var-change() Plugin: Color BREAKING: _contrast-light and _contrast-dark colors are used for mixing tint() and shade(), with optional $light/$dark override parameters (thanks to @joelschou) NEW: Default _contrast-light and _contrast-dark provided, set _contrast-light/dark in $colors to override NEW: Support for CSS Variables with colors--(), color--(), and var-color() Plugin: Layout BREAKING: Default ratio tokens are now prefixed with _, see core for details Plugin: Scale BREAKING: Default ratio tokens are now prefixed with _, see core for details NEW: Support for size CSS Variables with sizes--(), size--(), and var-size() NEW: Support for ratio variables with ratios--(), ratio--(), and var-ratio() Plugin: Type BREAKING: Non-map fonts are interpreted as font-stacks BREAKING: Normalized font-data uses proper name-quotation, and ignores missing or private names/stacks BREAKING: import-webfonts() no longer imports private fonts, but will import a direct alias of the private font NEW: import-webfonts() accepts $source parameter NEW: Support for CSS Variables with fonts--(), font--(), and var-font() 1.0.1 - 09/08/18 Core: BUGFIX: Typos, including the cinema ratio spelling (thanks to @joelschou) BUGFIX: Improved consistency of nested-map parser (thanks to @joelschou) 1.0.0 - 08/08/18 The stable 1.0 release is identical to -beta.3, see change details below 1.0.0-beta.3 - 08/03/18 Plugin: Scale BUGFIX: size() function removes quotes from string (calc) sizes 1.0.0-beta.2 - 07/27/18 Core: NEW: ratio() function accepts $source argument, for passing in a custom source map NEW: Improved error-handling and messages NEW: Added str-trim and str-split aliases in addition to the existing trim and split Plugin: Animate NEW: ease(), time(), and change() functions all accept $source argument, for passing in a custom source map Plugin: Layout NEW: break() function accepts $source argument, for passing in a custom source map NEW: break() function accepts $scale boolean, to turn off access to the scale-plugin $sizes map NEW: fluid-ratio() function and mixin both accept $source argument, for passing in a custom source map Plugin: Scale BREAKING: negative() function and square() mixin both accept $do argument for on-the-fly adjustments – replacing the old $units… variable argument. Non-map $do values are converted to ('convert-units': $do) before processing, to provide a shortcut for unit-conversions. negative('root', 'cm') will continue to work, but negative('root', 'em', 10px) should be changed to negative('root', 'em' 10px) (with all unit args in a single list) NEW: size()/negative() functions and square() mixin accept $source argument, for passing in a custom source map Plugin: Type NEW: font()/font-family() functions and font-family()/font-face() mixins accept $source argument, for passing in a custom font-source map 1.0.0-beta.1 - 07/18/18 NEW: Add _index.scss to simplify default “tools” import (core + plugins) in Eyeglass: @import 'accoutrement'; Core: NEW: get-token() and ratio() functions accept $do argument, for on-the-fly adjustments NEW: trim($string) utility now available in map-syntax, to trim white-space from the start and end of a string NEW: str-replace() utility now forces arguments to string-type when appropriate, allowing e.g. calc(16px + 1vw) ('str-replace': 1vw 2vw) Plugin: Animate NEW: change(), time(), and ease() functions all accept $do arg for on-the-fly adjustments Plugin: Color BREAKING: color() functions accept $do arg for on-the-fly adjustments – before existing $palette argument BREAKING: $palette argument renamed $source for consistency across plugins Plugin: Layout NEW: break() function accept $do arg for on-the-fly adjustments Plugin: Scale BREAKING: size() function $units… variable argument has been replaced with $do map argument, for flexible on-the-fly adjustments. Non-map $do values are converted to ('convert-units': $do) before processing, to provide a shortcut for unit-conversions. size('root', 'cm') will continue to work, but size('root', 'em', 10px) should be changed to size('root', 'em' 10px) (with all unit args in a single list) Plugin: Type BREAKING: import-webfonts() mixin no longer accepts any arguments NEW: font() function provides access to parsed font-data NEW: 'trim' string helper strips whitespace from the start and end of a string NEW: Improved font-normalization handles more font-map edge-cases NEW: Font-stacks can be written as comma-delimited strings, e.g. 'Helvetica Neue, Helvetica, Arial' or 'Helvetica Neue, Helvetica, Arial' 0.1.0 - 07/12/18 BREAKING: All modules now use a shared map syntax, with explicit #tag references and the option for explicit value/adjustment maps. Learn the new syntax. NEW: Merges all existing Accoutrement plugins Core: BREAKING: Internal map-reference now uses #tag syntax NEW: Generic map-syntax, access, and parsing tools are shared by all plugins, and can be used with un-specified data types NEW: Improved function-registration options NEW: Math, modular-scale, string, and list utilities combined from the individual plugins Plugin: Animate: A totally new plugin! Plugin: Color: BREAKING: See core module syntax changes BREAKING: Removed merge-colors() function Plugin: Layout: BREAKING: See core module syntax changes BREAKING: Ratio functionality merged into Core, using the shared $ratios map, and ratio() function. The old $aspect-ratios and aspect-ratio() have been removed. Plugin: Scale: BREAKING: See core module syntax changes BREAKING: String interpolation has moved into the core using function syntax '%s and %s' ('%s': 'new1' 'new2') rather than list syntax '%s and %s' ('new1', 'new2') BREAKING: Math functions have moved into the core. The actual functions are now prefixed & private, but they are made available to Accoutrement maps under the additional aliases New: Ratios have moved into the core, with additional defaults Plugin: Type: BREAKING: See core module syntax changes NEW: Allow space-separated string variants ('500 italic') for weight and style, in addition to lists (500 'italic') NEW: Automatically formats font-family stacks with proper commas & quotations for CSS output Older Changelogs, from individual modules: Accoutrement Init Accoutrement Color Accoutrement Layout Accoutrement Scale Accoutrement Type"},"color-config.html":{"filename":"color-config.html","title":"Color Configuration","contents":"Color Configuration The color module provides several functions & mixins for managing color contrast, as well as tint and shade functions for mixing colors with white or black. In both cases, it can be useful to establish your own light & dark contrast colors to work with in place of true white or black. $contrast-light (color) scss $contrast-light: white !default; Establish a default light color for use in contrast functions. Used By @function default-contrast() [private] $contrast-dark (color) scss $contrast-dark: black !default; Establish a default dark color for use in contrast functions. Used By @function default-contrast() [private]"},"color-contrast.html":{"filename":"color-contrast.html","title":"Contrast & Accessibility","contents":"@function var-contrast() An extension of the contrast function, designed to output CSS variables rather than simple color values. Since 2.1.0: NEW: Provides access to contrast colors as CSS-variables, when defined Parameters & Return $color: (string | list) The name or value of a color. $options...: (colors | min-contrast) List of colors to contrast against. This function will choose the best contrast of all the options provided, or the contrast-light and contrast-dark defaults defined in your color palette or the factory settings. Any {'AA' | 'AA-large' | 'AAA' | 0-21 } values will be treated as a minimum color-contrast ratio – and will return the minimum accessible option, rather than the maximum contrast. @return (color | var()) CSS Variable for the color-option that has the highest contrast-ratio to $color, or the color if no variable exists. Examples scss max contrast / no variable names tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { color: tools.var-contrast( 'background', 'light', 'dark', black, white ); } css compiled html { color: white; } scss min contrast / variable names tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { color: tools.var-contrast( 'background', 'light', 'dark', black, white, 'AAA' ); } css compiled html { color: var(--color-light, #eee); } Requires @function best-contrast() [private] @function get() [private] @function is-private-token() @function ident() $color-var-prefix (string) Used By @mixin var-contrasted() @mixin var-contrasted() Apply any background color as a CSS variable, along with the highest-contrast text color from a set of options. This works the same as the var-contrast function, but applies the resulting values to background-color and text color properties. Since 2.1.0: NEW: Applies contrasting colors as CSS-variables, when defined Parameters & Output $background: (string | list) The name or value of your desired background color. $options...: (colors | min-contrast) List of colors to contrast against. This function will choose the best contrast of all the options provided, or the contrast-light and contrast-dark defaults defined in your color palette or the factory settings. Any {'AA' | 'AA-large' | 'AAA' | 0-21 } values will be treated as a minimum color-contrast ratio – and will return the minimum accessible option, rather than the maximum contrast. {CSS output} (code block) Sets the background-color to $background and the foreground color to whichever option has better contrast against the given background. Examples scss max contrast tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { @include tools.var-contrasted( 'background', 'light', 'dark', black, white ); } css compiled html { background-color: var(--color-background, blue); color: white; } scss min contrast tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { @include tools.var-contrasted( 'background', 'light', 'dark', black, white, 'AAA' ); } css compiled html { background-color: var(--color-background, blue); color: var(--color-light, #eee); } Requires @function var-color() @function var-contrast() Contrast & Accessibility @function contrast() For any color, select the best contrast among a set of options. For best results, pass in a combination of light and dark colors to contrast against – or define default contrast-light and contrast-dark values (with or without a private _ prefix) in your global $colors map. Parameters & Return $color: (string | list) The name or value of a color. $options...: (colors | min-contrast) List of colors to contrast against. This function will choose the best contrast of all the options provided, or the contrast-light and contrast-dark defaults defined in your color palette or the factory settings. Any {'AA' | 'AA-large' | 'AAA' | 0-21 } values will be treated as a minimum color-contrast ratio – and will return the minimum accessible option, rather than the maximum contrast. @return (color) Whichever color-option has the highest contrast-ratio to $color, or the minimum needed contrast to meet a given accessibility ratio. Examples scss max contrast tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { color: tools.contrast( 'background', 'light', 'dark', black, white ); } css compiled html { color: white; } scss min contrast tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { color: tools.contrast( 'background', 'light', 'dark', black, white, 'AAA' ); } css compiled html { color: #eee; } Requires @function best-contrast() [private] Used By @mixin contrasted() @mixin contrasted() Apply any background color, along with the highest-contrast text color from a set of options. This works the same as the contrast function, but applies the resulting values to background-color and text color properties. Parameters & Output $background: (string | list) The name or value of your desired background color. $options...: (colors | min-contrast) List of colors to contrast against. This function will choose the best contrast of all the options provided, or the contrast-light and contrast-dark defaults defined in your color palette or the factory settings. Any {'AA' | 'AA-large' | 'AAA' | 0-21 } values will be treated as a minimum color-contrast ratio – and will return the minimum accessible option, rather than the maximum contrast. {CSS output} (code block) Sets the background-color to $background and color to the option with highest contrast against that background, or minimum contrast that still meets a given accessibility ratio. Examples scss max contrast tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { @include tools.contrasted( 'background', 'light', 'dark', black, white ); } css compiled html { background-color: blue; color: white; } scss min contrast tools.$colors: ( 'background': blue, 'light': #eee, 'dark': #111, ); html { @include tools.contrasted( 'background', 'light', 'dark', black, white, 'AAA' ); } css compiled html { background-color: blue; color: #eee; } Requires @function color() @function contrast() @function contrast-ratio() Compare two colors using the WCAG comparison algorithm, and return the resulting contrast-ratio. Optionally pass in a standard (AA, AAA, AA-large) and return false when the contrast-check fails. ‘AA-large’ == 3:1 ‘AA’ == 4.5:1 ‘AAA’ == 7:1 Parameters & Return $base: (color | number) Color value, color token name, or pre-calculated numeric luminance for the base color. $contrast: (color | number) Color value, color token name, or pre-calculated numeric luminance for a contrast color to compare against the base. $require: false ('AA' | 'AA-large' | 'AAA' | number | false) An optional WCAG contrast ratio to require. The function will return false if the required ratio is not met. @return (number) The WCAG-defined contrast-ratio of two colors. Example scss /* black and white: #{tools.contrast-ratio(white, black)} */ /* failed 'AAA': #{tools.contrast-ratio(white, #999, 'AAA')} */ css compiled /* black and white: 21 */ /* failed 'AAA': false */ Related WCAG Contrast Definition [external] Requires @function luminance() @function valid-contrast() [private] @function check() [private] @function error() [private] Used By @function best-contrast() [private] @function luminance() Get the WCAG luminance of a color in your palette. Parameters & Return $color: (string | list) A color value or color token name. @return (number) WCAG-defined numeric luminance value. Related WCAG Relative Luminance [external] Requires @function color() @function check() [private] Used By @function contrast-ratio() @function shades-of() @function best-contrast() [private]"},"color-themes.html":{"filename":"color-themes.html","title":"Themes","contents":"Color Themes @function shades-of() Generates an accoutrement map of light/dark color variations from a map of user-defined colors, based on luminosity. The origin color will be included in the appropriate spot, based on it’s own luminosity. Since 2.1.0: NEW: Generate consistent tint/shade themes from arbitrary colors Parameters $origin: (map) user-color map to use as a basis for generating the theme $range: 3 (integer) number of dark and light variations desired, in addition to the midpoint Example scss $user-colors: ( 'primary': blue, 'accent': red, ); @include tools.add-colors($user-colors); $theme-colors: tools.shades-of($user-colors, 2); @include tools.add-colors($theme-colors); @each $name, $value in $theme-colors { /* #{$name}: #{inspect($value)} */ } css compiled /* primary-dark-2: \"#primary\" (\"shade\": 40%) */ /* primary-dark-1: \"#primary\" */ /* primary-0: \"#primary\" (\"tint\": 15.3846153846%) */ /* primary-light-1: \"#primary\" (\"tint\": 46.1538461538%) */ /* primary-light-2: \"#primary\" (\"tint\": 76.9230769231%) */ /* accent-dark-2: \"#accent\" (\"shade\": 40%) */ /* accent-dark-1: \"#accent\" */ /* accent-0: \"#accent\" (\"tint\": 15.3846153846%) */ /* accent-light-1: \"#accent\" (\"tint\": 46.1538461538%) */ /* accent-light-2: \"#accent\" (\"tint\": 76.9230769231%) */ Requires @function color() @function luminance() @function get() [private] @function stripe-colors() Create color-stops for a striped gradient background, from any number of colors Since 2.1.0: NEW: Especially useful for viewing generated color palettes Parameters & Return $colors...: (string | color) ArgList of colors @return (color) A calculated css-ready color-value based on your global color palette. Example scss [data-theme='rainbow'] { background: linear-gradient( to right, tools.stripe-colors(red, orange, yellow, green, blue, indigo, violet) ); } css compiled [data-theme=rainbow] { background: linear-gradient(to right, red 0% 14.2857142857%, orange 14.2857142857% 28.5714285714%, yellow 28.5714285714% 42.8571428571%, green 42.8571428571% 57.1428571429%, blue 57.1428571429% 71.4285714286%, indigo 71.4285714286% 85.7142857143%, violet 85.7142857143% 100%); } Requires @function color() $colors (map) Used By @mixin stripe-colors() @mixin stripe-colors() Create a striped gradient background from any number of colors Since 2.1.0: NEW: Especially useful for viewing generated color palettes Parameters $angle...: (gradient angle) e.g. to right or 35deg $colors...: (string | color) ArgList of colors Example scss [data-theme='rainbow'] { @include tools.stripe-colors( to right, red, orange, yellow, green, blue, indigo, violet ); } css compiled [data-theme=rainbow] { background-image: linear-gradient(to right, red 0% 14.2857142857%, orange 14.2857142857% 28.5714285714%, yellow 28.5714285714% 42.8571428571%, green 42.8571428571% 57.1428571429%, blue 57.1428571429% 71.4285714286%, indigo 71.4285714286% 85.7142857143%, violet 85.7142857143% 100%); } Requires @function stripe-colors() $colors (map)"},"color-tokens.html":{"filename":"color-tokens.html","title":"Color Tokens","contents":"Accessing Colors $colors (map) scss $colors: () !default; A variable storing the map of all colors globally-available on your project. Any colors added to the $colors map will be accessible to the color() function by default. Define each color with a name, base-value, and optional adjustments… $colors: ( 'color-name': , 'color-two': ('': ''), // will return: function-name($base-value, $arguments...) ); Name your colors anything – from abstractions like brand-pink, to concrete patterns like button or widget-background. Base-values can be CSS-ready colors (hex, rgb, hsla), or references other colors in the map. Adjustments are a nested map of color functions and arguments, for adjusting colors directly in your palette. The color-names contrast-light and contrast-dark are special (with or without a private _ prefix). Use those names to define the default light-and-dark options for our color-contrast tools. They default to white and black respectively. Since 0.1.0: BREAKING: Uses the new shared map syntax, for internal references and adjustments Examples scss simple color definitions $colors: ( 'brand-pink': hsl(330, 85%, 62%), 'brand-light': #fff, 'brand-dark': #222, ); scss reference other colors $colors: ( 'background': '#brand-light', 'text': '#brand-dark', 'link': '#brand-pink', ); scss adjust referenced colors with any color function $colors: ( 'focus': '#link' ('darken': 15%, 'desaturate': 15%), ); Used By @function stripe-colors() @mixin stripe-colors() @mixin add-colors() @function default-contrast() [private] @mixin add-colors() Merge individual color maps into the global $colors variable, in case you want to define colors in smaller groups such as brand-colors, link-colors, etc before merging them into a single global color-palette. This can be useful for internal organization, documentation with SassDoc, or integration with our pattern-library generator: Herman. Parameters & Output $maps: (map...) Pass any number of maps to be merged. {CSS output} (code block) An updated global $colors variable, with new maps merged in. Example scss $brand-colors: ( 'brand-dark': #222, 'brand-pink': hsl(330, 85%, 62%), ); $text-colors: ( 'text': '#brand-dark', 'link': '#brand-pink', ); @include tools.add-colors($brand-colors, $text-colors); Requires @function multi-merge() $colors (map) @function color() The primary function for accessing colors in your palette, or making adjustments on the fly. This is more than a wrapper for map-get($colors, $x). It also handles internal color-references, recursion, and functional color-adjustments. It has access to the global $colors map by default, but you can also pass in arbitrary color-palette maps as well. Since 2.0.0: BREAKING: Provides access to color-contrast defaults, if they haven’t been re-set by the user Since 1.0.0: BREAKING: Renamed $palette arg to $source BREAKING: Accepts $do argument between $color and $source Parameters & Return $color: (string | list) The name of a color in your palette, or a color description in the map configuration format. $do: null (map | null) A map of function/ratio adjustments to run on the returned value $source: $colors (map) Optional map containing the source color-palette. Defaults to the global $colors map. @return (color) A calculated css-ready color, based on your global color palette and adjustments. Example scss $colors: ( 'background': #eee, 'text': #222, ); html { background: color('background'); color: color('text'); } css compiled html { background: color(\"background\"); color: color(\"text\"); } Requires @function compile() @function get() [private] Used By @mixin contrasted() @function luminance() @function shades-of() @function stripe-colors() @function tint() @function shade() @function best-contrast() [private]"},"color-utils.html":{"filename":"color-utils.html","title":"Adjustments","contents":"Color Utility Functions @function tint() Mix a color with contrast-light (defaults to white) to get a lighter tint of your color. Make sure to override $light when using tint to define the value of contrast-light Since 2.0.0: BREAKING: Use contrast-light for default mix, rather than white. NEW: Accept $light color to use in place of contrast-light default Parameters & Return $color: (string | list) The name of a color in your palette, with optional adjustments in the form of (: ). $percentage: (percentage) The percentage of a $light color to mix in. Higher percentages will result in a lighter tint. $light: null (color | String) The lighter color to be mixed in for tinting. @return (color) A calculated css-ready color-value based on your global color palette. Requires @function default-contrast() [private] @function color() @function shade() Mix a color with contrast-dark (defaults to black) to get a darker shade of your color. Make sure to override $dark when using shade to define the value of contrast-dark Since 2.0.0: BREAKING: Use contrast-dark for mix, rather than black NEW: Accept $dark color to use in place of contrast-dark default Parameters & Return $color: (string | list) The name of a color in your palette, with optional adjustments in the form of (: ). $percentage: (Percentage) The percentage of a $dark color to mix in. Higher percentages will result in a lighter tint. $dark: null (color | String) The darker color to be mixed in for shading. @return (color) A calculated css-ready color-value based on your global color palette. Requires @function default-contrast() [private] @function color()"},"color-vars.html":{"filename":"color-vars.html","title":"Color Tokens » CSS Variables","contents":"Colors » CSS Variables $color-var-prefix (string) scss $color-var-prefix: 'color-' !default; Since CSS variables are often defined in a global space, it can be useful to prefix different variable types. Accoutrement maps help solve that problem in Sass, so we wanted to carry that over into our CSS variable support. Set a prefix for all color-tokens, and we’ll apply it when setting or calling css variables based on your color maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$colors: ('my-color': pink); tools.$color-var-prefix: 'prefix_'; html { @include tools.color--('my-color') } css compiled html { --prefix_my-color: pink; } Used By @function var-contrast() @mixin colors--() @mixin color--() @function var-color() @mixin colors--() Convert any color-map into CSS variables, using the global $color-var-prefix. Color names that start with _ or - are considered “private” and will not be output as variables Colors that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $colors (map) Optionally use a custom map of colors to set as css variables {CSS output} (code block) Custom properties for all public colors in the map Example scss tools.$colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); html { @include tools.colors--; } css compiled html { --color-text: #206020; --color-border: var(--color-text, #206020); } Requires $color-var-prefix (string) @mixin color--() Set a single custom property based on a map-color, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $color: (*) Color name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $color $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $colors (map) Optional map of colors to use as a palette source Example scss tools.$colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); .example { @include tools.color--('border'); @include tools.color--('outline', 'border', red); } css compiled .example { --color-border: var(--color-text, #206020); --color-outline: var(--color-border, red); } Requires $color-var-prefix (string) @function var-color() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $color: (*) Color name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: (map) Optional Accoutrement map of colors to use as source @return (string) CSS variable call, in the format: var(--, ) Example scss tools.$colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); .example { border-color: tools.var-color('border'); color: tools.var-color('text', black); } css compiled .example { border-color: var(--color-border, #206020); color: var(--color-text, black); } Requires @function var-token() $color-var-prefix (string) Used By @mixin var-contrasted()"},"color.html":{"filename":"color.html","title":"QuickStart: Color","contents":"QuickStart: Color Tools for managing colors and palettes. Organize all your colors into a single map, or set of maps Document color relationships directly in the code Automate WCAG-appropriate contrast checking Generate color-palette documentation with Herman Import If you already imported accoutrement/sass/tools you are ready to go. You can also import the color module on its own: @use '/accoutrement/sass/color'; Color Tokens If you are using the token syntax, establish your color palette, with the standard Token syntax: $colors: ( // set explicit colors 'brand-pink': hsl(330, 85%, 62%), 'brand-light': #ddf, 'brand-dark': #224, // reference existing colors 'background': '#brand-light', 'border': '#brand-dark', // make adjustments as needed, using color functions 'link': '#brand-pink' ('shade': 25%), ); Then access your colors from anywhere: .example { border-color: color('border'); } Related $colors @function color() Multiple Palettes You can also define your colors in smaller maps, and then add them to the global $colors variable using the add-colors() mixin. Map-references using the #tag format will work across maps, once they are both added to the global setting. $brand: ( 'brand-pink': hsl(330, 85%, 62%), 'brand-light': #ddf, 'brand-dark': #224, ); $patterns: ( 'background': '#brand-light', 'border': '#brand-dark', 'link': '#brand-pink' ('shade': 25%), ); // merge everything into the main $colors map… @include add-colors($brand, $patterns); Related @mixin add-colors() WCAG Contrast We’ll also help you calculate WCAG-appropriate color contrasts. You can set the $contrast-light & $contrast-dark configuration variables (white and black by default) or add 'contrast-light' and 'contrast-dark' tokens in your palette (with or without a private _ prefix). These tools can be used with color values, or token names. a:hover { // set a background, and get well-contrasted text @include contrasted('link'); @include contrasted(rebeccapurple); // or return a contrasting color from a set of options border-color: contrast('background', white, rebeccapurple); border-color: contrast(maroon, white, rebeccapurple); } Related @function contrast() @mixin contrasted()"},"CONTRIBUTING.html":{"filename":"CONTRIBUTING.html","title":"Contributing","contents":"Contributing to Accoutrement Bug reports and feature requests are welcome, but code is even better! In all cases, we ask you to follow the Sass community guidelines. Issues You are welcome to ask support questions and file bug reports via Github Issues. In either case, please provide: A minimum code sample that demonstrates the issue, and steps to reproduce Expected behavior and actual results How you’ve attempted to solve the problem Development Set up your environment with the appropriate development dependencies: yarn As you work… Add or update any appropriate unit tests – using True – in the test directory, and make sure all tests are passing with yarn test Add your changes to the changelog Update or add inline documentation using SassDoc as appropriate, and compile the docs with yarn docs Committing Linting, testing, and documentation should be done before every commit: yarn commit They can also be triggered individually: yarn lint yarn test yarn docs Once you’ve fixed any final errors or typos, commit your changes, and submit a pull request! Pull Requests We use the main branch for production-ready code, and side-branches for everything in-progress or up-for-debate. When submitting a patch via pull request: Write a clear, descriptive commit message Keep it simple: one bug fix or feature per pull request"},"index.html":{"filename":"index.html","title":"Accoutrement Documentation","contents":"View Project View Source Sass Accoutrement Robust design systems require meaningful, readable, reusable code. These Sass utilities are designed to help define and manage your design tokens (colors, fonts, sizes, etc.) in a format that can be understood by both humans and parsers – opening the door for automation, while improving consistency and readability. These tools also integrate with Herman, our automated living pattern-library generator built on SassDoc. Official Site Documentation Source Code Issues Brought to you by OddBird – the creators of Susy, True, and Herman. Installation Install the package with npm or yarn npm install accoutrement [--save-dev] yarn add accoutrement [--dev] Use what you need: // all the modules (these are functionally the same) @use '/accoutrement'; @use '/accoutrement/sass/tools'; // individual modules (at `/accoutrement/sass/`) @use '/accoutrement/sass/color'; If you’re using Eyeglass, you can use the default “tools” (core + plugins) using only: @use 'accoutrement'; Modules for common data types Animate – For managing CSS transitions and animations Color – For managing CSS colors and contrast-ratios Scale – For managing CSS sizes: typographic scales, spacing, etc. Type – For managing webfonts, generated content, and other text needs Ratios – For managing aspect and typography ratios (several common ratios are provided) Variables – For converting Sass maps and variables into CSS custom properties Utilities – For helpers with Sass lists, strings, and maps Tokens The Token module provides a special syntax for managing design tokens with Sass “map” objects: $map: ( 'root': 16px, 'gutter': 1em, ); Using the custom syntax, we can extend maps to handle internal reference, and functional adjustments – capturing meaningful relationships between design tokens: $map: ( 'root': 16px, // internal reference & adjustments 'gutter': '#root' ( 'scale': ( '_major-third', 1, ), 'convert-units': 'rem', ), ); Map storage serves a larger purpose: Related data is grouped explicitly, making the code more readable and maintainable The “single source of truth” encourages reusable design patterns Meaningful structure allows automation, from automated style guides to automated functionality This module provides the generic (non data-specific) setup and syntax parsing: Retrieve & parse map values with token.get() and other token api functions Use the many registered functions to manipulate tokens in the map Register your own functions, for extra functionality Note: We no longer use token maps internally at OddBird since Sass “modules” now provide a way to group & namespace normal Sass variables meaningfully, and access module variables as a map. By relying on core Sass features, we avoid any confusion around the custom token syntax."},"layout-queries.html":{"filename":"layout-queries.html","title":"Media Breakpoint Maps","contents":"Media Queries $breakpoints (map) scss $breakpoints: () !default; Establish a map of named breakpoints. If using Accoutrement Scale, you can use the scale syntax for describing size-relationships and adjustments – and even reference $sizes as though they are $breakpoints. Otherwise, the map should contain only valid CSS length values. Since 0.1.0: BREAKING: Uses the new shared map syntax, for internal references and adjustments Examples scss defining breakpoints tools.$breakpoints: ( 'small': 30em, 'medium': 45em, ); scss using accoutrement-scale tools.$breakpoints: ( 'small': 30em ('convert-units': 'browser-ems'), 'medium': '#small' ('times': 1.5), ); Related PX, EM, or REM Media Queries? [external] @function break() Return a breakpoint from the $breakpoint map, or the accoutrement-scale $sizes map if it’s available. Since 1.0.0: NEW: Accepts $do map argument, for on-the-fly adjustments NEW: Accepts $source map argument, for custom breakpoint source-palette NEW: Accepts $scale boolean argument, to turn off access to scale plugin $sizes map Parameters & Return $break: (string) The name or value of a breakpoint $do: null (map | null) A map of function/ratio adjustments to run on the returned value $source: $breakpoints (map) Optional accoutrement-format map of breakpoints to use as the origin palette $scale: true (boolean) By default, we merge in any $sizes available from the scale plugin – making both $breakpoints and $sizes keys available @return (length) The retrieved value of a named breakpoint @error $break is not a valid length or keyword Requires @function compile() @function get() [private] @function error() [private] $sizes (map) Used By @mixin below() @mixin above() @mixin between() @mixin below() Generate a max– query, for styling elements below the given viewport width. To help with overlapping min/max queries, we remove 1px (or 0.01em) from every max value by default. You can adjust that setting to adjust min values or avoid adjustments using the global $adjust-query-overlap setting. Since 2.0.0: BREAKING: min/max adjustments applied to all units (not only px/em/rem) NEW: min/max adjustments respect $adjust-query-overlap global setting Parameters $max: (length | string) The name of a documented breakpoint/size, or an arbitarty length to use in the query. $prop: 'width' ('width' | 'height') The property (width or height) to test against, for a result of e.g. (max-width: 30em). Examples scss @include tools.below(30em) { html { background: red; } } css compiled @media (max-width: 29.99em) { html { background: red; } } scss tools.$breakpoints: ('red': 30em); @include tools.below('red') { html { background: red; } } css compiled @media (max-width: 29.99em) { html { background: red; } } Requires @function break() @function nudge-query() [private] @mixin above() Generate a min- query, for styling elements above the given viewport width. To help with overlapping min/max queries, we remove 1px (or 0.01em) from max values by default. You can adjust that setting to adjust min values or avoid adjustments using the global $adjust-query-overlap setting. Since 2.0.0: BREAKING: min/max adjustments applied to all units (not only px/em/rem) NEW: min/max adjustments respect $adjust-query-overlap global setting Parameters $min: (length | string) The name of a documented breakpoint/size, or an arbitrary length to use in the query. $prop: 'width' ('width' | 'height') The property (width or height) to test against, for a result of e.g. (min-width: 30em). Examples scss @include tools.above(50em) { html { background: green; } } css compiled @media (min-width: 50em) { html { background: green; } } scss tools.$breakpoints: ('green': 50em); @include tools.above('green') { html { background: green; } } css compiled @media (min-width: 50em) { html { background: green; } } Requires @function break() @function nudge-query() [private] @mixin between() Generate a min-and-max- query, for styling elements between given viewport widths. To help with overlapping min/max queries, we remove 1px (or 0.01em) from every max value by default. You can adjust that setting to adjust min values or avoid adjustments using the global $adjust-query-overlap setting. Since 2.0.0: BREAKING: min/max adjustments applied to all units (not only px/em/rem) NEW: min/max adjustments respect $adjust-query-overlap global setting Parameters $min: (length | string) The name of a documented breakpoint/size, or an arbitarty length to use as a minimum in the query. $max: (length | string) The name of a documented breakpoint/size, or an arbitarty length to use as a maximum in the query. $prop: 'width' ('width' | 'height') The property (width or height) to test against, for a result of e.g. (min-width: 30em). Examples scss @include tools.between(30em, 50em) { html { background: yellow; } } css compiled @media (min-width: 30em) and (max-width: 49.99em) { html { background: yellow; } } scss tools.$breakpoints: ( 'red': 30em, 'green': 50em, ); @include tools.between('red', 'green') { html { background: yellow; } } css compiled @media (min-width: 30em) and (max-width: 49.99em) { html { background: yellow; } } Requires @function break() @function nudge-query() [private] Query Utils $adjust-query-overlap ('min' | 'max' | false) scss $adjust-query-overlap: 'max' !default; When using both min- and max- media-queries, you will often get a 1px or 1em overlap where neither or both queries are applied. In order to avoid that, we nudge the max- value down by default. Set this variable to min to nudge min- values up, or false to keep both min and max values un-adjusted, Since 2.0.0: NEW: Allows you to override global max-adjustment default Related Prevent Double Breakpoints [external]"},"layout-z-index.html":{"filename":"layout-z-index.html","title":"Z-Index","contents":"$z-index (list) scss $z-index: () !default; A list of named z-index layers, from lowest to highest index. Nest lists (one level only) to establish a new z-index context: The first item will be indexed based on top-level list position, while additional values are indexed by their position in the nested list. Example scss $z-index: ( 'main', // 1 'sidebar', // 2 'banner' 'active-nav' 'dropdown', // 3 1 2 'message', // 4 'modal', // 5 ); Used By @function z-index() @function z-index() Return the numeric index of a named layer in your $z-index variable. Since 1.0.0: No longer type-check output, to allow CSS variables and other non-number values Parameters & Return $layer: (string) The name of a z-index layer in your configuration. @return (number) The z-index value associated with the given layer in your configuration. Requires $z-index (list) Used By @mixin z-index() @mixin z-index() Output the z-index property and value of a given layer in your $z-index configuration. Parameters & Output $layer: (string) The name of a z-index layer in your configuration. {CSS output} (code block) The z-index property with a value based on your configuration. Requires @function z-index()"},"layout.html":{"filename":"layout.html","title":"QuickStart: Layout","contents":"QuickStart: Layout Tools for managing CSS layout: Organize named z-index values in a list Manage all breakpoints in a map, and access with media-query helpers Import If you already imported accoutrement/sass/tools you are ready to go. You can also import the layout module on its own: @use '/accoutrement/sass/layout'; Media Queries Establish your media-query breakpoints, or use sizes from Accoutrement Scale directly: $sizes: ( 'page': 36rem, ); $breakpoints: ( 'banner-text': 24em, ); Access your breakpoints with above(), below(), and between() mixins: .banner-text { display: none; @include above('banner-text') { display: block; } } .container { @include below('page') { padding: .5em; } } We remove .09em or 1px from max-width queries, to account for media-query overlap issues."},"LICENSE.html":{"filename":"LICENSE.html","title":"MIT License","contents":"MIT License Copyright © 2018–2020 OddBird Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE."},"ratio-tokens.html":{"filename":"ratio-tokens.html","title":"Ratio Tokens","contents":"Ratio Tokens All the tools you need to define and access ratios using the token syntax. $ratios (map) scss $ratios: () !default; Define your own ratios, or alias built-in named ratios (all provided names are prefixed with _ in token maps). Example scss tools.$ratios: ( 'line-height': calc(1 / 3), 'hero': 1.778, 'card': '#_golden', ); Related prose Used By @mixin add-ratios() @function ratio() Retrieve a scale ratio by name from either the $_DEFAULT-RATIOS or user $ratios configurations. Since 1.0.0: NEW: Accepts $do map argument, for on-the-fly adjustments NEW: Accepts $source map argument, for custom source-palette Parameters & Return $ratio: (string | number) The key-name or value of a ratio $do: null (map | null) A map of function/ratio adjustments to run on the returned value $source: $ratios (map) Optional accoutrement-format map of ratios to use as the origin palette (in addition to the provided defaults) @return (number) The numeric value of a ratio Example scss /* _octave: #{tools.ratio('_octave')} */ /* _fifth: #{tools.ratio('_fifth')} */ css compiled /* _octave: 2 */ /* _fifth: 1.5 */ Requires @function get() [private] $named-ratios Used By @function is-ratio() @mixin add-ratios() Merge individual ratio maps into the global $ratio variable. This can be useful for internal organization, documentation with SassDoc, or integration with our pattern-library generator: Herman. Parameters & Output $maps: (map...) Pass any number of maps to be merged. {CSS output} (code block) An updated global $ratios variable, with new maps merged in. Requires @function multi-merge() $ratios (map) @function is-ratio() Check to see if a ratio is valid, converting tokens in the process. Since 4.0.0: NEW: Provides type-checking of ratios in addition to converting ratio tokens. Parameters & Return $ratio: (string | number) The key-name or value of a ratio $source: $ratios (map) Optional accoutrement-format map of ratios to use as the origin palette (in addition to the provided defaults) $allow-tokens: true (bool) Optionally turn off token-parsing. @return (number | 'linear' | false) The numeric value of a ratio, the ‘linear’ keyword, or false if the value is not a valid ratio. Example scss /* _octave: #{tools.is-ratio('_octave')} */ /* 1.4: #{tools.is-ratio(1.4)} */ /* linear: #{tools.is-ratio('linear')} */ /* blue: #{tools.is-ratio(blue)} */ css compiled /* _octave: 2 */ /* 1.4: 1.4 */ /* linear: linear */ /* blue: false */ Requires @function check() [private] @function ratio() Used By @function scale()"},"ratio-vars.html":{"filename":"ratio-vars.html","title":"Ratio Tokens » CSS Variables","contents":"Ratio Tokens » CSS Variables $ratio-var-prefix (string) scss $ratio-var-prefix: 'ratio-' !default; Set a prefix for all ratio-tokens, and we’ll apply it when setting or calling css variables based on your ratio maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$ratios: ('my-ratio': 0.875); tools.$ratio-var-prefix: 'prefix_'; html { @include tools.ratios--; } css compiled html { --prefix_my-ratio: 0.875; } Used By @mixin ratios--() @mixin ratio--() @function var-ratio() @mixin ratios--() Convert any ratio-map into CSS variables, using the global $ratio-var-prefix. Ratio names that start with _ or - are considered “private” and will not be output as variables Ratios that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $ratios (map) Optionally use a custom map of ratios to set as css variables {CSS output} (code block) Custom properties for all public ratios in the map Example scss tools.$ratios: ( 'my-golden': 1.61803399, 'line-height': '#_major-third', ); html { @include tools.ratios--; } css compiled html { --ratio-my-golden: 1.61803399; --ratio-line-height: 1.25; } Requires $named-ratios $ratio-var-prefix (string) @mixin ratio--() Set a single custom property based on a ratio token, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $ratio: (*) Ratio name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $ratio $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $ratios (map) Optional map of ratios to use as a palette source Example scss tools.$ratios: ( 'my-golden': 1.61803399, 'line-height': '#_major-third', ); .example { @include tools.ratio--('my-golden'); @include tools.ratio--('gutter', 'line-height', 1.4em); } css compiled .example { --ratio-my-golden: 1.61803399; --ratio-gutter: var(--ratio-line-height, 1.4em); } Requires $named-ratios $ratio-var-prefix (string) @function var-ratio() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $ratio: (*) Ratio name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: (map) Optional Accoutrement map of ratios to use as source @return (string) CSS variable call, in the format: var(--, ) Example scss tools.$ratios: ( 'my-golden': 1.61803399, 'line-height': '#_major-third', ); .example { line-height: tools.var-ratio('line-height'); padding-bottom: calc(1 / #{tools.var-ratio('my-golden', 1.6)} * 100%); } css compiled .example { line-height: var(--ratio-line-height, 1.25); padding-bottom: calc(1 / var(--ratio-my-golden, 1.6) * 100%); } Requires @function var-token() $named-ratios $ratio-var-prefix (string)"},"ratios.html":{"filename":"ratios.html","title":"Built-In Ratios","contents":"Built-In Ratios Some built-in named ratios you can use, either directly or through the token syntax (where these values are provided with a _ prefix). Since 4.0.0: NEW: Now available as individual variables (without the _ prefix) Example scss @use 'ratio/named'; @each $name, $value in meta.module-variables('named') { /*! $#{$name}: #{$value}; */ } css compiled /*! $octave: 2; */ /*! $major-seventh: 1.875; */ /*! $minor-seventh: 1.7777777778; */ /*! $major-sixth: 1.6666666667; */ /*! $minor-sixth: 1.6; */ /*! $fifth: 1.5; */ /*! $augmented-fourth: 1.40625; */ /*! $fourth: 1.3333333333; */ /*! $major-third: 1.25; */ /*! $minor-third: 1.2; */ /*! $major-second: 1.125; */ /*! $minor-second: 1.0666666667; */ /*! $photo: 1.5; */ /*! $classic: 1.3333333333; */ /*! $widescreen: 1.7777777778; */ /*! $cinema: 2.39; */ /*! $golden: 1.61803399; */ Used By @function ratio() @mixin ratios--() @mixin ratio--() @function var-ratio()"},"scale-sizes.html":{"filename":"scale-sizes.html","title":"Size Maps","contents":"Scale Configuration $sizes (map) scss $sizes: ( 'root': $accoutrement-browser-default-font-size, ) !default; Defined a palette of common sizes to be used across your project, in the format “name: size” or “name: basis (ratio/function: value)”. If your map includes a px-comparable value for root, it will be used in relative-size unit conversions. Named sizes can contain length values (24px), reference to previously-defined sizes ('root'), a map of relative-adjustments using ratios (('_golden': 2)) and math functions (('plus': 2)), or a format-string & list for interpolating calc() values ('calc(%s + %s)' ('#root', 2vw)). Internal math functions are always available by name, but recent versions of Sass require you to capture 3rd-party functions using the get-function($name) syntax before calling them. To simplify your maps, we recommend using the $functions map to store captured functions in one place, where we can continue to retrieve them by name. Map Properties 'root': 16px (Map) Include a root font-size for your document, used for calculating relative sizes. This should match the size applied to your html element. Example scss $sizes: ( 'root': 24px, 'text': '#root' ('convert-units': 'em'), 'h1': '#root' ('times': 2), 'calc': 'calc(%s + %s)' ('%s': '#root' 2vw), ); Used By @function break() @mixin add-sizes() @function convert-units() @mixin add-sizes() Merge individual size maps into the global $sizes variable, in case you want to define sizes in smaller groups such as text-sizes, spacing-sizes, etc before merging them into a single global size-palette. This can be useful for internal organization, documentation with SassDoc, or integration with our pattern-library generator: Herman. Parameters & Output $maps: (map...) Pass any number of maps to be merged. {CSS output} (code block) An updated global $sizes variable, with new maps merged in. Example scss $text-sizes: ( 'root': 24px, 'h1': '#root' ('times': 2), ); @include tools.add-sizes($text-sizes); Requires @function multi-merge() $sizes (map) Accessing Sizes @function size() Access a named size in your $sizes map, using any comparable units. Since 1.0.0: BREAKING: The previous $units… vararg has been replaced with $do map argument, for flexible on-the-fly adjustments. Non-map $do values are converted to ('convert-units': $do) before processing, to provide a shortcut for unit-conversions. size('root', 'cm') will continue to work, but size('root', 'em', 10px) should be changed to size('root', 'em' 10px) (with all unit args in a single list) NEW: Accepts $source map argument, for custom source-palette Parameters & Return $size: (string) The name of any size in your configuration $do: null (map | unit-args | null) A map of function/ratio adjustments to run on the returned value, or a unit followed by any necessary arguments for conversion $source: $sizes (map) Optional accoutrement-format map of sizes to use as the origin palette @return (length) The calculated length, in the requested units. Requires @function compile() @function get() [private] Used By @function scale() @function negative() @mixin square() @function convert-units() @function negative() Return the inverse value of any length, in comparable units. Since 1.0.0: BREAKING: The previous $units… vararg has been replaced with $do map argument, for flexible on-the-fly adjustments. Non-map $do values are converted to ('convert-units': $do) before processing, to provide a shortcut for unit-conversions. size('root', 'cm') will continue to work, but size('root', 'em', 10px) should be changed to size('root', 'em' 10px) (with all unit args in a single list) NEW: Accepts $source map argument, for custom source-palette Parameters & Return $size: (string | length | list) The name of a size in your configuration (e.g. line-height), or a length to be converted into different units (e.g. 24px), or a base-size and adjustments to be made (e.g. 24px ('_minor-third': 2)). For the sake of consistent documentation, I recommend keeping adjustments in the configuration whenever possible. $do: null (map | unit-args | null) A map of function/ratio adjustments to run on the returned value, or a unit followed by any necessary arguments for conversion $source: $sizes (map) Optional accoutrement-format map of sizes to use as the origin palette @return (length) The calculated negative length, in the requested units. Requires @function size() @mixin square() Create a square by setting equal CSS height and width properties with the given size & unit value. Since 1.0.0: BREAKING: The previous $units… vararg has been replaced with $do map argument, for flexible on-the-fly adjustments. Non-map $do values are converted to ('convert-units': $do) before processing, to provide a shortcut for unit-conversions. size('root', 'cm') will continue to work, but size('root', 'em', 10px) should be changed to size('root', 'em' 10px) (with all unit args in a single list) NEW: Accepts $source map argument, for custom source-palette Parameters & Output $size: (string | length | list) The name of a size in your configuration (e.g. line-height), or a length to be converted into different units (e.g. 24px), or a base-size and adjustments to be made (e.g. 24px ('_minor-third': 2)). For the sake of consistent documentation, I recommend keeping adjustments in the configuration whenever possible. $do: null (map | unit-args | null) A map of function/ratio adjustments to run on the returned value, or a unit followed by any necessary arguments for conversion $source: $sizes (map) Optional accoutrement-format map of sizes to use as the origin palette {CSS output} (code block) Equal CSS height and width properties, set to the given size and units. Requires @function size()"},"scale-units.html":{"filename":"scale-units.html","title":"Unit Conversion","contents":"Converting Units @function convert-units() Convert lengths between comparable units. You can also convert to browser-ems, relative to the browser default rather than the site root – useful for media queries. Aliased as convert-units, convert, units, and to in all Accoutrement maps. Since 1.0.0: NEW: Aliased as to in accoutrement-maps Parameters & Return $length: (length | string) The length or named size to be converted. $to-unit: (string) The desired units to convert to. Some units (ch, vw, vh, vmin, vmax) cannot be converted. $from-context: false (length | string) When converting from relative units, the absolute length (in px) to which $length refers - e.g. for $lengths in em units, would normally be the font-size of the current element. false and null will resolve to your ‘root’ setting or 16px $to-context: $from-context (length | string) For converting to relative units, the absolute length in px to which the output value will refer. Defaults to the same as $from-context, since it is rarely needed. @error Context parameters must resolve to a value in pixel units Requires @function size() @function get-number() [private] @function get() [private] @function get-px() [private] @function error() [private] $sizes (map) $accoutrement-browser-default-font-size [private]"},"scale-vars.html":{"filename":"scale-vars.html","title":"Sizes » CSS Variables","contents":"Sizes » CSS Variables $size-var-prefix (string) scss $size-var-prefix: 'size-' !default; Since CSS variables are often defined in a global space, it can be useful to prefix different variable types. Accoutrement maps help solve that problem in Sass, so we wanted to carry that over into our CSS variable support. Set a prefix for all size-tokens, and we’ll apply it when setting or calling CSS variables based on your size maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$sizes: ('my-size': 3em); tools.$size-var-prefix: 'prefix_'; html { @include tools.size--('my-size') } css compiled html { --prefix_my-size: 3em; } Used By @mixin sizes--() @mixin size--() @function var-size() @mixin sizes--() Convert any size-map into CSS variables, using the global $size-var-prefix. Size names that start with _ or - are considered “private” and will not be output as variables Sizes that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $sizes (map) Optionally use a custom map of sizes to set as css variables {CSS output} (code block) Custom properties for all public sizes in the map Example scss tools.$sizes: ( '_root': 16px, 'rhythm': '#_root' ('times': 1.5), 'line': '#rhythm', ); html { @include tools.sizes--; } css compiled html { --size-rhythm: 24px; --size-line: var(--size-rhythm, 24px); } Requires $size-var-prefix (string) @mixin size--() Set a single custom property based on a map-size, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $size: (*) Size name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $size $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $sizes (map) Optional map of sizes to use as a palette source Example scss tools.$sizes: ( '_root': 16px, 'rhythm': '#_root' ('times': 1.5), 'line': '#rhythm', ); .example { @include tools.size--('line'); @include tools.size--('padding', 'line', 1.5rem); } css compiled .example { --size-line: var(--size-rhythm, 24px); --size-padding: var(--size-line, 1.5rem); } Requires $size-var-prefix (string) @function var-size() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $size: (*) Size name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: (map) Optional Accoutrement map of sizes to use as source @return (string) CSS variable call, in the format: var(--, ) Example scss tools.$sizes: ( '_root': 16px, 'rhythm': '#_root' ('times': 1.5), 'line': '#rhythm', ); .example { line-height: tools.var-size('line'); padding: tools.var-size('rhythm', 1.5em); } css compiled .example { line-height: var(--size-line, 24px); padding: var(--size-rhythm, 1.5em); } Requires @function var-token() $size-var-prefix (string)"},"scale.html":{"filename":"scale.html","title":"QuickStart: Scale","contents":"QuickStart: Scale Sass size & scale management tools: Gather all your sizes into a single map Generate new sizes based on modular scales or arbitrary functions Convert between relative units Access sizes on the fly Import If you already imported accoutrement/sass/tools you are ready to go. You can also import the scale module on its own: @use '/accoutrement/sass/scale'; Sizes & Ratios Establish your palette of ratios [modular scales] and sizes: $ratios: ( 'my-ratio': 1.25, ); $sizes: ( // define explicit values 'root': 24px, 'icons': 1em, 'page': 8in, // reference existing sizes 'text': '#root' // apply adjustments and conversions // using named-ratios or arbitrary functions 'rhythm': '#root' ('_fifth': 1, 'convert-units': 'rem'), 'h1': '#root' ('my-ratio': 3), 'h2': '#root' ('my-ratio': 2), 'h3': '#root' ('my-ratio': 1), // define calc() output based on existing sizes 'viewport-relative': 'calc(%s + %s)' ('%s': '#root' 2vw), ); Access your named sizes using the size() function, and even convert-units on-the-fly: .example { font-size('text'); width: size('page', 'px'); } @function scale() Apply a modular or linear scale to any value, moving up or down the scale by a given number of steps. (linear scaling is simple multiplication, and may not be particularly useful where the scale is known). Since 4.0.0: NEW: Provides direct access to scales, without needing to use the token map. Parameters & Return $value: (token | number) The original value to be scaled $ratio: (token | number | 'linear') The key-name or value of a ratio $steps: (number) The number of steps to move along a scale $source: ratio.$ratios (map) Optional accoutrement-format map of ratios to use as the origin palette (in addition to the provided defaults) @return (number) The scaled value. @error Ratio must be either a number or “linear” Example scss /* _widescreen: #{tools.scale(700px, '_widescreen')} */ /* 1.4: #{tools.scale(24px, 1.4, -1)} */ /* linear: #{tools.scale(16px, 'linear', 2)} */ css compiled /* _widescreen: 1244.4444444444px */ /* 1.4: 17.1428571429px */ /* linear: 32px */ Requires @function check() [private] @function size() @function error() [private] @function is-ratio()"},"token-api.html":{"filename":"token-api.html","title":"Accessing Tokens","contents":"Token Maps We use “token” as a generic term for named values inside accoutrement maps. In the following map, root and gutter are considered accoutrement-tokens: $map: ( 'root': 16px, 'gutter': 1em, ); Our core API provides token-map syntax parsing, and general token access with get-token() (below). Additional plugins provide shortcuts and utilities for managing and accessing common token-types, like colors, fonts, sizes, and animations. Internal Reference The core module provides a generic map-parsing syntax, for internal reference & adjustments – establishing dynamic relationships between map values. To reference another key in the same map, use the #tag hashtag format: // 'gutter' == 16px $map: ( 'root': 16px, 'gutter': '#root', ); Reference hashtags don’t have to stand alone, but can be embedded inside a longer string: // 'responsive' == calc(16px + 1vw) $map: ( 'root': 16px, 'scale': 1vw, 'responsive': 'calc(#root + #scale)', ); Nested References You can define nested tokens in accoutrement maps, and access them using a #first->second->third syntax: // 'large-screen->h2' == 24px $sizes: ( 'root': 16px, 'headings': ( 'h1': '#root' ('times': 2), 'h2': '#root' ('times': 1.5), ), 'pull-quote': '#headings->h2', ); All -> nested references are resolved relative to the outermost map: // 'large-screen->text' == 24px $map: ( 'root': 16px, 'large-screen': ( 'root': 24px, 'text': '#large-screen->root' ), ); Since 2.0.0: Functional Adjustments In many cases, we’ll want to reference a value and then make adjustments to it. The explicit long-hand syntax uses a map with '%value' as the first key. Each additional key provides a function name along with arguments for that function: // convert-units(16px, 'rem') $map: ( 'root': 16px, 'gutter': ( '%value': '#root', 'times': 1.5, 'convert-units': 'rem', ), ); You can also string together multiple functions, to create more complex relationships: // convert-units(times(16px, 1.5), 'rem') $map: ( 'root': 16px, 'gutter': ( '%value': '#root', 'times': 1.5, 'convert-units': 'rem', ), ); Each function in the function map (e.g. times & convert-units above) will be run in order – with any associated arguments included. The value is always passed as the first argument. Adjustment Shorthand We also provide a shorthand syntax to simplify adjustments in most cases. Here, the value is written first (any data type), and a map of adjustments can be provided at the end of the definition: $map: ( 'root': 16px, 'gutter': '#root' ('times': 1.5, 'convert-units': 'rem'), ); Adjustments with References Adjustment-function arguments can also reference keys in the map. In this example, we’re multiplying the root & line-height values to generate a rhythm token. $map: ( 'root': 16px, 'line-height': 1.4, 'rhythm': '#root' ('times': '#line-height'), ); String Interpolation For CSS features like calc() you can create format-strings and interpolate values into the string. Use %s as a placeholder, and call the interpolate (or %s) adjustment function with replacement values for each placeholder: $map: ( 'root': 16px, 'scale': 1vw, 'responsive': ( '%value': 'calc(%s + %s)', '%s': '#root' '#scale', ), ); Related @function interpolate() Nested Adjustments Since adjustment formats and values are parsed the same as any other value, it’s possible to build quite complex adjustments: $map: ( 'root': 16px, 'scale': 1vw, 'responsive': ( '%value': 'calc(%s + %s)', '%s': ( '#root' ('convert-units': 'rem'), '#scale' ('times': 2), ), ), ); Escaping References If you need to use the # character without creating an alias reference, you can prefix it with an (also-escaped) back-slash: 'this is \\\\#not-an-alias' If you need to end an alias without using punctuation or spaces, the same double-escape can be used: '#alias\\\\not-part-of--alias' Since 2.2.0: NEW: Added to help manage more complex missing-key options @function get() The primary function for accessing and parsing accoutrement map-syntax values. Each accoutrement plugin provides a shortcut function for the specific map associated with that data-type. You can do the same, or use it directly to turn any arbitrary map into an accoutrement map. Since 4.0.0: BREAKING: Name changed from get-token to get BREAKING: The $key value must be a token name for lookup, not a raw token value to be compiled (see the compile() function) Since 2.0.0: NEW: Handles access to nested-map tokens using the get-token($map, 'first->second->third') syntax Since 1.0.0: NEW: Accepts $do map argument, for on-the-fly adjustments Parameters & Return $map: (map) A map of token definitions to reference against $key: (*) A key to get from the map (can use nested key->subkey syntax) $do: (map | null) A map of functional adjustments to run on the returned value @return (*) The parsed value of any key in a given map Examples scss Access a map directly $map: ( 'original-value': 3em, 'new-value': '#original-value' ( 'times': 2, 'minus': 0.5 ), ); /*! New Value: #{tools.get($map, 'new-value')} */ css compiled /*! New Value: 5.5em */ scss Access nested-map tokens $map: ( 'outer': ( 'inner': 2, ), ); /*! Inner: #{tools.get($map, 'outer->inner')} */ css compiled /*! Inner: 2 */ scss Write your own shortcut plugin for specific maps @function get($key) { @return tools.get($my-map, $key); } $my-map: ('main': 32em); /*! Main: #{get('main')} */ css compiled /*! Main: 32em */ Requires @function lookup-alias() [private] @function compile-token() [private] @function set() [private] $_memo [private] @function compile() Allows you to compile arbitrary token values in reference to a map, without the initial step of referencing a single key. Since 4.0.0: NEW: Added to handle direct token parsing, without map-key lookup Parameters & Return $map: (map) A map of token definitions to reference against $token: (*) The original key to get from the map @return (*) The parsed value of any key in a given map Example scss Access a map directly $map: ( 'original-value': 3em, ); $token: '#original-value' ( 'times': 2, 'minus': 0.5 ); /*! New Value: #{tools.compile($map, $token)} */ css compiled /*! New Value: 5.5em */ Requires @function compile-token() [private] Used By @function color() @function break() @function size()"},"token-config.html":{"filename":"token-config.html","title":"Tokens Configuration","contents":"$handle-missing-keys (string | null) scss $handle-missing-keys: null !default; A configuration option to optionally trigger warnings or errors when a token is not found: null [default]: Will silently return null (mimicking the built-in Sass map.get() function) warn: Will also throw a warning error: Will throw an error, and stop compilation Since 4.0.0: BREAKING: Removed the silent option, to match built-in Sass map access behavior Since 2.2.0: NEW: Provides authors with more Sass-like behavior, and more options for managing or testing when a key lookup fails Author: James Camilleri Used By @function has-token() @function has-alias() [private] @function lookup-alias() [private]"},"token-inspect.html":{"filename":"token-inspect.html","title":"Inspecting Tokens","contents":"Inspecting Tokens Tools for inspecting accoutrement map token meta-data, useful for building more complicated logic for automation and integrations. @function is-private-token() Check if a token key is marked as private with _ or - as the starting character Since 2.0.0: NEW: Initial release Parameters & Return $key: (*) The token key to check for private prefix (only string and list keys can be marked as private) @return (boolean) True if the key is private, otherwise false Example scss /*! #{tools.is-private-token('_private-token')} */ /*! #{tools.is-private-token('public-token')} */ css compiled /*! true */ /*! false */ Used By @function var-contrast() @function is-alias-for() @mixin tokens--() @mixin import-webfonts() @function font-name() [private] @function is-alias-for() Find if a token is simply an alias, and (if so) what token it represents – either directly, or following the thread to it’s origin. Since 2.0.0: NEW: Initial release Parameters & Return $map: (map) A map of terms to reference against $token: (*) The token name to be traced $origin: false (*) False to trace the alias one step back, or true to trace an alias thread back to the original source token @return (*) false for non-alias tokens, or the name of an alias source (either one step back, or the full origin of multiple aliases) Example scss $colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand', 'border': '#text', 'outline': '#border', ); /*! _brand: #{tools.is-alias-for($colors, '_brand')} */ /*! text: #{tools.is-alias-for($colors, 'text')} (_brand is private) */ /*! border: #{tools.is-alias-for($colors, 'border')} */ /*! outline: #{tools.is-alias-for($colors, 'outline', $origin: true)} */ css compiled /*! _brand: false */ /*! text: false (_brand is private) */ /*! border: text */ /*! outline: text */ Requires @function get() [private] @function is-private-token() Used By @mixin token--() @mixin import-webfonts() @function font-name() [private] @function font-values() [private] @function has-token() Find if a token exists in a given map. Since 4.0.0: NEW: Provides a token-syntax-aware alternative to the Sass internal map.has-key() function. Parameters & Return $map: (map) A map of terms to reference against $token: (*) The token name or path (using ->) to lookup $nested...: (*) Optionally provide a nested token path as an arglist, rather than using the -> syntax. @return (boolean) Returns true if the requested token exists, or false if there is no token at the given path. Example scss $colors: ( 'brand': hsl(120, 50%, 50%), 'button': ( 'background': '#brand', ) ); /*! brand: #{tools.has-token($colors, 'brand')} */ /*! text: #{tools.has-token($colors, 'text')} */ /*! button->background: #{tools.has-token($colors, 'button->background')} */ /*! (button, background): #{tools.has-token($colors, 'button', 'background')} */ css compiled /*! brand: true */ /*! text: false */ /*! button->background: true */ /*! (button, background): true */ Requires @function lookup-alias() [private] $handle-missing-keys (string | null) Used By @function default-contrast() [private]"},"token-internal.html":{"filename":"token-internal.html","title":"Pre-Registered Functions","contents":"Registered Functions We provide a number of pre-registered functions to help with token management, including: All the built-in Sass modules, prefixed with the module name in a dot notation (e.g. 'list.index') All the Accoutrement utilities and individual module functions. A number of math helpers listed below… Example scss $sizes: ( 'text': 14px 16px 24px, 'small': '#text' ('list.nth': 1), 'medium': '#text' ('list.nth': 2), ); /*! small: #{tools.get($sizes, 'small')} */ /*! medium: #{tools.get($sizes, 'medium')} */ css compiled /*! small: 14px */ /*! medium: 16px */ @function plus() Add two values together in accoutrement maps. Direct access to this function is prefixed, but it is available in all accoutrement maps as 'plus', 'add', or '+'. Parameters & Return $num1: (string | length) The name or length of the size you are adding to $num2: (string | length) The name or length of the size being added @return (number) The calculated results of adding $num1 and $num2 Example scss $sizes: ( 'text': 16px, 'margin': 14px, 'spacer': '#text' ('plus': '#margin'), ); /*! spacer: #{tools.get($sizes, 'spacer')} */ css compiled /*! spacer: 30px */ @function minus() Subtract one value from another in accoutrement maps. Direct access to this function is prefixed, but it is available in all accoutrement maps as 'minus', 'subtract', or '-'. Parameters & Return $num1: (string | length) The name or length of the size you are subtracting from $num2: (string | length) The name or length of the size to subtract @return (number) The calculated results of subtracting $num2 from $num1 Example scss $sizes: ( 'text': 16px, 'margin': 14px, 'shim': '#text' ('minus': '#margin'), ); /*! shim: #{tools.get($sizes, 'shim')} */ css compiled /*! shim: 2px */ @function times() Multiplty two values in accoutrement maps. Direct access to this function is prefixed, but it is available in all accoutrement maps as 'times', 'multiply', or '*'. Parameters & Return $num1: (string | length) The name or length of the size you are multiplying $num2: (string | length) The name or length of the size to use as a multiple @return (number) The calculated results of multiplying $num1 by $num2 Example scss $sizes: ( 'text': 16px, 'double': '#text' ('times': 2), ); /*! double: #{tools.get($sizes, 'double')} */ css compiled /*! double: 32px */ @function divide() Divide two values in accoutrement maps. Direct access to this function is prefixed, but it is available in all accoutrement maps as 'divide', or '/'. Parameters & Return $num1: (string | length) The name or length of the size you are dividing $num2: (string | length) The name or length of the size to use as a division @return (number) The calculated results of dividing $num1 by $num2 Example scss $sizes: ( 'text': 16px, 'half': '#text' ('divide': 2), ); /*! half: #{tools.get($sizes, 'half')} */ css compiled /*! half: 8px */ @function modulo() Divide two values in accoutrement maps, and return the remainder. Direct access to this function is prefixed, but it is available in all accoutrement maps as 'modulo', 'remainder', 'mod', or '%'. Parameters & Return $num1: (string | length) The name or length of the size you are dividing $num2: (string | length) The name or length of the size to use as a division @return (number) The modulo of two numbers Example scss $sizes: ( 'text': 16px, 'mod': '#text' ('modulo': 3), ); /*! mod: #{tools.get($sizes, 'mod')} */ css compiled /*! mod: 1px */"},"token-register.html":{"filename":"token-register.html","title":"Function Registration","contents":"Function Registration Because Sass 3.5+ requires first-class functions, we provide tools for capturing functions and making them available to the Accoutrement map parser. This also provides the ability to alias functions as you like. $functions (map) scss $functions: () !default; We provide a single map to store & manage functions that you would like to use inside Accoutrement maps. $functions: ( 'inspect': meta.get-function('inspect', $module: 'meta'), ); Functions can be registered multiple times, under any aliases, but function maps are not able to use the alias syntax. Since 0.1.0: NEW: Supports the core map-reference syntax, for creating function aliases Map Properties : (function) Each alias key in the map should refer to a captured function Used By @function get() [private] @mixin register() @mixin register() Register functions with accoutrement. Parameters & Output $function: (function) The first-class function to be registered $names...: $function (strings) One or more alias names (strings) to use for map-access to the function {CSS output} (code block) {map} $_ACCOUTREMENT_APP - Functions are registered in a map under any number of aliases Requires @function set() [private] $functions (map)"},"token-vars.html":{"filename":"token-vars.html","title":"Tokens » Custom Properties","contents":"Tokens » Custom Properties There are many cases where it can be useful to convert a Sass token map into CSS custom properties. Here are some tools to help. @mixin token--() Set a single custom property based on a map-token, with optional alias, fallback, and prefixing Since 2.0.0: NEW: Initial release Parameters $map: (map) Accoutrement map of tokens to use as source $token: (*) Token name available in the source $map $value: null (string | null) Optional new value for the given token $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $prefix: null (string | null) Optional prefix used for naming token variables Example scss $colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('color.scale': ('lightness': -50%)), 'border': '#text', ); .example { @include tools.token--($colors, 'border'); @include tools.token--($colors, 'outline', 'border', red); } css compiled .example { --border: var(--text, #206020); --outline: var(--border, red); } Requires @function ident() @function is-alias-for() @function var-token() @function get() [private] Used By @mixin tokens--() @mixin tokens--() Convert any Accoutrement Tokens map into CSS custom properties (aka variables). Token names that start with _ or - are considered “private” and will not be output as variables Tokens that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $map: (map) Accoutrement map of tokens to set as css variables $prefix: null (string | null) Optional prefix for naming token variables {CSS output} (code block) Custom properties for all public tokens in the map Example scss $colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('color.scale': ('lightness': -50%)), 'border': '#text', ); html { @include tools.tokens--($colors, 'color-'); } css compiled html { --color-text: #206020; --color-border: var(--color-text, #206020); } Requires @mixin token--() @function is-private-token() @function var-token() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $map: (map) Accoutrement map of tokens to use as source $token: (*) Token name available in the source $map $fallback: true (*) The optional fallback value for a var() function: true will try to generate a fallback based on the color value A color name will fallback to the value of that css-variable and then to the color’s calculated value Any other fallback will be passed through unchanged $prefix: null (string | null) Optional prefix used for naming token variables @return (string) CSS variable call, in the format: var(--, ) Example scss $colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('color.scale': ('lightness': -50%)), 'border': '#text', ); .example { border-color: tools.var-token($colors, 'border'); color: tools.var-token($colors, 'text', black); } css compiled .example { border-color: var(--border, #206020); color: var(--text, black); } Requires @function ident() @function get() [private] Used By @function var-change() @function var-ease() @function var-time() @function var-color() @function var-ratio() @function var-size() @mixin token--() @function var-font()"},"tokens.html":{"filename":"tokens.html","title":"QuickStart: Tokens","contents":"QuickStart: Tokens Accoutrement tokens provide a custom syntax, using Sass Maps to define “tokens” of various types: $sizes: ( 'root': 16px, 'gutter': 1em, ); Tokens provide design abstractions, that can be easily reused across a product or design system. There are several reasons for this approach: Sass Maps provide a format that is readable by both humans & machines All related values are stored in a single variable, with explicit relationships intact We can build automation tools around meaningful token-groups, from font-imports to generated style guides Unlike YAML, JSON, and other object languages, Sass is a style language that understands the values involved, and provides specific tools for maintaining those values Note: We no longer use token maps internally at OddBird, since Sass “modules” now provide a way to group & namespace normal Sass variables in a meaningful way, and access module variables as a map. By relying on core Sass features, we avoid any confusion around the custom token syntax. Since 4.0.0: BREAKING: The $functions map no longer accepts alias references or any other aspects of the token syntax BREAKING: Ratios are no longer first-class adjustments (like functions) in the token syntax BREAKING: tokens.$handle-missing-keys defaults to null, and no longer supports the legacy silent option. BREAKING: get-token() is renamed get(), and only accepts bare token names (no # prefix), including the outer->inner nested token syntax. NEW: The new compile() function provides direct access to parse & resolve an arbitrary token value (including aliases with # prefix), rather than calling a specific token by name. NEW: All the built-in Sass module functions are registered by default, as . NEW: has-token() function checks a map to see if the given token is defined, and supports the outer->inner nested token syntax. Import If you already imported accoutrement/sass/tools you are ready to go. If you want to import the tokens alone: @import '/accoutrement/sass/tokens'; If you’re using Eyeglass, you can leave off most of the path: @import 'accoutrement/tokens'; Token Maps Using the map syntax, we can create named tokens for any related values: $colors: ( 'brand': rgb(13, 127, 165), 'text': black, ); We can also create alias tokens and explicit relationships, using a #token hashtag syntax: $colors: ( 'brand': rgb(13, 127, 165), 'accent': '#brand', 'text': '#accent' ('shade': 75%), ); Those relationships will be calculated at compile-time, using the token.get() function (or shortcut functions provided by plugins): html { color: token.get($colors, 'text'); } See Token Maps documentation for more detail. Tokens » CSS Variables CSS Variables provide a DOM-aware alternative to the pre-processed Sass variables we use to store tokens. Rather than using one or the other, we recommend defining tokens in Sass (where relationships can be stored in an abstract format), and then generating CSS Variables as-necessary. See CSS Variables documentation for more detail. Example scss $colors: ( '_brand': hsl(120, 50%, 50%), 'text': '#_brand' ('shade': 50%), 'border': '#text', ); html { // generate CSS Variables based on the map above… @include tools.tokens--($colors); // access CSS Variables with smart fallbacks… border-color: tools.var-token($colors, 'border'); color: tools.var-token($colors, 'text'); } css compiled html { --text: #206020; --border: var(--text, #206020); border-color: var(--border, #206020); color: var(--text, #206020); } Utility Functions We provide a set of built-in math, list, and string helpers – in addition to the functions defined in each module. You can also use the Sass core functions (with appropriate module prefixing), or register your own functions – giving them any alias you like. // Create a map of captured functions $functions: ( 'my-function': meta.get-function('my-function'), 'rgba': meta.get-function('rgba'), ); // Or add functions & aliases using the provided mixin: @include token.register('my-function', 'alias'); Once a function has been registered with accoutrement, it is available to call by name or alias in all token adjustment maps: @include token.register('rgba', 'fade'); $colors: ( 'brand': hsl(120, 50%, 50%), 'background': '#brand' ('fade': 50%), );"},"type-a11y.html":{"filename":"type-a11y.html","title":"Accessibility","contents":"Accessibility A simple set of utilities for handling text-visibility and screen-reader accessibility across your site. @mixin is-hidden() Hide an element using either the clip or position method. Parameters $method: 'clip' ('clip' | 'position') The hiding method to use. Requires @mixin _is-hidden-position() [private] @mixin _is-hidden-clip() [private]"},"type-font-vars.html":{"filename":"type-font-vars.html","title":"Fonts » CSS Variables","contents":"Fonts » CSS Variables $font-var-prefix (string) scss $font-var-prefix: 'font-' !default; Since CSS variables are often defined in a global space, it can be useful to prefix different variable types. Accoutrement maps help solve that problem in Sass, so we wanted to carry that over into our CSS variable support. Set a prefix for all font-tokens, and we’ll apply it when setting or calling CSS variables based on your font maps. Set to null or '' (empty string) for no prefix. Since 2.0.0: NEW: Initial release Example scss tools.$fonts: ( 'my-font': ( 'stack': (arial, helvetica, sans-serif), ) ); $font-var-prefix: 'prefix_'; html { @include tools.font--('my-font') } css compiled html { --font-my-font: my-font, arial, helvetica, sans-serif; } Used By @mixin fonts--() @mixin font--() @function var-font() @mixin fonts--() Convert any font-map into CSS variables, using the global $font-var-prefix. Font names that start with _ or - are considered “private” and will not be output as variables Fonts that contain a simple alias with no adjustments will be output with a var() value, keeping the alias relationship intact Since 2.0.0: NEW: Initial release Parameters & Output $source: $fonts (map) Optionally use a custom map of fonts to set as css variables $use: 'stack' (string | list) Font-map value (such as ‘name’ or ‘stack’) to use as custom-property values {CSS output} (code block) Custom properties for all public fonts in the map Example scss $fonts: ( '_TestFont': ( 'name': 'My Test Font', 'stack': ('Georgia', 'serif'), ), 'text': '#_TestFont', 'sans': '#text', ); html { @include tools.fonts--; } Requires @function font-values() [private] $font-var-prefix (string) @mixin font--() Set a single custom property based on a map-font, with optional alias and fallback Since 2.0.0: NEW: Initial release Parameters $font: (*) Font name available in the $source map, or alias to use in naming the CSS variable $value: null (string | null) Optional value for the variable, if different from the given $font $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that CSS variable and then to the token’s calculated value Any other fallback will be passed through unchanged $use: 'stack' (string | list) Font-map value (such as ‘name’ or ‘stack’) to use as custom-property values $source: $fonts (map) Optional map of fonts to use as a palette source Example scss tools.$fonts: ( '_TestFont': ( 'name': 'My Test Font', 'stack': ('Georgia', 'serif'), ), 'text': '#_TestFont', 'sans': '#text', ); .example { @include tools.font--('text'); @include tools.font--('headline', 'sans', sans-serif); } css compiled .example { --font-text: \"My Test Font\", Georgia, serif; --font-headline: var(--font-sans, sans-serif); } Requires @function font-values() [private] $font-var-prefix (string) @function var-font() Access the CSS variable associated with a given token, along with a fallback value based on the token itself Since 2.0.0: NEW: Initial release Parameters & Return $font: (*) Font name available in the $source map $fallback: true (*) The optional fallback value for a var() function: true will generate a fallback based on the token value A token name will fallback to the value of that css-variable and then to the token’s calculated value Any other fallback will be passed through unchanged $source: $fonts (map) Optional Accoutrement map of fonts to use as source $use: 'stack' (string | list) Font-map value (such as ‘name’ or ‘stack’) to use as custom-property values @return (string) CSS variable call, in the format: var(--, ) Example scss $fonts: ( '_TestFont': ( 'name': 'My Test Font', 'stack': ('Georgia', 'serif'), ), 'text': '#_TestFont', 'sans': '#text', ); .example { font-family: tools.var-font('sans', sans-serif); } css compiled .example { font-family: var(--font-sans, sans-serif); } Requires @function font-values() [private] @function var-token() $font-var-prefix (string)"},"type-fonts.html":{"filename":"type-fonts.html","title":"Font Maps","contents":"WebFonts Webfont configuration is most useful for handling any font that requires @font-face importing – locally-hosted files, base64 data, etc. But collecting all your font data in a single location allows us to automate various actions: @font-face imports, font-family fallback stacks, font aliases (for semantic access), or even documentation and font-specimens with a tool like Herman. We provide options for maintaining various font-types, from locally-hosted, to base64 embedded, and even CDN imports from sites like typekit and google fonts. $font-path (string) scss $font-path: '' !default; The path to your fonts directory, often relative to your output CSS. This base-path will be added to the start of every relative font-path given in your $fonts map - an optional shortcut to keep from writing long and repetitive paths for every font. Since type-4.0.0: BREAKING: The default changed from '../fonts/' to '' – so that no path is added unless explicitly requested. Example scss $font-path: '../fonts/'; Used By @function font-url() $fonts (map) scss $fonts: () !default; A map for managing all your fonts on a project. By storing this font data in map format, we can automate @font-face imports, call fonts with a semantic access-key, define fallback font-stacks, and generate font specimens with a tool like Herman. All the provided tools will ignore unknown font properties, so you can safely include any extra data you need access to. For example, we often include a source property in our font maps, providing a link to the font foundry, license, or CDN. If you are using Herman to font previews, it will include source links in the output. Since 3.0.0: NEW: Supports display map key for setting CSS font-display property Since 0.1.0: NEW: Supports 'bold italic' weight/style syntax in addition to ('bold', 'italic') BREAKING: Full support for the core map-reference syntax, not just font-name alias reference Since type-4.0.0: BREAKING: Remove the $font-formats variable, and replaced it with a formats property in each individual font map BREAKING: No longer accepts regular as a font-variant, use the CSS-friendly normal instead NEW: Allow explicit configuration maps for each font variant, to support variant-specific local and svgid options, along with the ability to specify explicit urls for each format desired The old string value will be treated the same as a map with only 'path' defined NEW: Supports unicode-range CSS property, as described on MDN Map Properties : (map) Give each font a key for access in the code, with a nested map defining the font details. .name: (string) The actual name of the font-face, if it’s different from the given . .stack: (list) A list of fallback fonts for browsers that can’t load the given webfont. .formats: (list) A list of font formats (e.g. 'woff2' 'eot') to use when interpolating font-file paths for font-face imported fonts. .unicode-range: (list) Optionally import only specific unicode ranges. See MDN unicode-range documentation for details. .display: (string) Optionally set the font-display property when importing web fonts. See MDN font-display documentation for details. .: (string | map) When describing locally-hosted or data-embedded fonts, provide a key for each font-variant to import. Multi-word variants can be written as a list (600 'italic') or a string ('600 italic'). In the simplest use-case, this value can be a string: a generic path to the appropriate font-files ('path/to/my-font-bold') with file-extensions removed. We’ll add extensions for you, based on the formats setting. For more control over individual variants and formats, we also accept a map value. See the .. property below… ..path: (list) An optional string defining the font-path to interpolate for each given formats. This is the same as providing a string variant-path. ..local: (list) A list of names (strings) to use for local() font-src values. ..svgid: (list) Fragment identifier for svg fonts, to be appended on relevant import URLs. ..: (list) Optionally provide individual font-path overrides, or base64 data-URIs for specific formats. Examples scss Defining a font for import $fonts: ( 'sans': ( 'name': 'Museo Sans', 'stack': ('Helvetica', 'Arial', 'sans-serif'), 'formats': ('woff2', 'woff', 'ttf'), 'normal': 'museosans-regular-filename', 'bold': 'museosans-bold-filename', 'bold' 'italic': 'museosans-bolditalic-filename', 'unicode-range': (U+0000-00FF, U+0131, U+0152-0153, U+02C6), 'display': 'swap', // safely document any additional font data you want… 'source': 'https://www.fontspring.com/fonts/exljbris/museo-sans', ), ); scss Creating a secondary font alias // Create alias keys to provide more semantic naming as-needed. $fonts: ( 'body-font': '#sans', ); scss Setting explicit format-paths $fonts: ( 'sans': ( 'name': 'Museo Sans', 'stack': ('Helvetica', 'Arial', 'sans-serif'), 'bold': ( 'woff2': 'museosans-bold-woff2-path', 'svg': 'museosans-bold-svg-path', 'svgid': '#museosans', ), 'bold' 'italic': ( 'woff2': 'museosans-bolditalic-woff2-path', 'svg': 'museosans-bolditalic-svg-path.svg#museosans-bolditalic', ), ), ); scss Base64 data-uri’s and local() src $fonts: ( 'uri-font': ( 'name': 'My Font', 'stack': ('Helvetica', 'Arial', 'sans-serif'), 'normal': ( 'local': ('My Font', 'my-font-regular'), 'woff2': 'data:application/font-woff2;charset=utf-8;base64,…', ), 'bold': ( 'local': ('My Font Bold', 'my-font-bold'), 'woff2': 'data:application/font-woff2;charset=utf-8;base64,…', ), ), ); Used By @mixin add-font() @mixin add-font() In order to keep our $fonts map more manageable, we define individual map variables for each font, and use a mixin to merge them together into our global $fonts configuration. This can be useful for internal organization, documentation with SassDoc, or integration with a pattern-library generator like Herman. Parameters & Output & Return $key: (map) Give your font a semantic access-key for easy reference across your project. $map: (map) Map of font-data to be added at the given key. {CSS output} (code block) An updated global $fonts variable, with new maps merged in. @error Font key already exists. Rename or $force to continue Example scss $franklin: ( 'name': 'FranklinGothic', 'stack': ('Helvetica', 'Arial', 'sans-serif'), ); @include tools.add-font('heading', $franklin); Requires @function get() [private] @function error() [private] $fonts (map) Using WebFonts Once you’ve configured your webfont data into a map, these tools will help you access the data in various ways: from creating @font-face imports, to calling font-families by any given alias. @function font() Retrieve and normalize font data from the $fonts map Since 2.0.0: BREAKING: Non-map fonts are interpreted as font-stacks BREAKING: Normalized font-data uses proper name-quotation, and ignores missing or private names/stacks Since 1.0.0: NEW: Provided to access and normalize a map of font data for any key in your global $fonts map NEW: Accepts $source map argument, for custom source-palette Parameters & Return $font: (*) A key for accessing the desired font in $fonts $source: $fonts (map) Optional accoutrement-format map of fonts to use as the origin palette @return (map) A parsed and normalized map of font-data Requires @function get() [private] Used By @function font-family() @mixin font-face() @function font-values() [private] @function font-family() Access a font-family from your $fonts map, with name and font-stack. Since 1.0.0: NEW: Accepts $source map argument, for custom source-palette Since type-4.0.0: BUGFIX: Provides the correct name for fonts when an alias is given Parameters & Return $key: (string) The key-name of a font in your $fonts map. $source: $fonts (map) Optional accoutrement-format map of fonts to use as the origin palette @return (String) The full font-stack for the given font, ready for output with the font-family property. Example scss $fonts: ( 'sans': ( 'name': 'FranklinGothic', 'stack': (Helvetica, Arial, sans-serif), ), ); html { font-family: tools.font-family('sans'); } css compiled html { font-family: sans; } Requires @function font() @function get() [private] Used By @mixin font-family() @mixin font-family() Output a font-stack to font-family based on your $fonts configuration. Since 1.0.0: NEW: Accepts $source map argument, for custom source-palette Parameters $key: (string) The key-name of a font in your $fonts map. $source: $fonts (map) Optional accoutrement-format map of fonts to use as the origin palette Example scss $fonts: ( 'FranklinGothic': ( 'stack': (Helvetica, Arial, sans-serif), ), 'sans': '#FranklinGothic', ); html { @include tools.font-family('sans'); } css compiled html { font-family: sans; } Requires @function font-family() @mixin font-face() Import any local webfont defined in your $fonts configuration (variants without a path will not be imported). Since 3.0.0: NEW: Supports display setting in font-maps Since 1.0.0: NEW: Accepts $source map argument, for custom source-palette Since type-4.0.0: BREAKING: No longer accepts the $formats parameter Parameters & Output $key: (string) The key-name of a font in your $fonts map $source: $fonts (map) Optional accoutrement-format map of fonts to use as the origin palette {CSS output} (code block) @font-face import blocks for any defined font-variants. Example scss $fonts: ( 'body-font': ( 'name': 'Source Sans Pro', 'formats': 'woff2' 'woff' 'eot', 'normal': 'sans/sourcesanspro-regular-webfont', 'italic': 'sans/sourcesanspro-italic-webfont', 'bold': 'sans/sourcesanspro-bold-webfont', ), ); @include tools.font-face('body-font'); Requires @function font() @function font-get-variants() [private] @function get() [private] Used By @mixin import-webfonts() @mixin import-webfonts() Find all the fonts that include data for imports, and generate @font-face blocks for each individual font and variant. Since 2.0.0: NEW: Accepts $source parameter, which uses global $fonts by default BREAKING: No longer imports private fonts, but will import a direct alias of the private font Since 1.0.0: BREAKING: No longer accepts the $fonts parameter Since type-4.0.0: BREAKING: No longer accepts the $formats parameter Parameters & Output $source: $fonts (map) Optional accoutrement-format map of fonts to use as the origin palette {CSS output} (code block) Any number of @font-face blocks. Example scss $fonts: ( 'body-font': ( 'name': 'Source Sans Pro', 'formats': 'woff2' 'woff' 'eot', 'normal': 'sans/sourcesanspro-regular-webfont', 'italic': 'sans/sourcesanspro-italic-webfont', 'bold': 'sans/sourcesanspro-bold-webfont', ), // alias keys, and fonts without path data will be ignored… 'alias': '#body-font', 'google-font': ( 'source': 'https://fonts.google.com/', ), ); @include tools.import-webfonts; Requires @mixin font-face() @function is-alias-for() @function is-private-token()"},"type-helpers.html":{"filename":"type-helpers.html","title":"Type Helpers","contents":"@function font-url() This is a wrapper for the CSS url() function, which simply prepends the global $font-path when appropriate. Since type-4.0.0: BUGFIX: Supports Base64 data URI’s, without prepending font-path Parameters & Return $path: (string) A path relative to the fonts directory. @return (string) The full path to a font file, in CSS url('my/path') format. Example scss tools.$font-path: '../fonts/'; $src: tools.font-url('sans/my-sans-font.woff2'); /* #{$src} */ css compiled /* url(\"../fonts/sans/my-sans-font.woff2\") */ Requires $font-path (string) Used By @function font-src() [private] @mixin import-font-face() [private]"},"type-pseudo.html":{"filename":"type-pseudo.html","title":"Pseudo Elements","contents":"Pseudo-Elements Some shortcuts for creating ::before and ::after pseudo-elements. @mixin before() Add generated content :before an element. Parameters $content: (String) A value for the content property. @mixin after() Add generated content :after an element. Parameters $content: (String) A value for the content property. @mixin wrap-content() Add generated content :before and :after an element. Parameters $content: (List) One or two values to be used for the content property. A single string will be used :before and :after."},"type.html":{"filename":"type.html","title":"QuickStart: Type","contents":"QuickStart: Type Sass typography and webfont helpers. Gather all your fonts into a single map Access fonts by name Automate webfont imports from a CDN, or relative font files Also includes helpers for accessibility and pseudo-elements. Import If you already imported accoutrement/sass/tools you are ready to go. You can also import the type module on its own: @use '/accoutrement/sass/type'; Webfont Configuration // Set the a path to your fonts directory $font-path: '../fonts/'; $fonts: ( // describe locally-hosted font files for import and access 'heading': ( 'name': 'maven', 'stack': ('helvetica', 'arial', sans-serif), 'formats': 'woff' 'ttf', 'normal': 'maven/maven_pro_regular-webfont', 'bold': 'maven/maven_pro_bold-webfont', ), // describe CDN fonts for access 'body': ( 'name': 'Source Sans Pro', 'stack': ('Helvetica Neue', 'Helvetica', 'Arial', sans-serif), ), // provide aliases when useful 'alias': '#body', ); Import WebFonts Import one font at a time with font-face() or all your local webfonts with import-webfonts(): // Import one font by configuration key @include font-face('body'); // Import all local fonts @include import-webfonts; Set your font-family anywhere, using the semantic names you defined earlier: html { @include font-family('body'); } h1, h2, h3 { @include font-family('heading'); }"},"utils.html":{"filename":"utils.html","title":"Sass Maps, Lists, & Strings","contents":"Sass Utilities We use a number of Sass utilities to help manage strings, maps, and lists. As more functions are added to the Sass core, we hope to be able to remove some or all of these over time. Sass Lists Utility function(s) that extend the Sass core modules, to help with advanced list manipulation. @function remove-nth() Remove any item (1-indexed) from a list. This function has a list- prefix added by default (eg list-remove-nth()) unless it’s imported directly. However, it’s available in all accoutrement maps as 'remove-nth'. Parameters & Return $list: (list) The original list to be edited $index: (number) The 1-indexed item to remove from the list @return (list) The original list, with item removed @error $index must be a non-zero integer @error $index is too large for the list length Example scss $map: ( 'main-start': ['nav-end' 'main-start' 'footer-start'], 'small-start': '#main-start' ('remove-nth': 1), ); /*! #{inspect(tools.get($map, 'small-start'))} */ css compiled /*! [\"main-start\" \"footer-start\"] */ Requires @function template() [private] @function error() [private] Used By @function normalize-token() [private] @function has-alias() [private] @function lookup-alias() [private] Sass Maps Utility function(s) that extend the Sass core modules, to help with advanced map manipulation. @function multi-merge() Merge multiple maps into a single map, in case you want to define tokens in smaller groups – such as brand-colors, text-colors, etc. – before merging them into a single map. This function has a map- prefix added by default (eg map-multi-merge()) unless it’s imported directly. Parameters & Return $maps: (maps...) Pass any number of maps to be merged. @return (map) The merged map of easings. Requires @function check() [private] @function error() [private] Used By @mixin add-changes() @mixin add-easing() @mixin add-times() @mixin add-colors() @mixin add-ratios() @mixin add-sizes() Sass Strings Utility function(s) that extend the Sass core modules, to help with advanced string manipulation. @function replace() Replace a substring inside a larger string, or replace the entirety of the string. This function has a str- prefix added by default (eg str-replace()) unless it’s imported directly. However, it’s available in all accoutrement maps as either 'replace' or 'str-replace'. Since 1.0.0: NEW: Improved handling of non-string values, allows you to replace a number within a string, for example Parameters & Return $string: (string | list) The original string (or list of strings) to edit $old: (*) A sub-string to replace $new: '' (*) A new sub-string to replace the old $all: false (boolean) If true, replace all instances of $old in $string @return (string) Original string, with substring replaced Example scss // sass treats calc() as a string, // so we can use string-functions to manipulate calc values… $map: ( 'text-size': calc(1em + 1vw), 'large-text': '#text-size' ('str-replace': '1vw' '3vw'), ); /*! #{tools.get($map, 'large-text')} */ css compiled /*! calc(1em + 3vw) */ Requires @function error() [private] @function template() [private] @function force() [private] Used By @function has-alias() [private] @function interpolate() @function ident() @function interpolate() Return a string with interpolated values replacing %s placeholders in a format string. This function has a str- prefix added by default (eg str-interpolate()) unless it’s imported directly. However, it’s available in all accoutrement maps as either 'interpolate', 'str-interpolate', or '%s'. Parameters & Return $string: (string) The original string to be edited $values...: (*) New strings, to replace the %s format strings @return (string) Original string, with %s format strings replaced @error Too many interpolation values given for the string Example scss // sass treats calc() as a string, // so we can use string-functions to manipulate calc values… $map: ( 'root': 16px, 'responsive': 'calc(%s + %s)' ('%s': '#root' 0.5vw), ); /*! #{tools.get($map, 'responsive')} */ css compiled /*! calc(16px + 0.5vw) */ Requires @function check() [private] @function error() [private] @function replace() @function split() Splits a string into a list of strings, using the same logic as JavaScript’s split() method. This function has a str- prefix added by default (eg str-split()) unless it’s imported directly. However, it’s available in all accoutrement maps as either 'str-split' or 'split'. Since 1.0.0: NEW: Aliased as str-split Parameters & Return $string: (string) The original string to be split Empty strings will be returned as a list of one empty string $separator: null (*) The string will be split on any instance of the separator, and the separators will be removed Null or unfound separators will return a single-item list with the original string Empty-string ('') separators will return a list of all characters in the original string Non-string separators will be converted to strings before splitting $limit: null (integer | null) Maximum length of the returned list @return (list) Space-delimited list of string-slices from the original string Example scss $map: ( 'list': 'hello world' ('split': ' '), ); /*! #{tools.get($map, 'list')} */ css compiled /*! hello world */ Requires @function force() [private] Used By @function font-get-variants() [private] @function font-stack() [private] @function variant-name() [private] @function has-alias() [private] @function lookup-alias() [private] @function trim() Trims whitespace from the start and end of a string. This function has a str- prefix added by default (eg str-trim()) unless it’s imported directly. However, it’s available in all accoutrement maps as either 'str-trim' or 'trim'. Since 1.0.0: NEW: Strips whitespace NEW: Aliased as str-trim Parameters & Return $string: (string) The original string to be trimmed @return (string) Trimmed string Example scss $map: ( // null value is needed for single-argument functions… 'trim': ' hello world ' ('trim': null), ); /*! #{tools.get($map, 'trim')} */ css compiled /*! hello world */ Requires @function check() [private] @function error() [private] Used By @function font-stack() [private]"},"vars.html":{"filename":"vars.html","title":"CSS Custom Properties","contents":"CSS Custom Properties CSS variables are a useful way to manage values that might change in relation to the DOM – something that Sass variables cannot do. In many cases, we find it helpful to manage variables in Sass, and output CSS properties as-needed. These tools help integrate Sass variables with CSS custom properties, to keep that relationship intact. @function ident() Formats any string (like a Sass variable or token name) as a CSS “dashed-ident” that can be used for CSS custom properties. Spaces are replaced with a dash, and an optional prefix can be added, in the format --. Since 4.0.0: NEW: Provided publicly as ident() Since 2.0.0: NEW: Initial private release as _a_var-name() Parameters $name: (string) The name of the token to be used as a variable $prefix: null (string | null) Optional prefix added to the token name Example scss $colors: ( 'brand': mediumvioletred, 'action': teal, ); html { @each $name, $value in $colors { #{tools.ident($name, 'colors-')}: #{$value}; } } css compiled html { --colors-brand: mediumvioletred; --colors-action: teal; } Requires @function replace() Used By @function var-contrast() @mixin token--() @function var-token() @mixin custom-props() @mixin custom-props() Converts a map of variable names and values into CSS custom properties, in the format --: . This can be used with manually-generated maps, but we can also use the Sass module-variables function to generate a map of all the variables in a given module: @use 'accoutrement/tools'; @use 'sass:meta'; @use '_my-colors'; $my-colors: meta.module-variables('_my-colors'); html { @include tools.custom-props($my-colors, 'colors-'); } Since 4.0.0: NEW: Initial release Parameters & Output $map: (string) A map of keys and values to be converted into custom properties $prefix: null (string | null) Optional prefix added to each property name {CSS output} (code block) Custom properties for every key/value pair in a map. Example scss $colors: ( 'brand': mediumvioletred, 'action': teal, ); html { @include tools.custom-props($colors, 'colors-'); } css compiled html { --colors-brand: mediumvioletred; --colors-action: teal; } Requires @function ident()"}}} \ No newline at end of file diff --git a/docs/search.html b/docs/search.html index 011fc343..b5aeb65d 100644 --- a/docs/search.html +++ b/docs/search.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/token-api.html b/docs/token-api.html index 16d075f1..2bed6804 100644 --- a/docs/token-api.html +++ b/docs/token-api.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/token-config.html b/docs/token-config.html index 4d827394..d63d7e71 100644 --- a/docs/token-config.html +++ b/docs/token-config.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/token-inspect.html b/docs/token-inspect.html index 00d0f447..74c3c286 100644 --- a/docs/token-inspect.html +++ b/docs/token-inspect.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/token-internal.html b/docs/token-internal.html index bb8ea114..0b7902f3 100644 --- a/docs/token-internal.html +++ b/docs/token-internal.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/token-register.html b/docs/token-register.html index e1100d9f..eaeb4911 100644 --- a/docs/token-register.html +++ b/docs/token-register.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/token-vars.html b/docs/token-vars.html index 691a72b7..c7aebac2 100644 --- a/docs/token-vars.html +++ b/docs/token-vars.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/tokens.html b/docs/tokens.html index 0f9a1d44..22bd2f95 100644 --- a/docs/tokens.html +++ b/docs/tokens.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/type-a11y.html b/docs/type-a11y.html index 3b4a5301..00f4ef98 100644 --- a/docs/type-a11y.html +++ b/docs/type-a11y.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/type-font-vars.html b/docs/type-font-vars.html index 65957db6..4594cf01 100644 --- a/docs/type-font-vars.html +++ b/docs/type-font-vars.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/type-fonts.html b/docs/type-fonts.html index 756cf1e3..da24e8f8 100644 --- a/docs/type-fonts.html +++ b/docs/type-fonts.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/type-helpers.html b/docs/type-helpers.html index 69bb9032..43743659 100644 --- a/docs/type-helpers.html +++ b/docs/type-helpers.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/type-pseudo.html b/docs/type-pseudo.html index 73997d82..71e21701 100644 --- a/docs/type-pseudo.html +++ b/docs/type-pseudo.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/type.html b/docs/type.html index c0b7d7b6..fd5ec614 100644 --- a/docs/type.html +++ b/docs/type.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/utils.html b/docs/utils.html index 3256b4f9..ec50d36d 100644 --- a/docs/utils.html +++ b/docs/utils.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/docs/vars.html b/docs/vars.html index f9f13ff2..c1a8ebba 100644 --- a/docs/vars.html +++ b/docs/vars.html @@ -42,7 +42,7 @@
Accoutrement - 4.0.0-beta.1 + 4.0.0-beta.2
diff --git a/package.json b/package.json index ca29d2c1..0ea6824d 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "accoutrement", "title": "Accoutrement", - "version": "4.0.0-beta.1", + "version": "4.0.0-beta.2", "description": "Sass design-systems management and utilities.", "homepage": "https://www.oddbird.net/accoutrement/", "type": "module", diff --git a/sass/_tools.scss b/sass/_tools.scss index ece2acde..037614cb 100644 --- a/sass/_tools.scss +++ b/sass/_tools.scss @@ -1,10 +1,14 @@ +// general tools @forward 'utils'; -@forward 'tokens'; @forward 'vars'; +@forward 'tokens'; @forward 'ratio'; +// data modules @forward 'animate'; @forward 'color'; -@forward 'layout'; @forward 'scale'; @forward 'type'; + +// relies on scale +@forward 'layout'; diff --git a/sass/color/_contrast-vars.scss b/sass/color/_contrast-vars.scss new file mode 100644 index 00000000..8b2d2865 --- /dev/null +++ b/sass/color/_contrast-vars.scss @@ -0,0 +1,132 @@ +@use '../internal/function'; +@use '../tokens' as api; +@use '../vars'; +@use 'contrast'; +@use 'css-vars' as cv; +@use 'sass:map'; +@use 'sass:meta'; + +// Var-Contrast +// ------------ +/// An extension of the `contrast` function, +/// designed to output CSS variables +/// rather than simple color values. +/// +/// @group color-contrast +/// @since 2.1.0 - +/// - NEW: Provides access to contrast colors as CSS-variables, when defined +/// @example scss - max contrast / no variable names +/// tools.$colors: ( +/// 'background': blue, +/// 'light': #eee, +/// 'dark': #111, +/// ); +/// html { +/// color: tools.var-contrast( +/// 'background', +/// 'light', 'dark', black, white +/// ); +/// } +/// @example scss - min contrast / variable names +/// tools.$colors: ( +/// 'background': blue, +/// 'light': #eee, +/// 'dark': #111, +/// ); +/// html { +/// color: tools.var-contrast( +/// 'background', +/// 'light', 'dark', black, white, +/// 'AAA' +/// ); +/// } +/// +/// @param {string | list} $color - +/// The name or value of a color. +/// @param {colors | min-contrast} $options... - +/// List of colors to contrast against. +/// This function will choose the best contrast +/// of all the options provided, +/// or the `contrast-light` and `contrast-dark` defaults +/// defined in your color palette or the factory settings. +/// +/// - Any `{'AA' | 'AA-large' | 'AAA' | 0-21 }` values +/// will be treated as a minimum color-contrast ratio – +/// and will return the minimum accessible option, +/// rather than the maximum contrast. +/// @return {color | var()} - +/// CSS Variable for the color-option +/// that has the highest contrast-ratio to `$color`, +/// or the color if no variable exists. +@function var-contrast($color, $options...) { + $contrast: contrast.best-contrast($color, $options); + $name: map.get($contrast, 'name'); + $color: map.get($contrast, 'color'); + + @if ($name != $color) and not api.is-private-token($name) { + $name: vars.ident($name, cv.$color-var-prefix); + @return var($name, $color); + } + + @return $color; +} +@include function.internal(meta.get-function('var-contrast'), 'var-contrast'); + +// Var Contrasted +// -------------- +/// Apply any background color as a CSS variable, +/// along with the highest-contrast text color from a set of options. +/// This works the same as the `var-contrast` function, +/// but applies the resulting values to `background-color` +/// and text `color` properties. +/// +/// @group color-contrast +/// @since 2.1.0 - +/// - NEW: Applies contrasting colors as CSS-variables, when defined +/// @example scss - max contrast +/// tools.$colors: ( +/// 'background': blue, +/// 'light': #eee, +/// 'dark': #111, +/// ); +/// html { +/// @include tools.var-contrasted( +/// 'background', +/// 'light', 'dark', black, white +/// ); +/// } +/// @example scss - min contrast +/// tools.$colors: ( +/// 'background': blue, +/// 'light': #eee, +/// 'dark': #111, +/// ); +/// html { +/// @include tools.var-contrasted( +/// 'background', +/// 'light', 'dark', black, white, +/// 'AAA' +/// ); +/// } +/// +/// @param {string | list} $background - +/// The name or value of your desired background color. +/// @param {colors | min-contrast} $options... - +/// List of colors to contrast against. +/// This function will choose the best contrast +/// of all the options provided, +/// or the `contrast-light` and `contrast-dark` defaults +/// defined in your color palette or the factory settings. +/// +/// - Any `{'AA' | 'AA-large' | 'AAA' | 0-21 }` values +/// will be treated as a minimum color-contrast ratio – +/// and will return the minimum accessible option, +/// rather than the maximum contrast. +/// @output - +/// Sets the `background-color` to `$background` +/// and the foreground `color` to +/// whichever option has better contrast against the given background. +@mixin var-contrasted($background, $options...) { + background-color: cv.var-color($background); + color: var-contrast($background, $options...); +} diff --git a/sass/color/_contrast.scss b/sass/color/_contrast.scss index cd17a6c4..165d21e1 100644 --- a/sass/color/_contrast.scss +++ b/sass/color/_contrast.scss @@ -2,11 +2,9 @@ @use '../internal/type'; @use '../internal/throw'; @use '../tokens' as api; -@use '../vars'; @use '../utils'; @use 'config'; @use 'tokens'; -@use 'css-vars' as cv; @use 'sass:color'; @use 'sass:list'; @use 'sass:math'; @@ -87,72 +85,6 @@ $_wcag-contrast: ( } @include function.internal(meta.get-function('contrast'), 'contrast'); -// Var-Contrast -// ------------ -/// An extension of the `contrast` function, -/// designed to output CSS variables -/// rather than simple color values. -/// -/// @group color-contrast -/// @since 2.1.0 - -/// - NEW: Provides access to contrast colors as CSS-variables, when defined -/// @example scss - max contrast / no variable names -/// tools.$colors: ( -/// 'background': blue, -/// 'light': #eee, -/// 'dark': #111, -/// ); -/// html { -/// color: tools.var-contrast( -/// 'background', -/// 'light', 'dark', black, white -/// ); -/// } -/// @example scss - min contrast / variable names -/// tools.$colors: ( -/// 'background': blue, -/// 'light': #eee, -/// 'dark': #111, -/// ); -/// html { -/// color: tools.var-contrast( -/// 'background', -/// 'light', 'dark', black, white, -/// 'AAA' -/// ); -/// } -/// -/// @param {string | list} $color - -/// The name or value of a color. -/// @param {colors | min-contrast} $options... - -/// List of colors to contrast against. -/// This function will choose the best contrast -/// of all the options provided, -/// or the `contrast-light` and `contrast-dark` defaults -/// defined in your color palette or the factory settings. -/// -/// - Any `{'AA' | 'AA-large' | 'AAA' | 0-21 }` values -/// will be treated as a minimum color-contrast ratio – -/// and will return the minimum accessible option, -/// rather than the maximum contrast. -/// @return {color | var()} - -/// CSS Variable for the color-option -/// that has the highest contrast-ratio to `$color`, -/// or the color if no variable exists. -@function var-contrast($color, $options...) { - $contrast: best-contrast($color, $options); - $name: map.get($contrast, 'name'); - $color: map.get($contrast, 'color'); - - @if ($name != $color) and not api.is-private-token($name) { - $name: vars.ident($name, cv.$color-var-prefix); - @return var($name, $color); - } - - @return $color; -} -@include function.internal(meta.get-function('var-contrast'), 'var-contrast'); - // Contrasted // ---------- /// Apply any background color, @@ -213,65 +145,6 @@ $_wcag-contrast: ( color: contrast($background, $options...); } -// Var Contrasted -// -------------- -/// Apply any background color as a CSS variable, -/// along with the highest-contrast text color from a set of options. -/// This works the same as the `var-contrast` function, -/// but applies the resulting values to `background-color` -/// and text `color` properties. -/// -/// @group color-contrast -/// @since 2.1.0 - -/// - NEW: Applies contrasting colors as CSS-variables, when defined -/// @example scss - max contrast -/// tools.$colors: ( -/// 'background': blue, -/// 'light': #eee, -/// 'dark': #111, -/// ); -/// html { -/// @include tools.var-contrasted( -/// 'background', -/// 'light', 'dark', black, white -/// ); -/// } -/// @example scss - min contrast -/// tools.$colors: ( -/// 'background': blue, -/// 'light': #eee, -/// 'dark': #111, -/// ); -/// html { -/// @include tools.var-contrasted( -/// 'background', -/// 'light', 'dark', black, white, -/// 'AAA' -/// ); -/// } -/// -/// @param {string | list} $background - -/// The name or value of your desired background color. -/// @param {colors | min-contrast} $options... - -/// List of colors to contrast against. -/// This function will choose the best contrast -/// of all the options provided, -/// or the `contrast-light` and `contrast-dark` defaults -/// defined in your color palette or the factory settings. -/// -/// - Any `{'AA' | 'AA-large' | 'AAA' | 0-21 }` values -/// will be treated as a minimum color-contrast ratio – -/// and will return the minimum accessible option, -/// rather than the maximum contrast. -/// @output - -/// Sets the `background-color` to `$background` -/// and the foreground `color` to -/// whichever option has better contrast against the given background. -@mixin var-contrasted($background, $options...) { - background-color: cv.var-color($background); - color: var-contrast($background, $options...); -} - // Contrast Ratio // -------------- /// Compare two colors using the WCAG comparison algorithm, diff --git a/sass/color/_index.scss b/sass/color/_index.scss index 882f7136..f1efa94d 100644 --- a/sass/color/_index.scss +++ b/sass/color/_index.scss @@ -15,6 +15,7 @@ @forward 'utils'; @forward 'themes'; @forward 'css-vars'; +@forward 'contrast-vars'; /// ## Import /// diff --git a/sass/layout/_z-index.scss b/sass/layout/_z-index.scss index c118fdf2..cd7120f6 100644 --- a/sass/layout/_z-index.scss +++ b/sass/layout/_z-index.scss @@ -23,7 +23,7 @@ /// ); /// /// @type list -$z-index: (); +$z-index: () !default; // Z-Index [function] // ------------------ diff --git a/sass/scale/_index.scss b/sass/scale/_index.scss index 055222e4..a57e74be 100644 --- a/sass/scale/_index.scss +++ b/sass/scale/_index.scss @@ -8,10 +8,10 @@ /// @group scale @forward 'config'; -@forward 'units' show convert-units; @forward 'size'; @forward 'scale'; @forward 'css-vars'; +@forward 'units' show convert-units; /// ## Import /// If you already imported `accoutrement/sass/tools` you are ready to go. diff --git a/test/color/_contrast-vars.scss b/test/color/_contrast-vars.scss new file mode 100644 index 00000000..e653e3d4 --- /dev/null +++ b/test/color/_contrast-vars.scss @@ -0,0 +1,46 @@ +@use '../../node_modules/sass-true/sass/true' as *; +@use '../../sass/color/contrast-vars' as contrast; +@use '../../sass/color/tokens'; +@use '../../sass/color/css-vars' as vars; +@use 'test-data' as data; + +$_old: tokens.$colors; +tokens.$colors: data.$colors; + +@include test-module('color/contrast-vars') { + // var-contrast [function] + // ----------------------- + @include describe('var-contrast [function]') { + @include it('Returns a contrasting CSS variable when available') { + @include assert-equal( + contrast.var-contrast('blue', 'dark', 'light'), + var(--color-dark, #111) + ); + } + + @include it('Returns a contrasting color when no variable') { + @include assert-equal(contrast.var-contrast('blue', #111, #eee), #111); + } + } + + // var-contrasted [function] + // ------------------------- + @include describe('var-contrasted [function]') { + @include it( + 'Creates a background and contrasting color with CSS variables' + ) { + @include assert { + @include output { + @include contrast.var-contrasted('blue', 'light', 'dark'); + } + + @include expect { + background-color: vars.var-color('blue'); + color: vars.var-color('dark'); + } + } + } + } +} // end module + +tokens.$colors: $_old; diff --git a/test/color/_contrast.scss b/test/color/_contrast.scss index c167fcbb..4bbca209 100644 --- a/test/color/_contrast.scss +++ b/test/color/_contrast.scss @@ -1,7 +1,6 @@ @use '../../node_modules/sass-true/sass/true' as *; @use '../../sass/color/contrast'; @use '../../sass/color/tokens'; -@use '../../sass/color/css-vars' as vars; @use 'test-data' as data; @use 'sass:map'; @use 'sass:list'; @@ -416,40 +415,6 @@ tokens.$colors: data.$colors; } } } - - // var-contrast [function] - // ----------------------- - @include describe('var-contrast [function]') { - @include it('Returns a contrasting CSS variable when available') { - @include assert-equal( - contrast.var-contrast('blue', 'dark', 'light'), - var(--color-dark, #111) - ); - } - - @include it('Returns a contrasting color when no variable') { - @include assert-equal(contrast.var-contrast('blue', #111, #eee), #111); - } - } - - // var-contrasted [function] - // ------------------------- - @include describe('var-contrasted [function]') { - @include it( - 'Creates a background and contrasting color with CSS variables' - ) { - @include assert { - @include output { - @include contrast.var-contrasted('blue', 'light', 'dark'); - } - - @include expect { - background-color: vars.var-color('blue'); - color: vars.var-color('dark'); - } - } - } - } } // end module tokens.$colors: $_old; diff --git a/test/color/_index.scss b/test/color/_index.scss index 8e0c6329..775d2034 100644 --- a/test/color/_index.scss +++ b/test/color/_index.scss @@ -3,3 +3,4 @@ @forward 'utils'; @forward 'themes'; @forward 'css-vars'; +@forward 'contrast-vars'; diff --git a/test/index.scss b/test/index.scss index e2483aee..71b6aae2 100644 --- a/test/index.scss +++ b/test/index.scss @@ -1,7 +1,30 @@ @use '../sass/internal/throw' with ( $catch-errors: true ); -@use '../sass/tools'; +@use '../sass/tools' with ( + $contrast-light: white, + $contrast-dark: black, + $colors: (), + $ratios: (), + $sizes: (), + $functions: (), + $easing: (), + $times: (), + $changes: (), + $breakpoints: (), + $z-index: (), + $fonts: (), + $font-path: '', + $size-var-prefix: 'size-', + $ratio-var-prefix: 'ratio-', + $color-var-prefix: 'color-', + $easing-var-prefix: 'ease-', + $time-var-prefix: 'time-', + $change-var-prefix: 'change-', + $font-var-prefix: 'font-', + $adjust-query-overlap: 'max', + $handle-missing-keys: null +); // tests… @use 'internal';