@equinor/eds-tokens 0.9.2 → 1.0.0-beta-2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (26) hide show
  1. package/README.md +82 -6
  2. package/build/css/index-trimmed.css +3 -0
  3. package/build/css/index-verbose.css +5 -0
  4. package/build/css/spacing/comfortable-trimmed.css +270 -0
  5. package/build/css/spacing/comfortable-verbose.css +270 -0
  6. package/build/css/spacing/primitives.css +227 -0
  7. package/build/css/spacing/spacing-trimmed.css +270 -0
  8. package/build/css/spacing/spacing-verbose.css +270 -0
  9. package/build/css/spacing/spacious-trimmed.css +270 -0
  10. package/build/css/spacing/spacious-verbose.css +270 -0
  11. package/build/css/spacing-setup.css +15 -0
  12. package/build/css/variables-trimmed.css +280 -0
  13. package/build/css/variables-trimmed.min.css +1 -0
  14. package/build/css/variables-verbose.css +504 -0
  15. package/build/css/variables-verbose.min.css +1 -0
  16. package/dist/esm/base/clickbounds.mjs +1 -1
  17. package/dist/esm/base/colors.mjs +1 -1
  18. package/dist/esm/base/elevation.mjs +1 -1
  19. package/dist/esm/base/index.mjs +8 -8
  20. package/dist/esm/base/interactions.mjs +1 -1
  21. package/dist/esm/base/shape.mjs +1 -1
  22. package/dist/esm/base/spacings.mjs +1 -1
  23. package/dist/esm/base/typography.mjs +1 -1
  24. package/dist/tokens.cjs +15 -15
  25. package/dist/types/types/index.d.ts +1 -1
  26. package/package.json +42 -14
package/README.md CHANGED
@@ -1,15 +1,11 @@
1
1
  # @equinor/eds-tokens
2
2
 
3
- [Design tokens] used in the Equinor Design System (EDS), such as colours, typography, spacings etc…
3
+ [Design tokens] used in the Equinor Design System (EDS), such as colours, spacings and typography.
4
4
 
5
5
  ## Installation
6
6
 
7
7
  ```sh
8
- npm install @equinor/eds-tokens
9
- ```
10
- If you use Typescript, make sure you have typescript >= 3.8 as a devDependency:
11
- ```sh
12
- npm install typescript --save-dev
8
+ pnpm add @equinor/eds-tokens
13
9
  ```
14
10
 
15
11
  ## Usage
@@ -29,3 +25,83 @@ import { tokens } from '@equinor/eds-tokens'
29
25
  - Typography (`ot`, `woff` or `woff2` font required)
30
26
 
31
27
  [design tokens]: https://css-tricks.com/what-are-design-tokens/
28
+
29
+
30
+ # Sync variables in Figma to tokens in code
31
+
32
+ This repository contains a couple of GitHub Actions workflows:
33
+
34
+ - Sync tokens to Figma
35
+ - Sync Figma variables to tokens
36
+
37
+ These workflows demonstrate bi-directional syncing between variables in Figma and design tokens in a codebase using Figma's [Variables REST API](https://www.figma.com/developers/api#variables). For more background and a graphical representation of what these workflows do, see our [Syncing design systems using Variables REST API](https://www.figma.com/community/file/1270821372236564565) FigJam file.
38
+
39
+ To use these workflows, you should copy the code in this repository into your organization and modify it to suit the needs of your design processes.
40
+
41
+ ## Prerequisites
42
+
43
+ To use the "Sync Figma variables to tokens" workflow, you must be a full member of an Enterprise org in Figma. To use the "Sync tokens to Figma" workflow, you must also have an editor seat.
44
+
45
+ Both workflows assume that you have a single Figma file with local variable collections, along with one or more tokens json files in the `tokens/` directory that adhere\* to the [draft W3C spec for Design Tokens](https://tr.designtokens.org/format/). For demonstration purposes, this directory contains the tokens exported from the [Get started with variables](https://www.figma.com/community/file/1253086684245880517/Get-started-with-variables) Community file. Have a copy of this file ready if you want to try out the workflow with these existing tokens.
46
+
47
+ > \*See `src/token_types.ts` for more details on the format of the expected tokens json files, including the deviations from the draft design tokens spec we've had to make. **We expect there to be one tokens file per variable collection and mode.**
48
+
49
+ In addition, you must also have a [personal access token](https://www.figma.com/developers/api#access-tokens) for the Figma API to allow these workflows to authenticate with the API. For the "Sync Figma variables to tokens" workflow, the token must have at least the Read-only Variables scope selected. For the "Sync tokens to Figma" workflow, the token must have the Read and write Variables scope selected.
50
+
51
+ ## Usage
52
+
53
+ Before running either of these workflows, you'll need to create an [encrypted secret](https://docs.github.com/en/actions/security-guides/encrypted-secrets#creating-encrypted-secrets-for-a-repository) in your repository named `GH_ACTION_VARIABLES_SYNC_FIGMA_TOKEN` containing your personal access token.
54
+
55
+ Both workflows are configured to [run manually](https://docs.github.com/en/actions/using-workflows/manually-running-a-workflow) for demonstration purposes, and are designed to be as conservative as possible in their functionality (see details below).
56
+
57
+ ### Sync Figma variables to tokens
58
+
59
+ To run the "Sync Figma variables to tokens" workflow:
60
+
61
+ - Open the workflow under the **Actions** tab in your repository and click **Run workflow**
62
+ - You will be asked to provide the file key of the Figma file. The file key can be obtained from any Figma file URL: `https://www.figma.com/file/{file_key}/{title}`.
63
+ - After the workflow finishes, you should see a new pull request if there are changes to be made to the tokens files in the `tokens/` directory. If there are no changes to be made, then a pull request will not be created.
64
+
65
+ This workflow has some key behaviors to note:
66
+
67
+ - After generating the new tokens json files, this workflow creates a pull request for someone on the team to review. If you prefer, you can modify the workflow to commit directly to a designated branch without creating a pull request.
68
+ - If a variable collection or mode is removed from the Figma file, the corresponding tokens file will not be removed from the codebase.
69
+
70
+ ### Sync tokens to Figma
71
+
72
+ To run the "Sync tokens to Figma" workflow:
73
+
74
+ - Open the workflow under the **Actions** tab in your repository and click **Run workflow**
75
+ - You will be asked to provide the file key of the Figma file. The file key can be obtained from any Figma file URL: `https://www.figma.com/file/{file_key}/{title}`. Note: if you are trying out this workflow for the first time, use a file that is separate from your design system to avoid any unintended changes.
76
+ - After the workflow finishes, open the file in Figma and observe that the variables should be updated to reflect the tokens in your tokens files.
77
+
78
+ This workflow has some key behaviors to note:
79
+
80
+ - Though this workflow is configured to run manually, you're free to modify it to run on code push to a specified branch once you are comfortable with its behavior.
81
+ - When syncing to a Figma file that does not have any variable collections, this workflow will add brand-new collections and variables. When syncing to a Figma file that has existing variable collections, this workflow will modify collections and variables **in-place** using name matching. That is, it will look for existing collections and variables by name, modify their properties and values if names match, and create new variables if names do not match.
82
+ - The workflow will not remove variables or variable collections that have been removed in your tokens files.
83
+ - When mapping aliases to existing local variables, we assume that variable names are unique _across all collections_ in the Figma file. Figma allows duplicate variable names across collections, so you should make sure that aliases don't have naming conflicts in your file.
84
+ - For optional Figma variable properties like scopes and code syntax, the workflow will not modify these properties in Figma if the tokens json files do not contain those properties.
85
+ - If a string variable is bound to a text node content in the same file, and the text node uses a [shared font in the organization](https://help.figma.com/hc/en-us/articles/360039956774), that variable cannot be updated and will result in a 400 response.
86
+
87
+ ## Local development
88
+
89
+ You can run the GitHub actions locally by running `pnpm install` and creating a `.env` file.
90
+
91
+ Example:
92
+ ```
93
+ PERSONAL_ACCESS_TOKEN="your_personal_access_token"
94
+ ```
95
+
96
+ [How to create your personal access token](https://www.figma.com/developers/api#access-tokens)
97
+
98
+ and then running:
99
+
100
+ ```sh
101
+ # Defaults to writing to the tokens directory
102
+ pnpm run update-tokens
103
+
104
+ # and / or
105
+
106
+ pnpm run update-figma
107
+ ```
package/build/css/index-trimmed.css ADDED
@@ -0,0 +1,3 @@
1
+ /*@import 'color/theme-trimmed.css';*/
2
+ @import 'spacing-setup.css';
3
+ @import 'spacing/spacing-trimmed.css';
package/build/css/index-verbose.css ADDED
@@ -0,0 +1,5 @@
1
+ /*@import 'color/primitives.css';
2
+ @import 'color/theme-verbose.css';*/
3
+ @import 'spacing-setup.css';
4
+ @import 'spacing/primitives.css';
5
+ @import 'spacing/spacing-verbose.css';
package/build/css/spacing/comfortable-trimmed.css ADDED
@@ -0,0 +1,270 @@
1
+ /**
2
+ * Do not edit directly
3
+ */
4
+
5
+ [data-density="comfortable"] {
6
+ --eds-spacing-icon-xs-gap-horizontal: 0.344rem;
7
+ --eds-spacing-icon-xs-gap-vertical: 0.344rem;
8
+ --eds-spacing-icon-sm-gap-horizontal: 0.406rem;
9
+ --eds-spacing-icon-sm-gap-vertical: 0.406rem;
10
+ --eds-spacing-icon-md-gap-horizontal: 0.469rem;
11
+ --eds-spacing-icon-md-gap-vertical: 0.469rem;
12
+ --eds-spacing-icon-lg-gap-horizontal: 0.531rem;
13
+ --eds-spacing-icon-lg-gap-vertical: 0.531rem;
14
+ --eds-spacing-icon-xl-gap-horizontal: 0.625rem;
15
+ --eds-spacing-icon-xl-gap-vertical: 0.625rem;
16
+ --eds-spacing-icon-2xl-gap-horizontal: 0.719rem;
17
+ --eds-spacing-icon-2xl-gap-vertical: 0.719rem;
18
+ --eds-spacing-icon-3xl-gap-horizontal: 0.813rem;
19
+ --eds-spacing-icon-3xl-gap-vertical: 0.813rem;
20
+ --eds-spacing-icon-4xl-gap-horizontal: 0.938rem;
21
+ --eds-spacing-icon-4xl-gap-vertical: 0.938rem;
22
+ --eds-spacing-icon-5xl-gap-horizontal: 1.094rem;
23
+ --eds-spacing-icon-5xl-gap-vertical: 1.094rem;
24
+ --eds-spacing-icon-6xl-gap-horizontal: 1.25rem;
25
+ --eds-spacing-icon-6xl-gap-vertical: 1.25rem;
26
+ --eds-spacing-inline-4-xs: 0.063rem;
27
+ --eds-spacing-inline-3-xs: 0.125rem;
28
+ --eds-spacing-inline-2-xs: 0.25rem;
29
+ --eds-spacing-inline-xs: 0.375rem;
30
+ --eds-spacing-inline-sm: 0.5rem;
31
+ --eds-spacing-inline-md: 0.75rem;
32
+ --eds-spacing-inline-lg: 1rem;
33
+ --eds-spacing-inline-xl: 1.25rem;
34
+ --eds-spacing-inline-2-xl: 1.5rem;
35
+ --eds-spacing-inline-3-xl: 1.75rem;
36
+ --eds-spacing-stack-4-xs: 0.063rem;
37
+ --eds-spacing-stack-3-xs: 0.125rem;
38
+ --eds-spacing-stack-2-xs: 0.25rem;
39
+ --eds-spacing-stack-xs: 0.375rem;
40
+ --eds-spacing-stack-sm: 0.5rem;
41
+ --eds-spacing-stack-md: 0.75rem;
42
+ --eds-spacing-stack-lg: 1rem;
43
+ --eds-spacing-stack-xl: 1.25rem;
44
+ --eds-spacing-stack-2-xl: 1.5rem;
45
+ --eds-spacing-stack-3-xl: 1.75rem;
46
+ --eds-spacing-border-radius-rounded: 0.188rem;
47
+ --eds-spacing-border-radius-pill: 62.5rem;
48
+ --eds-spacing-border-radius-none: 0rem;
49
+ --eds-spacing-inset-xs-inline: 0.375rem;
50
+ --eds-spacing-inset-xs-stack-squished: 0.25rem;
51
+ --eds-spacing-inset-xs-stack-squared: 0.375rem;
52
+ --eds-spacing-inset-xs-stack-stretched: 0.5rem;
53
+ --eds-spacing-inset-sm-inline: 0.5rem;
54
+ --eds-spacing-inset-sm-stack-squished: 0.375rem;
55
+ --eds-spacing-inset-sm-stack-squared: 0.5rem;
56
+ --eds-spacing-inset-sm-stack-stretched: 0.75rem;
57
+ --eds-spacing-inset-md-inline: 0.75rem;
58
+ --eds-spacing-inset-md-stack-squished: 0.5rem;
59
+ --eds-spacing-inset-md-stack-squared: 0.75rem;
60
+ --eds-spacing-inset-md-stack-stretched: 1rem;
61
+ --eds-spacing-inset-lg-inline: 1rem;
62
+ --eds-spacing-inset-lg-stack-squished: 0.75rem;
63
+ --eds-spacing-inset-lg-stack-squared: 1rem;
64
+ --eds-spacing-inset-lg-stack-stretched: 1.25rem;
65
+ --eds-spacing-inset-xl-inline: 1.25rem;
66
+ --eds-spacing-inset-xl-stack-squished: 1rem;
67
+ --eds-spacing-inset-xl-stack-squared: 1.25rem;
68
+ --eds-spacing-inset-xl-stack-stretched: 1.5rem;
69
+ --eds-sizing-icon-xs: 0.875rem;
70
+ --eds-sizing-icon-sm: 1rem;
71
+ --eds-sizing-icon-md: 1.125rem;
72
+ --eds-sizing-icon-lg: 1.25rem;
73
+ --eds-sizing-icon-xl: 1.5rem;
74
+ --eds-sizing-icon-2xl: 1.75rem;
75
+ --eds-sizing-icon-3xl: 2rem;
76
+ --eds-sizing-icon-4xl: 2.313rem;
77
+ --eds-sizing-icon-5xl: 2.625rem;
78
+ --eds-sizing-icon-6xl: 3rem;
79
+ --eds-sizing-selectable-xs: 1rem;
80
+ --eds-sizing-selectable-sm: 1.25rem;
81
+ --eds-sizing-selectable-md: 1.5rem;
82
+ --eds-sizing-selectable-lg: 2.25rem;
83
+ --eds-sizing-selectable-xl: 2.75rem;
84
+ --eds-sizing-selectable-2xl: 3.25rem;
85
+ --eds-sizing-stroke-thin: 0.063rem;
86
+ --eds-sizing-stroke-thick: 0.125rem;
87
+ --eds-sizing-stroke-none: 0rem;
88
+ --eds-typography-ui-body-xs-font-size: 0.563rem;
89
+ --eds-typography-ui-body-xs-tracking-tight: -0.99px;
90
+ --eds-typography-ui-body-xs-tracking-normal: 0px;
91
+ --eds-typography-ui-body-xs-tracking-loose: 0.99px;
92
+ --eds-typography-ui-body-xs-font-weight-lighter: 300;
93
+ --eds-typography-ui-body-xs-font-weight-normal: 400;
94
+ --eds-typography-ui-body-xs-font-weight-bolder: 500;
95
+ --eds-typography-ui-body-xs-lineheight-default: 0.75rem;
96
+ --eds-typography-ui-body-xs-lineheight-squished: 0.75rem;
97
+ --eds-typography-ui-body-sm-font-size: 0.656rem;
98
+ --eds-typography-ui-body-sm-tracking-tight: -1.15px;
99
+ --eds-typography-ui-body-sm-tracking-normal: 0px;
100
+ --eds-typography-ui-body-sm-tracking-loose: 1.15px;
101
+ --eds-typography-ui-body-sm-font-weight-lighter: 300;
102
+ --eds-typography-ui-body-sm-font-weight-normal: 400;
103
+ --eds-typography-ui-body-sm-font-weight-bolder: 500;
104
+ --eds-typography-ui-body-sm-lineheight-default: 1rem;
105
+ --eds-typography-ui-body-sm-lineheight-squished: 0.75rem;
106
+ --eds-typography-ui-body-font-family: "Inter";
107
+ --eds-typography-ui-body-md-font-size: 0.75rem;
108
+ --eds-typography-ui-body-md-tracking-tight: -1.32px;
109
+ --eds-typography-ui-body-md-tracking-normal: 0px;
110
+ --eds-typography-ui-body-md-tracking-loose: 1.32px;
111
+ --eds-typography-ui-body-md-font-weight-lighter: 300;
112
+ --eds-typography-ui-body-md-font-weight-normal: 400;
113
+ --eds-typography-ui-body-md-font-weight-bolder: 500;
114
+ --eds-typography-ui-body-md-lineheight-default: 1rem;
115
+ --eds-typography-ui-body-md-lineheight-squished: 0.75rem;
116
+ --eds-typography-ui-body-lg-font-size: 0.875rem;
117
+ --eds-typography-ui-body-lg-tracking-tight: -1.54px;
118
+ --eds-typography-ui-body-lg-tracking-normal: 0px;
119
+ --eds-typography-ui-body-lg-tracking-loose: 1.54px;
120
+ --eds-typography-ui-body-lg-font-weight-lighter: 300;
121
+ --eds-typography-ui-body-lg-font-weight-normal: 400;
122
+ --eds-typography-ui-body-lg-font-weight-bolder: 500;
123
+ --eds-typography-ui-body-lg-lineheight-default: 1.25rem;
124
+ --eds-typography-ui-body-lg-lineheight-squished: 1rem;
125
+ --eds-typography-ui-body-xl-font-size: 1rem;
126
+ --eds-typography-ui-body-xl-tracking-tight: -1.76px;
127
+ --eds-typography-ui-body-xl-tracking-normal: 0px;
128
+ --eds-typography-ui-body-xl-tracking-loose: 1.76px;
129
+ --eds-typography-ui-body-xl-font-weight-lighter: 300;
130
+ --eds-typography-ui-body-xl-font-weight-normal: 400;
131
+ --eds-typography-ui-body-xl-font-weight-bolder: 500;
132
+ --eds-typography-ui-body-xl-lineheight-default: 1.5rem;
133
+ --eds-typography-ui-body-xl-lineheight-squished: 1.25rem;
134
+ --eds-typography-ui-body-2xl-font-size: 1.156rem;
135
+ --eds-typography-ui-body-2xl-tracking-tight: -1.76px;
136
+ --eds-typography-ui-body-2xl-tracking-normal: 0px;
137
+ --eds-typography-ui-body-2xl-tracking-loose: 2.035px;
138
+ --eds-typography-ui-body-2xl-font-weight-lighter: 300;
139
+ --eds-typography-ui-body-2xl-font-weight-normal: 400;
140
+ --eds-typography-ui-body-2xl-font-weight-bolder: 500;
141
+ --eds-typography-ui-body-2xl-lineheight-default: 1.5rem;
142
+ --eds-typography-ui-body-2xl-lineheight-squished: 1.25rem;
143
+ --eds-typography-ui-body-3xl-font-size: 1.313rem;
144
+ --eds-typography-ui-body-3xl-tracking-tight: -2.31px;
145
+ --eds-typography-ui-body-3xl-tracking-normal: 0px;
146
+ --eds-typography-ui-body-3xl-tracking-loose: 2.31px;
147
+ --eds-typography-ui-body-3xl-font-weight-lighter: 300;
148
+ --eds-typography-ui-body-3xl-font-weight-normal: 400;
149
+ --eds-typography-ui-body-3xl-font-weight-bolder: 500;
150
+ --eds-typography-ui-body-3xl-lineheight-default: 1.75rem;
151
+ --eds-typography-ui-body-3xl-lineheight-squished: 1.5rem;
152
+ --eds-typography-ui-body-4xl-font-size: 1.531rem;
153
+ --eds-typography-ui-body-4xl-tracking-tight: -2.695px;
154
+ --eds-typography-ui-body-4xl-tracking-normal: 0px;
155
+ --eds-typography-ui-body-4xl-tracking-loose: 2.695px;
156
+ --eds-typography-ui-body-4xl-font-weight-lighter: 300;
157
+ --eds-typography-ui-body-4xl-font-weight-normal: 400;
158
+ --eds-typography-ui-body-4xl-font-weight-bolder: 500;
159
+ --eds-typography-ui-body-4xl-lineheight-default: 2rem;
160
+ --eds-typography-ui-body-4xl-lineheight-squished: 1.75rem;
161
+ --eds-typography-ui-body-5xl-font-size: 1.75rem;
162
+ --eds-typography-ui-body-5xl-tracking-tight: -3.08px;
163
+ --eds-typography-ui-body-5xl-tracking-normal: 0px;
164
+ --eds-typography-ui-body-5xl-tracking-loose: 3.08px;
165
+ --eds-typography-ui-body-5xl-font-weight-lighter: 300;
166
+ --eds-typography-ui-body-5xl-font-weight-normal: 400;
167
+ --eds-typography-ui-body-5xl-font-weight-bolder: 500;
168
+ --eds-typography-ui-body-5xl-lineheight-default: 2rem;
169
+ --eds-typography-ui-body-5xl-lineheight-squished: 1.75rem;
170
+ --eds-typography-ui-body-6xl-font-size: 2rem;
171
+ --eds-typography-ui-body-6xl-tracking-tight: -3.52px;
172
+ --eds-typography-ui-body-6xl-tracking-normal: 0px;
173
+ --eds-typography-ui-body-6xl-tracking-loose: 3.52px;
174
+ --eds-typography-ui-body-6xl-font-weight-lighter: 300;
175
+ --eds-typography-ui-body-6xl-font-weight-normal: 0px;
176
+ --eds-typography-ui-body-6xl-font-weight-bolder: 500;
177
+ --eds-typography-ui-body-6xl-lineheight-default: 2.25rem;
178
+ --eds-typography-ui-body-6xl-lineheight-squished: 2rem;
179
+ --eds-typography-header-xs-font-size: 0.656rem;
180
+ --eds-typography-header-xs-tracking-tight: -0.99px;
181
+ --eds-typography-header-xs-tracking-normal: 0px;
182
+ --eds-typography-header-xs-tracking-loose: 0.99px;
183
+ --eds-typography-header-xs-font-weight-lighter: 300;
184
+ --eds-typography-header-xs-font-weight-normal: 400;
185
+ --eds-typography-header-xs-font-weight-bolder: 500;
186
+ --eds-typography-header-xs-lineheight-default: 0.75rem;
187
+ --eds-typography-header-xs-lineheight-squished: 0.75rem;
188
+ --eds-typography-header-font-family: "Equinor";
189
+ --eds-typography-header-sm-font-size: 0.75rem;
190
+ --eds-typography-header-sm-tracking-tight: -1.15px;
191
+ --eds-typography-header-sm-tracking-normal: 0px;
192
+ --eds-typography-header-sm-tracking-loose: 1.15px;
193
+ --eds-typography-header-sm-font-weight-lighter: 300;
194
+ --eds-typography-header-sm-font-weight-normal: 400;
195
+ --eds-typography-header-sm-font-weight-bolder: 500;
196
+ --eds-typography-header-sm-lineheight-default: 1rem;
197
+ --eds-typography-header-sm-lineheight-squished: 0.75rem;
198
+ --eds-typography-header-md-font-size: 0.875rem;
199
+ --eds-typography-header-md-tracking-tight: -1.32px;
200
+ --eds-typography-header-md-tracking-normal: 0px;
201
+ --eds-typography-header-md-tracking-loose: 1.32px;
202
+ --eds-typography-header-md-font-weight-lighter: 300;
203
+ --eds-typography-header-md-font-weight-normal: 400;
204
+ --eds-typography-header-md-font-weight-bolder: 500;
205
+ --eds-typography-header-md-lineheight-default: 1rem;
206
+ --eds-typography-header-md-lineheight-squished: 0.75rem;
207
+ --eds-typography-header-lg-font-size: 1rem;
208
+ --eds-typography-header-lg-tracking-tight: -1.54px;
209
+ --eds-typography-header-lg-tracking-normal: 0px;
210
+ --eds-typography-header-lg-tracking-loose: 1.54px;
211
+ --eds-typography-header-lg-font-weight-lighter: 300;
212
+ --eds-typography-header-lg-font-weight-normal: 400;
213
+ --eds-typography-header-lg-font-weight-bolder: 500;
214
+ --eds-typography-header-lg-lineheight-default: 1.25rem;
215
+ --eds-typography-header-lg-lineheight-squished: 1rem;
216
+ --eds-typography-header-xl-font-size: 1.125rem;
217
+ --eds-typography-header-xl-tracking-tight: -1.76px;
218
+ --eds-typography-header-xl-tracking-normal: 0px;
219
+ --eds-typography-header-xl-tracking-loose: 1.76px;
220
+ --eds-typography-header-xl-font-weight-lighter: 300;
221
+ --eds-typography-header-xl-font-weight-normal: 400;
222
+ --eds-typography-header-xl-font-weight-bolder: 500;
223
+ --eds-typography-header-xl-lineheight-default: 1.5rem;
224
+ --eds-typography-header-xl-lineheight-squished: 1.25rem;
225
+ --eds-typography-header-2xl-font-size: 1.313rem;
226
+ --eds-typography-header-2xl-tracking-tight: -1.76px;
227
+ --eds-typography-header-2xl-tracking-normal: 0px;
228
+ --eds-typography-header-2xl-tracking-loose: 2.035px;
229
+ --eds-typography-header-2xl-font-weight-lighter: 300;
230
+ --eds-typography-header-2xl-font-weight-normal: 400;
231
+ --eds-typography-header-2xl-font-weight-bolder: 500;
232
+ --eds-typography-header-2xl-lineheight-default: 1.5rem;
233
+ --eds-typography-header-2xl-lineheight-squished: 1.25rem;
234
+ --eds-typography-header-3xl-font-size: 1.5rem;
235
+ --eds-typography-header-3xl-tracking-tight: -2.31px;
236
+ --eds-typography-header-3xl-tracking-normal: 0px;
237
+ --eds-typography-header-3xl-tracking-loose: 2.31px;
238
+ --eds-typography-header-3xl-font-weight-lighter: 300;
239
+ --eds-typography-header-3xl-font-weight-normal: 400;
240
+ --eds-typography-header-3xl-font-weight-bolder: 500;
241
+ --eds-typography-header-3xl-lineheight-default: 1.75rem;
242
+ --eds-typography-header-3xl-lineheight-squished: 1.5rem;
243
+ --eds-typography-header-4xl-font-size: 1.719rem;
244
+ --eds-typography-header-4xl-tracking-tight: -2.695px;
245
+ --eds-typography-header-4xl-tracking-normal: 0px;
246
+ --eds-typography-header-4xl-tracking-loose: 2.695px;
247
+ --eds-typography-header-4xl-font-weight-lighter: 300;
248
+ --eds-typography-header-4xl-font-weight-normal: 400;
249
+ --eds-typography-header-4xl-font-weight-bolder: 500;
250
+ --eds-typography-header-4xl-lineheight-default: 2rem;
251
+ --eds-typography-header-4xl-lineheight-squished: 1.75rem;
252
+ --eds-typography-header-5xl-font-size: 1.969rem;
253
+ --eds-typography-header-5xl-tracking-tight: -3.08px;
254
+ --eds-typography-header-5xl-tracking-normal: 0px;
255
+ --eds-typography-header-5xl-tracking-loose: 3.08px;
256
+ --eds-typography-header-5xl-font-weight-lighter: 300;
257
+ --eds-typography-header-5xl-font-weight-normal: 400;
258
+ --eds-typography-header-5xl-font-weight-bolder: 500;
259
+ --eds-typography-header-5xl-lineheight-default: 2rem;
260
+ --eds-typography-header-5xl-lineheight-squished: 1.75rem;
261
+ --eds-typography-header-6xl-font-size: 2.281rem;
262
+ --eds-typography-header-6xl-tracking-tight: -3.52px;
263
+ --eds-typography-header-6xl-tracking-normal: 0px;
264
+ --eds-typography-header-6xl-tracking-loose: 3.52px;
265
+ --eds-typography-header-6xl-font-weight-lighter: 300;
266
+ --eds-typography-header-6xl-font-weight-normal: 400;
267
+ --eds-typography-header-6xl-font-weight-bolder: 500;
268
+ --eds-typography-header-6xl-lineheight-default: 2.25rem;
269
+ --eds-typography-header-6xl-lineheight-squished: 2rem;
270
+ }
package/build/css/spacing/comfortable-verbose.css ADDED
@@ -0,0 +1,270 @@
1
+ /**
2
+ * Do not edit directly
3
+ */
4
+
5
+ [data-density="comfortable"] {
6
+ --eds-sizing-stroke-none: 0rem;
7
+ --eds-sizing-stroke-thick: 0.125rem;
8
+ --eds-sizing-stroke-thin: 0.063rem;
9
+ --eds-sizing-selectable-2xl: 3.25rem;
10
+ --eds-sizing-selectable-xl: 2.75rem;
11
+ --eds-sizing-selectable-lg: 2.25rem;
12
+ --eds-sizing-selectable-md: 1.5rem;
13
+ --eds-sizing-selectable-sm: 1.25rem;
14
+ --eds-sizing-selectable-xs: 1rem;
15
+ --eds-sizing-icon-6xl: 3rem;
16
+ --eds-sizing-icon-5xl: 2.625rem;
17
+ --eds-sizing-icon-4xl: 2.313rem;
18
+ --eds-sizing-icon-3xl: 2rem;
19
+ --eds-sizing-icon-2xl: 1.75rem;
20
+ --eds-sizing-icon-xl: 1.5rem;
21
+ --eds-sizing-icon-lg: 1.25rem;
22
+ --eds-sizing-icon-md: 1.125rem;
23
+ --eds-sizing-icon-sm: 1rem;
24
+ --eds-sizing-icon-xs: 0.875rem;
25
+ --eds-spacing-border-radius-none: 0rem;
26
+ --eds-spacing-border-radius-pill: 62.5rem;
27
+ --eds-spacing-stack-3-xl: 1.75rem;
28
+ --eds-spacing-stack-2-xl: 1.5rem;
29
+ --eds-spacing-stack-xl: 1.25rem;
30
+ --eds-spacing-stack-lg: 1rem;
31
+ --eds-spacing-stack-md: 0.75rem;
32
+ --eds-spacing-stack-sm: 0.5rem;
33
+ --eds-spacing-stack-xs: 0.375rem;
34
+ --eds-spacing-stack-2-xs: 0.25rem;
35
+ --eds-spacing-stack-3-xs: 0.125rem;
36
+ --eds-spacing-stack-4-xs: 0.063rem;
37
+ --eds-spacing-inline-3-xl: 1.75rem;
38
+ --eds-spacing-inline-2-xl: 1.5rem;
39
+ --eds-spacing-inline-xl: 1.25rem;
40
+ --eds-spacing-inline-lg: 1rem;
41
+ --eds-spacing-inline-md: 0.75rem;
42
+ --eds-spacing-inline-sm: 0.5rem;
43
+ --eds-spacing-inline-xs: 0.375rem;
44
+ --eds-spacing-inline-2-xs: 0.25rem;
45
+ --eds-spacing-inline-3-xs: 0.125rem;
46
+ --eds-spacing-inline-4-xs: 0.063rem;
47
+ --eds-spacing-icon-6xl-gap-vertical: 1.25rem;
48
+ --eds-spacing-icon-6xl-gap-horizontal: 1.25rem;
49
+ --eds-spacing-icon-5xl-gap-vertical: 1.094rem;
50
+ --eds-spacing-icon-5xl-gap-horizontal: 1.094rem;
51
+ --eds-spacing-icon-4xl-gap-vertical: 0.938rem;
52
+ --eds-spacing-icon-4xl-gap-horizontal: 0.938rem;
53
+ --eds-spacing-icon-3xl-gap-vertical: 0.813rem;
54
+ --eds-spacing-icon-3xl-gap-horizontal: 0.813rem;
55
+ --eds-spacing-icon-2xl-gap-vertical: 0.719rem;
56
+ --eds-spacing-icon-2xl-gap-horizontal: 0.719rem;
57
+ --eds-spacing-icon-xl-gap-vertical: 0.625rem;
58
+ --eds-spacing-icon-xl-gap-horizontal: 0.625rem;
59
+ --eds-spacing-icon-lg-gap-vertical: 0.531rem;
60
+ --eds-spacing-icon-lg-gap-horizontal: 0.531rem;
61
+ --eds-spacing-icon-md-gap-vertical: 0.469rem;
62
+ --eds-spacing-icon-md-gap-horizontal: 0.469rem;
63
+ --eds-spacing-icon-sm-gap-vertical: 0.406rem;
64
+ --eds-spacing-icon-sm-gap-horizontal: 0.406rem;
65
+ --eds-spacing-icon-xs-gap-vertical: 0.344rem;
66
+ --eds-spacing-icon-xs-gap-horizontal: 0.344rem;
67
+ --eds-typography-header-6xl-font-weight-bolder: 500;
68
+ --eds-typography-header-6xl-font-weight-normal: 400;
69
+ --eds-typography-header-6xl-font-weight-lighter: 300;
70
+ --eds-typography-header-6xl-tracking-loose: var(--eds-type-scale-equinor-1000-tracking-loose);
71
+ --eds-typography-header-6xl-tracking-normal: var(--eds-type-scale-equinor-1000-tracking-normal);
72
+ --eds-typography-header-6xl-tracking-tight: var(--eds-type-scale-equinor-1000-tracking-tight);
73
+ --eds-typography-header-6xl-font-size: var(--eds-type-scale-equinor-1000-font-size);
74
+ --eds-typography-header-5xl-font-weight-bolder: 500;
75
+ --eds-typography-header-5xl-font-weight-normal: 400;
76
+ --eds-typography-header-5xl-font-weight-lighter: 300;
77
+ --eds-typography-header-5xl-tracking-loose: var(--eds-type-scale-equinor-900-tracking-loose);
78
+ --eds-typography-header-5xl-tracking-normal: var(--eds-type-scale-equinor-900-tracking-normal);
79
+ --eds-typography-header-5xl-tracking-tight: var(--eds-type-scale-equinor-900-tracking-tight);
80
+ --eds-typography-header-5xl-font-size: var(--eds-type-scale-equinor-900-font-size);
81
+ --eds-typography-header-4xl-font-weight-bolder: 500;
82
+ --eds-typography-header-4xl-font-weight-normal: 400;
83
+ --eds-typography-header-4xl-font-weight-lighter: 300;
84
+ --eds-typography-header-4xl-tracking-loose: var(--eds-type-scale-equinor-800-tracking-loose);
85
+ --eds-typography-header-4xl-tracking-normal: var(--eds-type-scale-equinor-800-tracking-normal);
86
+ --eds-typography-header-4xl-tracking-tight: var(--eds-type-scale-equinor-800-tracking-tight);
87
+ --eds-typography-header-4xl-font-size: var(--eds-type-scale-equinor-800-font-size);
88
+ --eds-typography-header-3xl-font-weight-bolder: 500;
89
+ --eds-typography-header-3xl-font-weight-normal: 400;
90
+ --eds-typography-header-3xl-font-weight-lighter: 300;
91
+ --eds-typography-header-3xl-tracking-loose: var(--eds-type-scale-equinor-700-tracking-loose);
92
+ --eds-typography-header-3xl-tracking-normal: var(--eds-type-scale-equinor-700-tracking-normal);
93
+ --eds-typography-header-3xl-tracking-tight: var(--eds-type-scale-equinor-700-tracking-tight);
94
+ --eds-typography-header-3xl-font-size: var(--eds-type-scale-equinor-700-font-size);
95
+ --eds-typography-header-2xl-font-weight-bolder: 500;
96
+ --eds-typography-header-2xl-font-weight-normal: 400;
97
+ --eds-typography-header-2xl-font-weight-lighter: 300;
98
+ --eds-typography-header-2xl-tracking-loose: var(--eds-type-scale-equinor-600-tracking-loose);
99
+ --eds-typography-header-2xl-tracking-normal: var(--eds-type-scale-equinor-600-tracking-normal);
100
+ --eds-typography-header-2xl-tracking-tight: var(--eds-type-scale-equinor-600-tracking-tight);
101
+ --eds-typography-header-2xl-font-size: var(--eds-type-scale-equinor-600-font-size);
102
+ --eds-typography-header-xl-font-weight-bolder: 500;
103
+ --eds-typography-header-xl-font-weight-normal: 400;
104
+ --eds-typography-header-xl-font-weight-lighter: 300;
105
+ --eds-typography-header-xl-tracking-loose: var(--eds-type-scale-equinor-500-tracking-loose);
106
+ --eds-typography-header-xl-tracking-normal: var(--eds-type-scale-equinor-500-tracking-normal);
107
+ --eds-typography-header-xl-tracking-tight: var(--eds-type-scale-equinor-500-tracking-tight);
108
+ --eds-typography-header-xl-font-size: var(--eds-type-scale-equinor-500-font-size);
109
+ --eds-typography-header-lg-font-weight-bolder: 500;
110
+ --eds-typography-header-lg-font-weight-normal: 400;
111
+ --eds-typography-header-lg-font-weight-lighter: 300;
112
+ --eds-typography-header-lg-tracking-loose: var(--eds-type-scale-equinor-400-tracking-loose);
113
+ --eds-typography-header-lg-tracking-normal: var(--eds-type-scale-equinor-400-tracking-normal);
114
+ --eds-typography-header-lg-tracking-tight: var(--eds-type-scale-equinor-400-tracking-tight);
115
+ --eds-typography-header-lg-font-size: var(--eds-type-scale-equinor-400-font-size);
116
+ --eds-typography-header-md-font-weight-bolder: 500;
117
+ --eds-typography-header-md-font-weight-normal: 400;
118
+ --eds-typography-header-md-font-weight-lighter: 300;
119
+ --eds-typography-header-md-tracking-loose: var(--eds-type-scale-equinor-300-tracking-loose);
120
+ --eds-typography-header-md-tracking-normal: var(--eds-type-scale-equinor-300-tracking-normal);
121
+ --eds-typography-header-md-tracking-tight: var(--eds-type-scale-equinor-300-tracking-tight);
122
+ --eds-typography-header-md-font-size: var(--eds-type-scale-equinor-300-font-size);
123
+ --eds-typography-header-sm-font-weight-bolder: 500;
124
+ --eds-typography-header-sm-font-weight-normal: 400;
125
+ --eds-typography-header-sm-font-weight-lighter: 300;
126
+ --eds-typography-header-sm-tracking-loose: var(--eds-type-scale-equinor-200-tracking-loose);
127
+ --eds-typography-header-sm-tracking-normal: var(--eds-type-scale-equinor-200-tracking-normal);
128
+ --eds-typography-header-sm-tracking-tight: var(--eds-type-scale-equinor-200-tracking-tight);
129
+ --eds-typography-header-sm-font-size: var(--eds-type-scale-equinor-200-font-size);
130
+ --eds-typography-header-font-family: var(--eds-font-family-equinor);
131
+ --eds-typography-header-xs-font-weight-bolder: 500;
132
+ --eds-typography-header-xs-font-weight-normal: 400;
133
+ --eds-typography-header-xs-font-weight-lighter: 300;
134
+ --eds-typography-header-xs-tracking-loose: var(--eds-type-scale-equinor-100-tracking-loose);
135
+ --eds-typography-header-xs-tracking-normal: var(--eds-type-scale-equinor-100-tracking-normal);
136
+ --eds-typography-header-xs-tracking-tight: var(--eds-type-scale-equinor-100-tracking-tight);
137
+ --eds-typography-header-xs-font-size: var(--eds-type-scale-equinor-100-font-size);
138
+ --eds-typography-ui-body-6xl-font-weight-bolder: 500;
139
+ --eds-typography-ui-body-6xl-font-weight-normal: var(--eds-type-scale-inter-1000-tracking-normal);
140
+ --eds-typography-ui-body-6xl-font-weight-lighter: 300;
141
+ --eds-typography-ui-body-6xl-tracking-loose: var(--eds-type-scale-inter-1000-tracking-loose);
142
+ --eds-typography-ui-body-6xl-tracking-normal: var(--eds-type-scale-inter-1000-tracking-normal);
143
+ --eds-typography-ui-body-6xl-tracking-tight: var(--eds-type-scale-inter-1000-tracking-tight);
144
+ --eds-typography-ui-body-6xl-font-size: var(--eds-type-scale-inter-1000-font-size);
145
+ --eds-typography-ui-body-5xl-font-weight-bolder: 500;
146
+ --eds-typography-ui-body-5xl-font-weight-normal: 400;
147
+ --eds-typography-ui-body-5xl-font-weight-lighter: 300;
148
+ --eds-typography-ui-body-5xl-tracking-loose: var(--eds-type-scale-inter-900-tracking-loose);
149
+ --eds-typography-ui-body-5xl-tracking-normal: var(--eds-type-scale-inter-900-tracking-normal);
150
+ --eds-typography-ui-body-5xl-tracking-tight: var(--eds-type-scale-inter-900-tracking-tight);
151
+ --eds-typography-ui-body-5xl-font-size: var(--eds-type-scale-inter-900-font-size);
152
+ --eds-typography-ui-body-4xl-font-weight-bolder: 500;
153
+ --eds-typography-ui-body-4xl-font-weight-normal: 400;
154
+ --eds-typography-ui-body-4xl-font-weight-lighter: 300;
155
+ --eds-typography-ui-body-4xl-tracking-loose: var(--eds-type-scale-inter-800-tracking-loose);
156
+ --eds-typography-ui-body-4xl-tracking-normal: var(--eds-type-scale-inter-800-tracking-normal);
157
+ --eds-typography-ui-body-4xl-tracking-tight: var(--eds-type-scale-inter-800-tracking-tight);
158
+ --eds-typography-ui-body-4xl-font-size: var(--eds-type-scale-inter-800-font-size);
159
+ --eds-typography-ui-body-3xl-font-weight-bolder: 500;
160
+ --eds-typography-ui-body-3xl-font-weight-normal: 400;
161
+ --eds-typography-ui-body-3xl-font-weight-lighter: 300;
162
+ --eds-typography-ui-body-3xl-tracking-loose: var(--eds-type-scale-inter-700-tracking-loose);
163
+ --eds-typography-ui-body-3xl-tracking-normal: var(--eds-type-scale-inter-700-tracking-normal);
164
+ --eds-typography-ui-body-3xl-tracking-tight: var(--eds-type-scale-inter-700-tracking-tight);
165
+ --eds-typography-ui-body-3xl-font-size: var(--eds-type-scale-inter-700-font-size);
166
+ --eds-typography-ui-body-2xl-font-weight-bolder: 500;
167
+ --eds-typography-ui-body-2xl-font-weight-normal: 400;
168
+ --eds-typography-ui-body-2xl-font-weight-lighter: 300;
169
+ --eds-typography-ui-body-2xl-tracking-loose: var(--eds-type-scale-inter-600-tracking-loose);
170
+ --eds-typography-ui-body-2xl-tracking-normal: var(--eds-type-scale-inter-600-tracking-normal);
171
+ --eds-typography-ui-body-2xl-tracking-tight: var(--eds-type-scale-inter-600-tracking-tight);
172
+ --eds-typography-ui-body-2xl-font-size: var(--eds-type-scale-inter-600-font-size);
173
+ --eds-typography-ui-body-xl-font-weight-bolder: 500;
174
+ --eds-typography-ui-body-xl-font-weight-normal: 400;
175
+ --eds-typography-ui-body-xl-font-weight-lighter: 300;
176
+ --eds-typography-ui-body-xl-tracking-loose: var(--eds-type-scale-inter-500-tracking-loose);
177
+ --eds-typography-ui-body-xl-tracking-normal: var(--eds-type-scale-inter-500-tracking-normal);
178
+ --eds-typography-ui-body-xl-tracking-tight: var(--eds-type-scale-inter-500-tracking-tight);
179
+ --eds-typography-ui-body-xl-font-size: var(--eds-type-scale-inter-500-font-size);
180
+ --eds-typography-ui-body-lg-font-weight-bolder: 500;
181
+ --eds-typography-ui-body-lg-font-weight-normal: 400;
182
+ --eds-typography-ui-body-lg-font-weight-lighter: 300;
183
+ --eds-typography-ui-body-lg-tracking-loose: var(--eds-type-scale-inter-400-tracking-loose);
184
+ --eds-typography-ui-body-lg-tracking-normal: var(--eds-type-scale-inter-400-tracking-normal);
185
+ --eds-typography-ui-body-lg-tracking-tight: var(--eds-type-scale-inter-400-tracking-tight);
186
+ --eds-typography-ui-body-lg-font-size: var(--eds-type-scale-inter-400-font-size);
187
+ --eds-typography-ui-body-md-font-weight-bolder: 500;
188
+ --eds-typography-ui-body-md-font-weight-normal: 400;
189
+ --eds-typography-ui-body-md-font-weight-lighter: 300;
190
+ --eds-typography-ui-body-md-tracking-loose: var(--eds-type-scale-inter-300-tracking-loose);
191
+ --eds-typography-ui-body-md-tracking-normal: var(--eds-type-scale-inter-300-tracking-normal);
192
+ --eds-typography-ui-body-md-tracking-tight: var(--eds-type-scale-inter-300-tracking-tight);
193
+ --eds-typography-ui-body-md-font-size: var(--eds-type-scale-inter-300-font-size);
194
+ --eds-typography-ui-body-font-family: var(--eds-font-family-inter);
195
+ --eds-typography-ui-body-sm-font-weight-bolder: 500;
196
+ --eds-typography-ui-body-sm-font-weight-normal: 400;
197
+ --eds-typography-ui-body-sm-font-weight-lighter: 300;
198
+ --eds-typography-ui-body-sm-tracking-loose: var(--eds-type-scale-inter-200-tracking-loose);
199
+ --eds-typography-ui-body-sm-tracking-normal: var(--eds-type-scale-inter-200-tracking-normal);
200
+ --eds-typography-ui-body-sm-tracking-tight: var(--eds-type-scale-inter-200-tracking-tight);
201
+ --eds-typography-ui-body-sm-font-size: var(--eds-type-scale-inter-200-font-size);
202
+ --eds-typography-ui-body-xs-font-weight-bolder: 500;
203
+ --eds-typography-ui-body-xs-font-weight-normal: 400;
204
+ --eds-typography-ui-body-xs-font-weight-lighter: 300;
205
+ --eds-typography-ui-body-xs-tracking-loose: var(--eds-type-scale-inter-100-tracking-loose);
206
+ --eds-typography-ui-body-xs-tracking-normal: var(--eds-type-scale-inter-100-tracking-normal);
207
+ --eds-typography-ui-body-xs-tracking-tight: var(--eds-type-scale-inter-100-tracking-tight);
208
+ --eds-typography-ui-body-xs-font-size: var(--eds-type-scale-inter-100-font-size);
209
+ --eds-spacing-inset-xl-stack-stretched: var(--eds-spacing-stack-2-xl);
210
+ --eds-spacing-inset-xl-stack-squared: var(--eds-spacing-stack-xl);
211
+ --eds-spacing-inset-xl-stack-squished: var(--eds-spacing-stack-lg);
212
+ --eds-spacing-inset-xl-inline: var(--eds-spacing-inline-xl);
213
+ --eds-spacing-inset-lg-stack-stretched: var(--eds-spacing-stack-xl);
214
+ --eds-spacing-inset-lg-stack-squared: var(--eds-spacing-stack-lg);
215
+ --eds-spacing-inset-lg-stack-squished: var(--eds-spacing-stack-md);
216
+ --eds-spacing-inset-lg-inline: var(--eds-spacing-inline-lg);
217
+ --eds-spacing-inset-md-stack-stretched: var(--eds-spacing-stack-lg);
218
+ --eds-spacing-inset-md-stack-squared: var(--eds-spacing-stack-md);
219
+ --eds-spacing-inset-md-stack-squished: var(--eds-spacing-stack-sm);
220
+ --eds-spacing-inset-md-inline: var(--eds-spacing-inline-md);
221
+ --eds-spacing-inset-sm-stack-stretched: var(--eds-spacing-stack-md);
222
+ --eds-spacing-inset-sm-stack-squared: var(--eds-spacing-stack-sm);
223
+ --eds-spacing-inset-sm-stack-squished: var(--eds-spacing-stack-xs);
224
+ --eds-spacing-inset-sm-inline: var(--eds-spacing-inline-sm);
225
+ --eds-spacing-inset-xs-stack-stretched: var(--eds-spacing-stack-sm);
226
+ --eds-spacing-inset-xs-stack-squared: var(--eds-spacing-stack-xs);
227
+ --eds-spacing-inset-xs-stack-squished: var(--eds-spacing-stack-2-xs);
228
+ --eds-spacing-inset-xs-inline: var(--eds-spacing-inline-xs);
229
+ --eds-spacing-border-radius-rounded: var(--eds-spacing-19);
230
+ --eds-typography-header-6xl-lineheight-squished: var(--eds-lineheight-scale-1000-lineheight-squished);
231
+ --eds-typography-header-6xl-lineheight-default: var(--eds-lineheight-scale-1000-default);
232
+ --eds-typography-header-5xl-lineheight-squished: var(--eds-lineheight-scale-900-lineheight-squished);
233
+ --eds-typography-header-5xl-lineheight-default: var(--eds-lineheight-scale-900-default);
234
+ --eds-typography-header-4xl-lineheight-squished: var(--eds-lineheight-scale-800-lineheight-squished);
235
+ --eds-typography-header-4xl-lineheight-default: var(--eds-lineheight-scale-800-default);
236
+ --eds-typography-header-3xl-lineheight-squished: var(--eds-lineheight-scale-700-lineheight-squished);
237
+ --eds-typography-header-3xl-lineheight-default: var(--eds-lineheight-scale-700-default);
238
+ --eds-typography-header-2xl-lineheight-squished: var(--eds-lineheight-scale-600-lineheight-squished);
239
+ --eds-typography-header-2xl-lineheight-default: var(--eds-lineheight-scale-600-default);
240
+ --eds-typography-header-xl-lineheight-squished: var(--eds-lineheight-scale-500-lineheight-squished);
241
+ --eds-typography-header-xl-lineheight-default: var(--eds-lineheight-scale-500-default);
242
+ --eds-typography-header-lg-lineheight-squished: var(--eds-lineheight-scale-400-lineheight-squished);
243
+ --eds-typography-header-lg-lineheight-default: var(--eds-lineheight-scale-400-default);
244
+ --eds-typography-header-md-lineheight-squished: var(--eds-lineheight-scale-300-lineheight-squished);
245
+ --eds-typography-header-md-lineheight-default: var(--eds-lineheight-scale-300-default);
246
+ --eds-typography-header-sm-lineheight-squished: var(--eds-lineheight-scale-200-lineheight-squished);
247
+ --eds-typography-header-sm-lineheight-default: var(--eds-lineheight-scale-200-default);
248
+ --eds-typography-header-xs-lineheight-squished: var(--eds-lineheight-scale-100-lineheight-squished);
249
+ --eds-typography-header-xs-lineheight-default: var(--eds-lineheight-scale-100-default);
250
+ --eds-typography-ui-body-6xl-lineheight-squished: var(--eds-lineheight-scale-1000-lineheight-squished);
251
+ --eds-typography-ui-body-6xl-lineheight-default: var(--eds-lineheight-scale-1000-default);
252
+ --eds-typography-ui-body-5xl-lineheight-squished: var(--eds-lineheight-scale-900-lineheight-squished);
253
+ --eds-typography-ui-body-5xl-lineheight-default: var(--eds-lineheight-scale-900-default);
254
+ --eds-typography-ui-body-4xl-lineheight-squished: var(--eds-lineheight-scale-800-lineheight-squished);
255
+ --eds-typography-ui-body-4xl-lineheight-default: var(--eds-lineheight-scale-800-default);
256
+ --eds-typography-ui-body-3xl-lineheight-squished: var(--eds-lineheight-scale-700-lineheight-squished);
257
+ --eds-typography-ui-body-3xl-lineheight-default: var(--eds-lineheight-scale-700-default);
258
+ --eds-typography-ui-body-2xl-lineheight-squished: var(--eds-lineheight-scale-600-lineheight-squished);
259
+ --eds-typography-ui-body-2xl-lineheight-default: var(--eds-lineheight-scale-600-default);
260
+ --eds-typography-ui-body-xl-lineheight-squished: var(--eds-lineheight-scale-500-lineheight-squished);
261
+ --eds-typography-ui-body-xl-lineheight-default: var(--eds-lineheight-scale-500-default);
262
+ --eds-typography-ui-body-lg-lineheight-squished: var(--eds-lineheight-scale-400-lineheight-squished);
263
+ --eds-typography-ui-body-lg-lineheight-default: var(--eds-lineheight-scale-400-default);
264
+ --eds-typography-ui-body-md-lineheight-squished: var(--eds-lineheight-scale-300-lineheight-squished);
265
+ --eds-typography-ui-body-md-lineheight-default: var(--eds-lineheight-scale-300-default);
266
+ --eds-typography-ui-body-sm-lineheight-squished: var(--eds-lineheight-scale-200-lineheight-squished);
267
+ --eds-typography-ui-body-sm-lineheight-default: var(--eds-lineheight-scale-200-default);
268
+ --eds-typography-ui-body-xs-lineheight-squished: var(--eds-lineheight-scale-100-lineheight-squished);
269
+ --eds-typography-ui-body-xs-lineheight-default: var(--eds-lineheight-scale-100-default);
270
+ }