@navikt/ds-tokens 7.9.0 → 7.9.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.
@@ -10,21 +10,7 @@
10
10
  * Used for setting opacity on disabled elements.
11
11
  */
12
12
  $ax-opacity-disabled: var(--ax-opacity-disabled);
13
- $ax-bg-neutral: var(--ax-bg-neutral);
14
- $ax-bg-neutral-hover: var(--ax-bg-neutral-hover);
15
- $ax-bg-neutral-hoverA: var(--ax-bg-neutral-hoverA);
16
- $ax-bg-neutral-moderate: var(--ax-bg-neutral-moderate);
17
- $ax-bg-neutral-moderateA: var(--ax-bg-neutral-moderateA);
18
- $ax-bg-neutral-moderate-hover: var(--ax-bg-neutral-moderate-hover);
19
- $ax-bg-neutral-moderate-hoverA: var(--ax-bg-neutral-moderate-hoverA);
20
- $ax-bg-neutral-moderate-pressed: var(--ax-bg-neutral-moderate-pressed);
21
- $ax-bg-neutral-moderate-pressedA: var(--ax-bg-neutral-moderate-pressedA);
22
- $ax-bg-neutral-strong: var(--ax-bg-neutral-strong);
23
- $ax-bg-neutral-strong-hover: var(--ax-bg-neutral-strong-hover);
24
- $ax-bg-neutral-strong-pressed: var(--ax-bg-neutral-strong-pressed);
25
- $ax-bg-neutral-raised: var(--ax-bg-neutral-raised);
26
- $ax-bg-neutral-raised-hover: var(--ax-bg-neutral-raised-hover);
27
- $ax-bg-accent: var(--ax-bg-accent);
13
+ $ax-bg-accent-soft: var(--ax-bg-accent-soft);
28
14
  $ax-bg-accent-hover: var(--ax-bg-accent-hover);
29
15
  $ax-bg-accent-hoverA: var(--ax-bg-accent-hoverA);
30
16
  $ax-bg-accent-moderate: var(--ax-bg-accent-moderate);
@@ -38,7 +24,7 @@
38
24
  $ax-bg-accent-strong-pressed: var(--ax-bg-accent-strong-pressed);
39
25
  $ax-bg-accent-raised: var(--ax-bg-accent-raised);
40
26
  $ax-bg-accent-raised-hover: var(--ax-bg-accent-raised-hover);
41
- $ax-bg-success: var(--ax-bg-success);
27
+ $ax-bg-success-soft: var(--ax-bg-success-soft);
42
28
  $ax-bg-success-hover: var(--ax-bg-success-hover);
43
29
  $ax-bg-success-hoverA: var(--ax-bg-success-hoverA);
44
30
  $ax-bg-success-moderate: var(--ax-bg-success-moderate);
@@ -52,7 +38,7 @@
52
38
  $ax-bg-success-strong-pressed: var(--ax-bg-success-strong-pressed);
53
39
  $ax-bg-success-raised: var(--ax-bg-success-raised);
54
40
  $ax-bg-success-raised-hover: var(--ax-bg-success-raised-hover);
55
- $ax-bg-warning: var(--ax-bg-warning);
41
+ $ax-bg-warning-soft: var(--ax-bg-warning-soft);
56
42
  $ax-bg-warning-hover: var(--ax-bg-warning-hover);
57
43
  $ax-bg-warning-hoverA: var(--ax-bg-warning-hoverA);
58
44
  $ax-bg-warning-moderate: var(--ax-bg-warning-moderate);
@@ -66,7 +52,7 @@
66
52
  $ax-bg-warning-strong-pressed: var(--ax-bg-warning-strong-pressed);
67
53
  $ax-bg-warning-raised: var(--ax-bg-warning-raised);
68
54
  $ax-bg-warning-raised-hover: var(--ax-bg-warning-raised-hover);
69
- $ax-bg-danger: var(--ax-bg-danger);
55
+ $ax-bg-danger-soft: var(--ax-bg-danger-soft);
70
56
  $ax-bg-danger-hover: var(--ax-bg-danger-hover);
71
57
  $ax-bg-danger-hoverA: var(--ax-bg-danger-hoverA);
72
58
  $ax-bg-danger-moderate: var(--ax-bg-danger-moderate);
@@ -80,7 +66,7 @@
80
66
  $ax-bg-danger-strong-pressed: var(--ax-bg-danger-strong-pressed);
81
67
  $ax-bg-danger-raised: var(--ax-bg-danger-raised);
82
68
  $ax-bg-danger-raised-hover: var(--ax-bg-danger-raised-hover);
83
- $ax-bg-info: var(--ax-bg-info);
69
+ $ax-bg-info-soft: var(--ax-bg-info-soft);
84
70
  $ax-bg-info-hover: var(--ax-bg-info-hover);
85
71
  $ax-bg-info-hoverA: var(--ax-bg-info-hoverA);
86
72
  $ax-bg-info-moderate: var(--ax-bg-info-moderate);
@@ -94,84 +80,93 @@
94
80
  $ax-bg-info-strong-pressed: var(--ax-bg-info-strong-pressed);
95
81
  $ax-bg-info-raised: var(--ax-bg-info-raised);
96
82
  $ax-bg-info-raised-hover: var(--ax-bg-info-raised-hover);
97
- $ax-bg-brand-magenta: var(--ax-bg-brand-magenta);
98
- $ax-bg-brand-magenta-hover: var(--ax-bg-brand-magenta-hover);
99
- $ax-bg-brand-magenta-hoverA: var(--ax-bg-brand-magenta-hoverA);
100
- $ax-bg-brand-magenta-moderate: var(--ax-bg-brand-magenta-moderate);
101
- $ax-bg-brand-magenta-moderateA: var(--ax-bg-brand-magenta-moderateA);
102
- $ax-bg-brand-magenta-moderate-hover: var(--ax-bg-brand-magenta-moderate-hover);
103
- $ax-bg-brand-magenta-moderate-hoverA: var(--ax-bg-brand-magenta-moderate-hoverA);
104
- $ax-bg-brand-magenta-moderate-pressed: var(--ax-bg-brand-magenta-moderate-pressed);
105
- $ax-bg-brand-magenta-moderate-pressedA: var(--ax-bg-brand-magenta-moderate-pressedA);
106
- $ax-bg-brand-magenta-strong: var(--ax-bg-brand-magenta-strong);
107
- $ax-bg-brand-magenta-strong-hover: var(--ax-bg-brand-magenta-strong-hover);
108
- $ax-bg-brand-magenta-strong-pressed: var(--ax-bg-brand-magenta-strong-pressed);
109
- $ax-bg-brand-magenta-raised: var(--ax-bg-brand-magenta-raised);
110
- $ax-bg-brand-magenta-raised-hover: var(--ax-bg-brand-magenta-raised-hover);
111
- $ax-bg-brand-beige: var(--ax-bg-brand-beige);
112
- $ax-bg-brand-beige-hover: var(--ax-bg-brand-beige-hover);
113
- $ax-bg-brand-beige-hoverA: var(--ax-bg-brand-beige-hoverA);
114
- $ax-bg-brand-beige-moderate: var(--ax-bg-brand-beige-moderate);
115
- $ax-bg-brand-beige-moderateA: var(--ax-bg-brand-beige-moderateA);
116
- $ax-bg-brand-beige-moderate-hover: var(--ax-bg-brand-beige-moderate-hover);
117
- $ax-bg-brand-beige-moderate-hoverA: var(--ax-bg-brand-beige-moderate-hoverA);
118
- $ax-bg-brand-beige-moderate-pressed: var(--ax-bg-brand-beige-moderate-pressed);
119
- $ax-bg-brand-beige-moderate-pressedA: var(--ax-bg-brand-beige-moderate-pressedA);
120
- $ax-bg-brand-beige-strong: var(--ax-bg-brand-beige-strong);
121
- $ax-bg-brand-beige-strong-hover: var(--ax-bg-brand-beige-strong-hover);
122
- $ax-bg-brand-beige-strong-pressed: var(--ax-bg-brand-beige-strong-pressed);
123
- $ax-bg-brand-beige-raised: var(--ax-bg-brand-beige-raised);
124
- $ax-bg-brand-beige-raised-hover: var(--ax-bg-brand-beige-raised-hover);
125
- $ax-bg-brand-blue: var(--ax-bg-brand-blue);
126
- $ax-bg-brand-blue-hover: var(--ax-bg-brand-blue-hover);
127
- $ax-bg-brand-blue-hoverA: var(--ax-bg-brand-blue-hoverA);
128
- $ax-bg-brand-blue-moderate: var(--ax-bg-brand-blue-moderate);
129
- $ax-bg-brand-blue-moderateA: var(--ax-bg-brand-blue-moderateA);
130
- $ax-bg-brand-blue-moderate-hover: var(--ax-bg-brand-blue-moderate-hover);
131
- $ax-bg-brand-blue-moderate-hoverA: var(--ax-bg-brand-blue-moderate-hoverA);
132
- $ax-bg-brand-blue-moderate-pressed: var(--ax-bg-brand-blue-moderate-pressed);
133
- $ax-bg-brand-blue-moderate-pressedA: var(--ax-bg-brand-blue-moderate-pressedA);
134
- $ax-bg-brand-blue-strong: var(--ax-bg-brand-blue-strong);
135
- $ax-bg-brand-blue-strong-hover: var(--ax-bg-brand-blue-strong-hover);
136
- $ax-bg-brand-blue-strong-pressed: var(--ax-bg-brand-blue-strong-pressed);
137
- $ax-bg-brand-blue-raised: var(--ax-bg-brand-blue-raised);
138
- $ax-bg-brand-blue-raised-hover: var(--ax-bg-brand-blue-raised-hover);
139
- $ax-bg-meta-purple: var(--ax-bg-meta-purple);
140
- $ax-bg-meta-purple-hover: var(--ax-bg-meta-purple-hover);
141
- $ax-bg-meta-purple-hoverA: var(--ax-bg-meta-purple-hoverA);
142
- $ax-bg-meta-purple-moderate: var(--ax-bg-meta-purple-moderate);
143
- $ax-bg-meta-purple-moderateA: var(--ax-bg-meta-purple-moderateA);
144
- $ax-bg-meta-purple-moderate-hover: var(--ax-bg-meta-purple-moderate-hover);
145
- $ax-bg-meta-purple-moderate-hoverA: var(--ax-bg-meta-purple-moderate-hoverA);
146
- $ax-bg-meta-purple-moderate-pressed: var(--ax-bg-meta-purple-moderate-pressed);
147
- $ax-bg-meta-purple-moderate-pressedA: var(--ax-bg-meta-purple-moderate-pressedA);
148
- $ax-bg-meta-purple-strong: var(--ax-bg-meta-purple-strong);
149
- $ax-bg-meta-purple-strong-hover: var(--ax-bg-meta-purple-strong-hover);
150
- $ax-bg-meta-purple-strong-pressed: var(--ax-bg-meta-purple-strong-pressed);
151
- $ax-bg-meta-purple-raised: var(--ax-bg-meta-purple-raised);
152
- $ax-bg-meta-purple-raised-hover: var(--ax-bg-meta-purple-raised-hover);
153
- $ax-bg-meta-lime: var(--ax-bg-meta-lime);
154
- $ax-bg-meta-lime-hover: var(--ax-bg-meta-lime-hover);
155
- $ax-bg-meta-lime-hoverA: var(--ax-bg-meta-lime-hoverA);
156
- $ax-bg-meta-lime-moderate: var(--ax-bg-meta-lime-moderate);
157
- $ax-bg-meta-lime-moderateA: var(--ax-bg-meta-lime-moderateA);
158
- $ax-bg-meta-lime-moderate-hover: var(--ax-bg-meta-lime-moderate-hover);
159
- $ax-bg-meta-lime-moderate-hoverA: var(--ax-bg-meta-lime-moderate-hoverA);
160
- $ax-bg-meta-lime-moderate-pressed: var(--ax-bg-meta-lime-moderate-pressed);
161
- $ax-bg-meta-lime-moderate-pressedA: var(--ax-bg-meta-lime-moderate-pressedA);
162
- $ax-bg-meta-lime-strong: var(--ax-bg-meta-lime-strong);
163
- $ax-bg-meta-lime-strong-hover: var(--ax-bg-meta-lime-strong-hover);
164
- $ax-bg-meta-lime-strong-pressed: var(--ax-bg-meta-lime-strong-pressed);
165
- $ax-bg-meta-lime-raised: var(--ax-bg-meta-lime-raised);
166
- $ax-bg-meta-lime-raised-hover: var(--ax-bg-meta-lime-raised-hover);
83
+ $ax-bg-brand-1-soft: var(--ax-bg-brand-1-soft);
84
+ $ax-bg-brand-1-hover: var(--ax-bg-brand-1-hover);
85
+ $ax-bg-brand-1-hoverA: var(--ax-bg-brand-1-hoverA);
86
+ $ax-bg-brand-1-moderate: var(--ax-bg-brand-1-moderate);
87
+ $ax-bg-brand-1-moderateA: var(--ax-bg-brand-1-moderateA);
88
+ $ax-bg-brand-1-moderate-hover: var(--ax-bg-brand-1-moderate-hover);
89
+ $ax-bg-brand-1-moderate-hoverA: var(--ax-bg-brand-1-moderate-hoverA);
90
+ $ax-bg-brand-1-moderate-pressed: var(--ax-bg-brand-1-moderate-pressed);
91
+ $ax-bg-brand-1-moderate-pressedA: var(--ax-bg-brand-1-moderate-pressedA);
92
+ $ax-bg-brand-1-strong: var(--ax-bg-brand-1-strong);
93
+ $ax-bg-brand-1-strong-hover: var(--ax-bg-brand-1-strong-hover);
94
+ $ax-bg-brand-1-strong-pressed: var(--ax-bg-brand-1-strong-pressed);
95
+ $ax-bg-brand-1-raised: var(--ax-bg-brand-1-raised);
96
+ $ax-bg-brand-1-raised-hover: var(--ax-bg-brand-1-raised-hover);
97
+ $ax-bg-brand-2-soft: var(--ax-bg-brand-2-soft);
98
+ $ax-bg-brand-2-hover: var(--ax-bg-brand-2-hover);
99
+ $ax-bg-brand-2-hoverA: var(--ax-bg-brand-2-hoverA);
100
+ $ax-bg-brand-2-moderate: var(--ax-bg-brand-2-moderate);
101
+ $ax-bg-brand-2-moderateA: var(--ax-bg-brand-2-moderateA);
102
+ $ax-bg-brand-2-moderate-hover: var(--ax-bg-brand-2-moderate-hover);
103
+ $ax-bg-brand-2-moderate-hoverA: var(--ax-bg-brand-2-moderate-hoverA);
104
+ $ax-bg-brand-2-moderate-pressed: var(--ax-bg-brand-2-moderate-pressed);
105
+ $ax-bg-brand-2-moderate-pressedA: var(--ax-bg-brand-2-moderate-pressedA);
106
+ $ax-bg-brand-2-strong: var(--ax-bg-brand-2-strong);
107
+ $ax-bg-brand-2-strong-hover: var(--ax-bg-brand-2-strong-hover);
108
+ $ax-bg-brand-2-strong-pressed: var(--ax-bg-brand-2-strong-pressed);
109
+ $ax-bg-brand-2-raised: var(--ax-bg-brand-2-raised);
110
+ $ax-bg-brand-2-raised-hover: var(--ax-bg-brand-2-raised-hover);
111
+ $ax-bg-brand-3-soft: var(--ax-bg-brand-3-soft);
112
+ $ax-bg-brand-3-hover: var(--ax-bg-brand-3-hover);
113
+ $ax-bg-brand-3-hoverA: var(--ax-bg-brand-3-hoverA);
114
+ $ax-bg-brand-3-moderate: var(--ax-bg-brand-3-moderate);
115
+ $ax-bg-brand-3-moderateA: var(--ax-bg-brand-3-moderateA);
116
+ $ax-bg-brand-3-moderate-hover: var(--ax-bg-brand-3-moderate-hover);
117
+ $ax-bg-brand-3-moderate-hoverA: var(--ax-bg-brand-3-moderate-hoverA);
118
+ $ax-bg-brand-3-moderate-pressed: var(--ax-bg-brand-3-moderate-pressed);
119
+ $ax-bg-brand-3-moderate-pressedA: var(--ax-bg-brand-3-moderate-pressedA);
120
+ $ax-bg-brand-3-strong: var(--ax-bg-brand-3-strong);
121
+ $ax-bg-brand-3-strong-hover: var(--ax-bg-brand-3-strong-hover);
122
+ $ax-bg-brand-3-strong-pressed: var(--ax-bg-brand-3-strong-pressed);
123
+ $ax-bg-brand-3-raised: var(--ax-bg-brand-3-raised);
124
+ $ax-bg-brand-3-raised-hover: var(--ax-bg-brand-3-raised-hover);
125
+ $ax-bg-meta-1-soft: var(--ax-bg-meta-1-soft);
126
+ $ax-bg-meta-1-hover: var(--ax-bg-meta-1-hover);
127
+ $ax-bg-meta-1-hoverA: var(--ax-bg-meta-1-hoverA);
128
+ $ax-bg-meta-1-moderate: var(--ax-bg-meta-1-moderate);
129
+ $ax-bg-meta-1-moderateA: var(--ax-bg-meta-1-moderateA);
130
+ $ax-bg-meta-1-moderate-hover: var(--ax-bg-meta-1-moderate-hover);
131
+ $ax-bg-meta-1-moderate-hoverA: var(--ax-bg-meta-1-moderate-hoverA);
132
+ $ax-bg-meta-1-moderate-pressed: var(--ax-bg-meta-1-moderate-pressed);
133
+ $ax-bg-meta-1-moderate-pressedA: var(--ax-bg-meta-1-moderate-pressedA);
134
+ $ax-bg-meta-1-strong: var(--ax-bg-meta-1-strong);
135
+ $ax-bg-meta-1-strong-hover: var(--ax-bg-meta-1-strong-hover);
136
+ $ax-bg-meta-1-strong-pressed: var(--ax-bg-meta-1-strong-pressed);
137
+ $ax-bg-meta-1-raised: var(--ax-bg-meta-1-raised);
138
+ $ax-bg-meta-1-raised-hover: var(--ax-bg-meta-1-raised-hover);
139
+ $ax-bg-meta-2-soft: var(--ax-bg-meta-2-soft);
140
+ $ax-bg-meta-2-hover: var(--ax-bg-meta-2-hover);
141
+ $ax-bg-meta-2-hoverA: var(--ax-bg-meta-2-hoverA);
142
+ $ax-bg-meta-2-moderate: var(--ax-bg-meta-2-moderate);
143
+ $ax-bg-meta-2-moderateA: var(--ax-bg-meta-2-moderateA);
144
+ $ax-bg-meta-2-moderate-hover: var(--ax-bg-meta-2-moderate-hover);
145
+ $ax-bg-meta-2-moderate-hoverA: var(--ax-bg-meta-2-moderate-hoverA);
146
+ $ax-bg-meta-2-moderate-pressed: var(--ax-bg-meta-2-moderate-pressed);
147
+ $ax-bg-meta-2-moderate-pressedA: var(--ax-bg-meta-2-moderate-pressedA);
148
+ $ax-bg-meta-2-strong: var(--ax-bg-meta-2-strong);
149
+ $ax-bg-meta-2-strong-hover: var(--ax-bg-meta-2-strong-hover);
150
+ $ax-bg-meta-2-strong-pressed: var(--ax-bg-meta-2-strong-pressed);
151
+ $ax-bg-meta-2-raised: var(--ax-bg-meta-2-raised);
152
+ $ax-bg-meta-2-raised-hover: var(--ax-bg-meta-2-raised-hover);
167
153
  $ax-bg-default: var(--ax-bg-default);
168
154
  $ax-bg-input: var(--ax-bg-input);
169
155
  $ax-bg-raised: var(--ax-bg-raised);
170
156
  $ax-bg-sunken: var(--ax-bg-sunken);
171
157
  $ax-bg-overlay: var(--ax-bg-overlay);
172
- $ax-text-neutral: var(--ax-text-neutral);
173
- $ax-text-neutral-strong: var(--ax-text-neutral-strong);
174
- $ax-text-neutral-icon: var(--ax-text-neutral-icon);
158
+ $ax-bg-soft: var(--ax-bg-soft);
159
+ $ax-bg-hover: var(--ax-bg-hover);
160
+ $ax-bg-hoverA: var(--ax-bg-hoverA);
161
+ $ax-bg-moderate: var(--ax-bg-moderate);
162
+ $ax-bg-moderateA: var(--ax-bg-moderateA);
163
+ $ax-bg-moderate-hover: var(--ax-bg-moderate-hover);
164
+ $ax-bg-moderate-hoverA: var(--ax-bg-moderate-hoverA);
165
+ $ax-bg-moderate-pressed: var(--ax-bg-moderate-pressed);
166
+ $ax-bg-moderate-pressedA: var(--ax-bg-moderate-pressedA);
167
+ $ax-bg-strong: var(--ax-bg-strong);
168
+ $ax-bg-strong-hover: var(--ax-bg-strong-hover);
169
+ $ax-bg-strong-pressed: var(--ax-bg-strong-pressed);
175
170
  $ax-text-accent: var(--ax-text-accent);
176
171
  $ax-text-accent-strong: var(--ax-text-accent-strong);
177
172
  $ax-text-accent-icon: var(--ax-text-accent-icon);
@@ -187,40 +182,36 @@
187
182
  $ax-text-info: var(--ax-text-info);
188
183
  $ax-text-info-strong: var(--ax-text-info-strong);
189
184
  $ax-text-info-icon: var(--ax-text-info-icon);
190
- $ax-text-brand-magenta: var(--ax-text-brand-magenta);
191
- $ax-text-brand-magenta-strong: var(--ax-text-brand-magenta-strong);
192
- $ax-text-brand-magenta-icon: var(--ax-text-brand-magenta-icon);
193
- $ax-text-brand-beige: var(--ax-text-brand-beige);
194
- $ax-text-brand-beige-strong: var(--ax-text-brand-beige-strong);
195
- $ax-text-brand-beige-icon: var(--ax-text-brand-beige-icon);
196
- $ax-text-brand-blue: var(--ax-text-brand-blue);
197
- $ax-text-brand-blue-strong: var(--ax-text-brand-blue-strong);
198
- $ax-text-brand-blue-icon: var(--ax-text-brand-blue-icon);
199
- $ax-text-meta-purple: var(--ax-text-meta-purple);
200
- $ax-text-meta-purple-strong: var(--ax-text-meta-purple-strong);
201
- $ax-text-meta-purple-icon: var(--ax-text-meta-purple-icon);
202
- $ax-text-meta-lime: var(--ax-text-meta-lime);
203
- $ax-text-meta-lime-strong: var(--ax-text-meta-lime-strong);
204
- $ax-text-meta-lime-icon: var(--ax-text-meta-lime-icon);
185
+ $ax-text-brand-1: var(--ax-text-brand-1);
186
+ $ax-text-brand-1-strong: var(--ax-text-brand-1-strong);
187
+ $ax-text-brand-1-icon: var(--ax-text-brand-1-icon);
188
+ $ax-text-brand-2: var(--ax-text-brand-2);
189
+ $ax-text-brand-2-strong: var(--ax-text-brand-2-strong);
190
+ $ax-text-brand-2-icon: var(--ax-text-brand-2-icon);
191
+ $ax-text-brand-3: var(--ax-text-brand-3);
192
+ $ax-text-brand-3-strong: var(--ax-text-brand-3-strong);
193
+ $ax-text-brand-3-icon: var(--ax-text-brand-3-icon);
194
+ $ax-text-meta-1: var(--ax-text-meta-1);
195
+ $ax-text-meta-1-strong: var(--ax-text-meta-1-strong);
196
+ $ax-text-meta-1-icon: var(--ax-text-meta-1-icon);
197
+ $ax-text-meta-2: var(--ax-text-meta-2);
198
+ $ax-text-meta-2-strong: var(--ax-text-meta-2-strong);
199
+ $ax-text-meta-2-icon: var(--ax-text-meta-2-icon);
205
200
  $ax-text-accent-contrast: var(--ax-text-accent-contrast);
206
- $ax-text-neutral-contrast: var(--ax-text-neutral-contrast);
207
201
  $ax-text-danger-contrast: var(--ax-text-danger-contrast);
208
202
  $ax-text-info-contrast: var(--ax-text-info-contrast);
209
203
  $ax-text-success-contrast: var(--ax-text-success-contrast);
210
204
  $ax-text-warning-contrast: var(--ax-text-warning-contrast);
211
- $ax-text-brand-magenta-contrast: var(--ax-text-brand-magenta-contrast);
212
- $ax-text-brand-beige-contrast: var(--ax-text-brand-beige-contrast);
213
- $ax-text-brand-blue-contrast: var(--ax-text-brand-blue-contrast);
214
- $ax-text-meta-purple-contrast: var(--ax-text-meta-purple-contrast);
215
- $ax-text-meta-lime-contrast: var(--ax-text-meta-lime-contrast);
205
+ $ax-text-brand-1-contrast: var(--ax-text-brand-1-contrast);
206
+ $ax-text-brand-2-contrast: var(--ax-text-brand-2-contrast);
207
+ $ax-text-brand-3-contrast: var(--ax-text-brand-3-contrast);
208
+ $ax-text-meta-1-contrast: var(--ax-text-meta-1-contrast);
209
+ $ax-text-meta-2-contrast: var(--ax-text-meta-2-contrast);
216
210
  $ax-text-default: var(--ax-text-default);
217
211
  $ax-text-subtle: var(--ax-text-subtle);
218
212
  $ax-text-icon: var(--ax-text-icon);
219
213
  $ax-text-logo: var(--ax-text-logo);
220
- $ax-border-neutral: var(--ax-border-neutral);
221
- $ax-border-neutral-subtle: var(--ax-border-neutral-subtle);
222
- $ax-border-neutral-subtleA: var(--ax-border-neutral-subtleA);
223
- $ax-border-neutral-strong: var(--ax-border-neutral-strong);
214
+ $ax-text-contrast: var(--ax-text-contrast);
224
215
  $ax-border-accent: var(--ax-border-accent);
225
216
  $ax-border-accent-subtle: var(--ax-border-accent-subtle);
226
217
  $ax-border-accent-subtleA: var(--ax-border-accent-subtleA);
@@ -241,26 +232,26 @@
241
232
  $ax-border-info-subtle: var(--ax-border-info-subtle);
242
233
  $ax-border-info-subtleA: var(--ax-border-info-subtleA);
243
234
  $ax-border-info-strong: var(--ax-border-info-strong);
244
- $ax-border-brand-magenta: var(--ax-border-brand-magenta);
245
- $ax-border-brand-magenta-subtle: var(--ax-border-brand-magenta-subtle);
246
- $ax-border-brand-magenta-subtleA: var(--ax-border-brand-magenta-subtleA);
247
- $ax-border-brand-magenta-strong: var(--ax-border-brand-magenta-strong);
248
- $ax-border-brand-beige: var(--ax-border-brand-beige);
249
- $ax-border-brand-beige-subtle: var(--ax-border-brand-beige-subtle);
250
- $ax-border-brand-beige-subtleA: var(--ax-border-brand-beige-subtleA);
251
- $ax-border-brand-beige-strong: var(--ax-border-brand-beige-strong);
252
- $ax-border-brand-blue: var(--ax-border-brand-blue);
253
- $ax-border-brand-blue-subtle: var(--ax-border-brand-blue-subtle);
254
- $ax-border-brand-blue-subtleA: var(--ax-border-brand-blue-subtleA);
255
- $ax-border-brand-blue-strong: var(--ax-border-brand-blue-strong);
256
- $ax-border-meta-purple: var(--ax-border-meta-purple);
257
- $ax-border-meta-purple-subtle: var(--ax-border-meta-purple-subtle);
258
- $ax-border-meta-purple-subtleA: var(--ax-border-meta-purple-subtleA);
259
- $ax-border-meta-purple-strong: var(--ax-border-meta-purple-strong);
260
- $ax-border-meta-lime: var(--ax-border-meta-lime);
261
- $ax-border-meta-lime-subtle: var(--ax-border-meta-lime-subtle);
262
- $ax-border-meta-lime-subtleA: var(--ax-border-meta-lime-subtleA);
263
- $ax-border-meta-lime-strong: var(--ax-border-meta-lime-strong);
235
+ $ax-border-brand-1: var(--ax-border-brand-1);
236
+ $ax-border-brand-1-subtle: var(--ax-border-brand-1-subtle);
237
+ $ax-border-brand-1-subtleA: var(--ax-border-brand-1-subtleA);
238
+ $ax-border-brand-1-strong: var(--ax-border-brand-1-strong);
239
+ $ax-border-brand-2: var(--ax-border-brand-2);
240
+ $ax-border-brand-2-subtle: var(--ax-border-brand-2-subtle);
241
+ $ax-border-brand-2-subtleA: var(--ax-border-brand-2-subtleA);
242
+ $ax-border-brand-2-strong: var(--ax-border-brand-2-strong);
243
+ $ax-border-brand-3: var(--ax-border-brand-3);
244
+ $ax-border-brand-3-subtle: var(--ax-border-brand-3-subtle);
245
+ $ax-border-brand-3-subtleA: var(--ax-border-brand-3-subtleA);
246
+ $ax-border-brand-3-strong: var(--ax-border-brand-3-strong);
247
+ $ax-border-meta-1: var(--ax-border-meta-1);
248
+ $ax-border-meta-1-subtle: var(--ax-border-meta-1-subtle);
249
+ $ax-border-meta-1-subtleA: var(--ax-border-meta-1-subtleA);
250
+ $ax-border-meta-1-strong: var(--ax-border-meta-1-strong);
251
+ $ax-border-meta-2: var(--ax-border-meta-2);
252
+ $ax-border-meta-2-subtle: var(--ax-border-meta-2-subtle);
253
+ $ax-border-meta-2-subtleA: var(--ax-border-meta-2-subtleA);
254
+ $ax-border-meta-2-strong: var(--ax-border-meta-2-strong);
264
255
  $ax-border-default: var(--ax-border-default);
265
256
  $ax-border-subtle: var(--ax-border-subtle);
266
257
  $ax-border-subtleA: var(--ax-border-subtleA);
@@ -351,97 +342,98 @@
351
342
  $ax-info-200A: var(--ax-info-200A);
352
343
  $ax-info-300A: var(--ax-info-300A);
353
344
  $ax-info-400A: var(--ax-info-400A);
354
- $ax-brand-magenta-100: var(--ax-brand-magenta-100);
355
- $ax-brand-magenta-200: var(--ax-brand-magenta-200);
356
- $ax-brand-magenta-300: var(--ax-brand-magenta-300);
357
- $ax-brand-magenta-400: var(--ax-brand-magenta-400);
358
- $ax-brand-magenta-500: var(--ax-brand-magenta-500);
359
- $ax-brand-magenta-600: var(--ax-brand-magenta-600);
360
- $ax-brand-magenta-700: var(--ax-brand-magenta-700);
361
- $ax-brand-magenta-800: var(--ax-brand-magenta-800);
362
- $ax-brand-magenta-900: var(--ax-brand-magenta-900);
363
- $ax-brand-magenta-1000: var(--ax-brand-magenta-1000);
364
- $ax-brand-magenta-100A: var(--ax-brand-magenta-100A);
365
- $ax-brand-magenta-200A: var(--ax-brand-magenta-200A);
366
- $ax-brand-magenta-300A: var(--ax-brand-magenta-300A);
367
- $ax-brand-magenta-400A: var(--ax-brand-magenta-400A);
368
- $ax-brand-beige-100: var(--ax-brand-beige-100);
369
- $ax-brand-beige-200: var(--ax-brand-beige-200);
370
- $ax-brand-beige-300: var(--ax-brand-beige-300);
371
- $ax-brand-beige-400: var(--ax-brand-beige-400);
372
- $ax-brand-beige-500: var(--ax-brand-beige-500);
373
- $ax-brand-beige-600: var(--ax-brand-beige-600);
374
- $ax-brand-beige-700: var(--ax-brand-beige-700);
375
- $ax-brand-beige-800: var(--ax-brand-beige-800);
376
- $ax-brand-beige-900: var(--ax-brand-beige-900);
377
- $ax-brand-beige-1000: var(--ax-brand-beige-1000);
378
- $ax-brand-beige-100A: var(--ax-brand-beige-100A);
379
- $ax-brand-beige-200A: var(--ax-brand-beige-200A);
380
- $ax-brand-beige-300A: var(--ax-brand-beige-300A);
381
- $ax-brand-beige-400A: var(--ax-brand-beige-400A);
382
- $ax-brand-blue-100: var(--ax-brand-blue-100);
383
- $ax-brand-blue-200: var(--ax-brand-blue-200);
384
- $ax-brand-blue-300: var(--ax-brand-blue-300);
385
- $ax-brand-blue-400: var(--ax-brand-blue-400);
386
- $ax-brand-blue-500: var(--ax-brand-blue-500);
387
- $ax-brand-blue-600: var(--ax-brand-blue-600);
388
- $ax-brand-blue-700: var(--ax-brand-blue-700);
389
- $ax-brand-blue-800: var(--ax-brand-blue-800);
390
- $ax-brand-blue-900: var(--ax-brand-blue-900);
391
- $ax-brand-blue-1000: var(--ax-brand-blue-1000);
392
- $ax-brand-blue-100A: var(--ax-brand-blue-100A);
393
- $ax-brand-blue-200A: var(--ax-brand-blue-200A);
394
- $ax-brand-blue-300A: var(--ax-brand-blue-300A);
395
- $ax-brand-blue-400A: var(--ax-brand-blue-400A);
396
- $ax-meta-purple-100: var(--ax-meta-purple-100);
397
- $ax-meta-purple-200: var(--ax-meta-purple-200);
398
- $ax-meta-purple-300: var(--ax-meta-purple-300);
399
- $ax-meta-purple-400: var(--ax-meta-purple-400);
400
- $ax-meta-purple-500: var(--ax-meta-purple-500);
401
- $ax-meta-purple-600: var(--ax-meta-purple-600);
402
- $ax-meta-purple-700: var(--ax-meta-purple-700);
403
- $ax-meta-purple-800: var(--ax-meta-purple-800);
404
- $ax-meta-purple-900: var(--ax-meta-purple-900);
405
- $ax-meta-purple-1000: var(--ax-meta-purple-1000);
406
- $ax-meta-purple-100A: var(--ax-meta-purple-100A);
407
- $ax-meta-purple-200A: var(--ax-meta-purple-200A);
408
- $ax-meta-purple-300A: var(--ax-meta-purple-300A);
409
- $ax-meta-purple-400A: var(--ax-meta-purple-400A);
410
- $ax-meta-lime-100: var(--ax-meta-lime-100);
411
- $ax-meta-lime-200: var(--ax-meta-lime-200);
412
- $ax-meta-lime-300: var(--ax-meta-lime-300);
413
- $ax-meta-lime-400: var(--ax-meta-lime-400);
414
- $ax-meta-lime-500: var(--ax-meta-lime-500);
415
- $ax-meta-lime-600: var(--ax-meta-lime-600);
416
- $ax-meta-lime-700: var(--ax-meta-lime-700);
417
- $ax-meta-lime-800: var(--ax-meta-lime-800);
418
- $ax-meta-lime-900: var(--ax-meta-lime-900);
419
- $ax-meta-lime-1000: var(--ax-meta-lime-1000);
420
- $ax-meta-lime-100A: var(--ax-meta-lime-100A);
421
- $ax-meta-lime-200A: var(--ax-meta-lime-200A);
422
- $ax-meta-lime-300A: var(--ax-meta-lime-300A);
423
- $ax-meta-lime-400A: var(--ax-meta-lime-400A);
424
- $ax-spacing-0: var(--ax-spacing-0);
425
- $ax-spacing-1: var(--ax-spacing-1);
426
- $ax-spacing-2: var(--ax-spacing-2);
427
- $ax-spacing-3: var(--ax-spacing-3);
428
- $ax-spacing-4: var(--ax-spacing-4);
429
- $ax-spacing-5: var(--ax-spacing-5);
430
- $ax-spacing-6: var(--ax-spacing-6);
431
- $ax-spacing-7: var(--ax-spacing-7);
432
- $ax-spacing-8: var(--ax-spacing-8);
433
- $ax-spacing-9: var(--ax-spacing-9);
434
- $ax-spacing-10: var(--ax-spacing-10);
435
- $ax-spacing-11: var(--ax-spacing-11);
436
- $ax-spacing-12: var(--ax-spacing-12);
437
- $ax-spacing-14: var(--ax-spacing-14);
438
- $ax-spacing-16: var(--ax-spacing-16);
439
- $ax-spacing-18: var(--ax-spacing-18);
440
- $ax-spacing-20: var(--ax-spacing-20);
441
- $ax-spacing-24: var(--ax-spacing-24);
442
- $ax-spacing-32: var(--ax-spacing-32);
443
- $ax-spacing-05: var(--ax-spacing-05);
444
- $ax-spacing-1-alt: var(--ax-spacing-1-alt);
345
+ $ax-brand-1-100: var(--ax-brand-1-100);
346
+ $ax-brand-1-200: var(--ax-brand-1-200);
347
+ $ax-brand-1-300: var(--ax-brand-1-300);
348
+ $ax-brand-1-400: var(--ax-brand-1-400);
349
+ $ax-brand-1-500: var(--ax-brand-1-500);
350
+ $ax-brand-1-600: var(--ax-brand-1-600);
351
+ $ax-brand-1-700: var(--ax-brand-1-700);
352
+ $ax-brand-1-800: var(--ax-brand-1-800);
353
+ $ax-brand-1-900: var(--ax-brand-1-900);
354
+ $ax-brand-1-1000: var(--ax-brand-1-1000);
355
+ $ax-brand-1-100A: var(--ax-brand-1-100A);
356
+ $ax-brand-1-200A: var(--ax-brand-1-200A);
357
+ $ax-brand-1-300A: var(--ax-brand-1-300A);
358
+ $ax-brand-1-400A: var(--ax-brand-1-400A);
359
+ $ax-brand-2-100: var(--ax-brand-2-100);
360
+ $ax-brand-2-200: var(--ax-brand-2-200);
361
+ $ax-brand-2-300: var(--ax-brand-2-300);
362
+ $ax-brand-2-400: var(--ax-brand-2-400);
363
+ $ax-brand-2-500: var(--ax-brand-2-500);
364
+ $ax-brand-2-600: var(--ax-brand-2-600);
365
+ $ax-brand-2-700: var(--ax-brand-2-700);
366
+ $ax-brand-2-800: var(--ax-brand-2-800);
367
+ $ax-brand-2-900: var(--ax-brand-2-900);
368
+ $ax-brand-2-1000: var(--ax-brand-2-1000);
369
+ $ax-brand-2-100A: var(--ax-brand-2-100A);
370
+ $ax-brand-2-200A: var(--ax-brand-2-200A);
371
+ $ax-brand-2-300A: var(--ax-brand-2-300A);
372
+ $ax-brand-2-400A: var(--ax-brand-2-400A);
373
+ $ax-brand-3-100: var(--ax-brand-3-100);
374
+ $ax-brand-3-200: var(--ax-brand-3-200);
375
+ $ax-brand-3-300: var(--ax-brand-3-300);
376
+ $ax-brand-3-400: var(--ax-brand-3-400);
377
+ $ax-brand-3-500: var(--ax-brand-3-500);
378
+ $ax-brand-3-600: var(--ax-brand-3-600);
379
+ $ax-brand-3-700: var(--ax-brand-3-700);
380
+ $ax-brand-3-800: var(--ax-brand-3-800);
381
+ $ax-brand-3-900: var(--ax-brand-3-900);
382
+ $ax-brand-3-1000: var(--ax-brand-3-1000);
383
+ $ax-brand-3-100A: var(--ax-brand-3-100A);
384
+ $ax-brand-3-200A: var(--ax-brand-3-200A);
385
+ $ax-brand-3-300A: var(--ax-brand-3-300A);
386
+ $ax-brand-3-400A: var(--ax-brand-3-400A);
387
+ $ax-meta-1-100: var(--ax-meta-1-100);
388
+ $ax-meta-1-200: var(--ax-meta-1-200);
389
+ $ax-meta-1-300: var(--ax-meta-1-300);
390
+ $ax-meta-1-400: var(--ax-meta-1-400);
391
+ $ax-meta-1-500: var(--ax-meta-1-500);
392
+ $ax-meta-1-600: var(--ax-meta-1-600);
393
+ $ax-meta-1-700: var(--ax-meta-1-700);
394
+ $ax-meta-1-800: var(--ax-meta-1-800);
395
+ $ax-meta-1-900: var(--ax-meta-1-900);
396
+ $ax-meta-1-1000: var(--ax-meta-1-1000);
397
+ $ax-meta-1-100A: var(--ax-meta-1-100A);
398
+ $ax-meta-1-200A: var(--ax-meta-1-200A);
399
+ $ax-meta-1-300A: var(--ax-meta-1-300A);
400
+ $ax-meta-1-400A: var(--ax-meta-1-400A);
401
+ $ax-meta-2-100: var(--ax-meta-2-100);
402
+ $ax-meta-2-200: var(--ax-meta-2-200);
403
+ $ax-meta-2-300: var(--ax-meta-2-300);
404
+ $ax-meta-2-400: var(--ax-meta-2-400);
405
+ $ax-meta-2-500: var(--ax-meta-2-500);
406
+ $ax-meta-2-600: var(--ax-meta-2-600);
407
+ $ax-meta-2-700: var(--ax-meta-2-700);
408
+ $ax-meta-2-800: var(--ax-meta-2-800);
409
+ $ax-meta-2-900: var(--ax-meta-2-900);
410
+ $ax-meta-2-1000: var(--ax-meta-2-1000);
411
+ $ax-meta-2-100A: var(--ax-meta-2-100A);
412
+ $ax-meta-2-200A: var(--ax-meta-2-200A);
413
+ $ax-meta-2-300A: var(--ax-meta-2-300A);
414
+ $ax-meta-2-400A: var(--ax-meta-2-400A);
415
+ $ax-space-0: var(--ax-space-0);
416
+ $ax-space-1: var(--ax-space-1);
417
+ $ax-space-2: var(--ax-space-2);
418
+ $ax-space-4: var(--ax-space-4);
419
+ $ax-space-6: var(--ax-space-6);
420
+ $ax-space-8: var(--ax-space-8);
421
+ $ax-space-12: var(--ax-space-12);
422
+ $ax-space-16: var(--ax-space-16);
423
+ $ax-space-20: var(--ax-space-20);
424
+ $ax-space-24: var(--ax-space-24);
425
+ $ax-space-28: var(--ax-space-28);
426
+ $ax-space-32: var(--ax-space-32);
427
+ $ax-space-36: var(--ax-space-36);
428
+ $ax-space-40: var(--ax-space-40);
429
+ $ax-space-44: var(--ax-space-44);
430
+ $ax-space-48: var(--ax-space-48);
431
+ $ax-space-56: var(--ax-space-56);
432
+ $ax-space-64: var(--ax-space-64);
433
+ $ax-space-72: var(--ax-space-72);
434
+ $ax-space-80: var(--ax-space-80);
435
+ $ax-space-96: var(--ax-space-96);
436
+ $ax-space-128: var(--ax-space-128);
445
437
  $ax-border-radius-small: var(--ax-border-radius-small);
446
438
  $ax-border-radius-medium: var(--ax-border-radius-medium);
447
439
  $ax-border-radius-large: var(--ax-border-radius-large);
@@ -176,6 +176,28 @@ module.exports = {
176
176
  "ADataBorder4": "rgba(54, 141, 168, 1)",
177
177
  "ADataBorder5": "rgba(42, 167, 88, 1)",
178
178
  "ADataBorder6": "rgba(130, 105, 162, 1)",
179
+ "ASpace128": "8rem",
180
+ "ASpace96": "6rem",
181
+ "ASpace80": "5rem",
182
+ "ASpace72": "4.5rem",
183
+ "ASpace64": "4rem",
184
+ "ASpace56": "3.5rem",
185
+ "ASpace48": "3rem",
186
+ "ASpace44": "2.75rem",
187
+ "ASpace40": "2.5rem",
188
+ "ASpace36": "2.25rem",
189
+ "ASpace32": "2rem",
190
+ "ASpace28": "1.75rem",
191
+ "ASpace24": "1.5rem",
192
+ "ASpace20": "1.25rem",
193
+ "ASpace16": "1rem",
194
+ "ASpace12": ".75rem",
195
+ "ASpace8": ".5rem",
196
+ "ASpace6": ".375rem",
197
+ "ASpace4": ".25rem",
198
+ "ASpace2": ".125rem",
199
+ "ASpace1": ".0625rem",
200
+ "ASpace0": "0rem",
179
201
  "ATransparent": "rgba(255, 255, 255, 0)",
180
202
  "AWhite": "rgba(255, 255, 255, 1)",
181
203
  "ANavRed": "rgba(195, 0, 0, 1)",
package/dist/tokens.css CHANGED
@@ -3,7 +3,7 @@
3
3
  */
4
4
 
5
5
  :root, :host {
6
- --ax-version: "7.9.0";
6
+ --ax-version: "7.9.2";
7
7
  --a-spacing-1-alt: 0.375rem;
8
8
  --a-spacing-05: 0.125rem;
9
9
  --a-spacing-32: 8rem;
@@ -133,6 +133,28 @@
133
133
  --a-nav-red: rgba(195, 0, 0, 1);
134
134
  --a-white: rgba(255, 255, 255, 1);
135
135
  --a-transparent: rgba(255, 255, 255, 0);
136
+ --a-space-0: 0rem;
137
+ --a-space-1: .0625rem;
138
+ --a-space-2: .125rem;
139
+ --a-space-4: .25rem;
140
+ --a-space-6: .375rem;
141
+ --a-space-8: .5rem;
142
+ --a-space-12: .75rem;
143
+ --a-space-16: 1rem;
144
+ --a-space-20: 1.25rem;
145
+ --a-space-24: 1.5rem;
146
+ --a-space-28: 1.75rem;
147
+ --a-space-32: 2rem;
148
+ --a-space-36: 2.25rem;
149
+ --a-space-40: 2.5rem;
150
+ --a-space-44: 2.75rem;
151
+ --a-space-48: 3rem;
152
+ --a-space-56: 3.5rem;
153
+ --a-space-64: 4rem;
154
+ --a-space-72: 4.5rem;
155
+ --a-space-80: 5rem;
156
+ --a-space-96: 6rem;
157
+ --a-space-128: 8rem;
136
158
  --a-border-radius-full: 9999px;
137
159
  --a-border-radius-xlarge: 12px;
138
160
  --a-border-radius-large: 8px;
package/dist/tokens.d.ts CHANGED
@@ -175,6 +175,28 @@ export const ADataBorder3 : "rgba(199, 115, 0, 1)";
175
175
  export const ADataBorder4 : "rgba(54, 141, 168, 1)";
176
176
  export const ADataBorder5 : "rgba(42, 167, 88, 1)";
177
177
  export const ADataBorder6 : "rgba(130, 105, 162, 1)";
178
+ export const ASpace128 : "8rem";
179
+ export const ASpace96 : "6rem";
180
+ export const ASpace80 : "5rem";
181
+ export const ASpace72 : "4.5rem";
182
+ export const ASpace64 : "4rem";
183
+ export const ASpace56 : "3.5rem";
184
+ export const ASpace48 : "3rem";
185
+ export const ASpace44 : "2.75rem";
186
+ export const ASpace40 : "2.5rem";
187
+ export const ASpace36 : "2.25rem";
188
+ export const ASpace32 : "2rem";
189
+ export const ASpace28 : "1.75rem";
190
+ export const ASpace24 : "1.5rem";
191
+ export const ASpace20 : "1.25rem";
192
+ export const ASpace16 : "1rem";
193
+ export const ASpace12 : ".75rem";
194
+ export const ASpace8 : ".5rem";
195
+ export const ASpace6 : ".375rem";
196
+ export const ASpace4 : ".25rem";
197
+ export const ASpace2 : ".125rem";
198
+ export const ASpace1 : ".0625rem";
199
+ export const ASpace0 : "0rem";
178
200
  export const ATransparent : "rgba(255, 255, 255, 0)";
179
201
  export const AWhite : "rgba(255, 255, 255, 1)";
180
202
  export const ANavRed : "rgba(195, 0, 0, 1)";