@navikt/ds-tokens 0.6.0 → 0.7.0

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 (8) hide show
  1. package/dist/tokens-cjs.js +175 -3750
  2. package/dist/tokens.css +150 -151
  3. package/dist/tokens.js +150 -151
  4. package/dist/tokens.less +150 -151
  5. package/dist/tokens.scss +150 -151
  6. package/package.json +2 -3
  7. package/src/colors.json +449 -1
  8. package/src/index.js +8 -183
package/dist/tokens.css CHANGED
@@ -1,17 +1,121 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 11 Nov 2021 17:26:34 GMT
3
+ * Generated on Tue, 07 Dec 2021 15:09:16 GMT
4
4
  */
5
5
 
6
6
  :root {
7
- --navds-checkmark-image-blue: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMyAxMCI+ICAgIDxnPiAgICA8cGF0aCBmaWxsPSIjMDA2N0M1IiBkPSJNNCwxMGMtMC40LDAtMC44LTAuMS0xLjEtMC40TDAuNCw3LjFDMC4xLDYuOCwwLDYuNCwwLDZzMC4yLTAuOCwwLjUtMS4xQzEsNC40LDIsNC40LDIuNSw0LjlMNCw2LjRsNi40LTYgICAgQzEwLjgsMC4xLDExLjEsMCwxMS41LDBjMC40LDAsMC44LDAuMiwxLDAuNWMwLjYsMC42LDAuNSwxLjYtMC4xLDIuMXYwTDUsOS42QzQuNyw5LjksNC40LDEwLDQsMTB6IE0xMS44LDEuOUwxMS44LDEuOSAgICBDMTEuOCwxLjksMTEuOCwxLjksMTEuOCwxLjl6IE0xMS4yLDEuMUMxMS4yLDEuMSwxMS4yLDEuMSwxMS4yLDEuMUwxMS4yLDEuMXoiLz4gICAgPC9nPjwvc3ZnPg==);
8
- --navds-checkmark-image-white: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMyAxMCI+ICAgIDxnPiAgICA8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNNCwxMGMtMC40LDAtMC44LTAuMS0xLjEtMC40TDAuNCw3LjFDMC4xLDYuOCwwLDYuNCwwLDZzMC4yLTAuOCwwLjUtMS4xQzEsNC40LDIsNC40LDIuNSw0LjlMNCw2LjRsNi40LTYgICAgQzEwLjgsMC4xLDExLjEsMCwxMS41LDBjMC40LDAsMC44LDAuMiwxLDAuNWMwLjYsMC42LDAuNSwxLjYtMC4xLDIuMXYwTDUsOS42QzQuNyw5LjksNC40LDEwLDQsMTB6IE0xMS44LDEuOUwxMS44LDEuOSAgICBDMTEuOCwxLjksMTEuOCwxLjksMTEuOCwxLjl6IE0xMS4yLDEuMUMxMS4yLDEuMSwxMS4yLDEuMSwxMS4yLDEuMUwxMS4yLDEuMXoiLz4gICAgPC9nPjwvc3ZnPg==);
9
- --navds-sidebar-sticky-offset: 0;
7
+ --navds-spacing-32: 8rem;
8
+ --navds-spacing-24: 6rem;
9
+ --navds-spacing-20: 5rem;
10
+ --navds-spacing-18: 4.5rem;
11
+ --navds-spacing-16: 4rem;
12
+ --navds-spacing-14: 3.5rem;
13
+ --navds-spacing-12: 3rem;
14
+ --navds-spacing-11: 2.75rem;
15
+ --navds-spacing-10: 2.5rem;
16
+ --navds-spacing-9: 2.25rem;
17
+ --navds-spacing-8: 2rem;
18
+ --navds-spacing-7: 1.75rem;
19
+ --navds-spacing-6: 1.5rem;
20
+ --navds-spacing-5: 1.25rem;
21
+ --navds-spacing-4: 1rem;
22
+ --navds-spacing-3: 0.75rem;
23
+ --navds-spacing-2: 0.5rem;
24
+ --navds-spacing-1: 0.25rem;
25
+ --navds-global-color-white: rgba(255, 255, 255, 1);
26
+ --navds-global-color-transparent: rgba(255, 255, 255, 0);
27
+ --navds-global-color-red-900: rgba(72, 9, 0, 1);
28
+ --navds-global-color-red-800: rgba(106, 18, 4, 1);
29
+ --navds-global-color-red-700: rgba(136, 29, 12, 1);
30
+ --navds-global-color-red-600: rgba(163, 42, 23, 1);
31
+ --navds-global-color-red-500: rgba(186, 58, 38, 1);
32
+ --navds-global-color-red-400: rgba(208, 92, 74, 1);
33
+ --navds-global-color-red-300: rgba(225, 128, 113, 1);
34
+ --navds-global-color-red-200: rgba(239, 168, 157, 1);
35
+ --navds-global-color-red-100: rgba(249, 210, 204, 1);
36
+ --navds-global-color-red-50: rgba(253, 232, 230, 1);
37
+ --navds-global-color-purple-900: rgba(31, 20, 47, 1);
38
+ --navds-global-color-purple-800: rgba(48, 31, 70, 1);
39
+ --navds-global-color-purple-700: rgba(65, 43, 93, 1);
40
+ --navds-global-color-purple-600: rgba(82, 56, 116, 1);
41
+ --navds-global-color-purple-500: rgba(99, 70, 137, 1);
42
+ --navds-global-color-purple-400: rgba(130, 105, 162, 1);
43
+ --navds-global-color-purple-300: rgba(161, 141, 187, 1);
44
+ --navds-global-color-purple-200: rgba(192, 178, 210, 1);
45
+ --navds-global-color-purple-100: rgba(224, 216, 233, 1);
46
+ --navds-global-color-purple-50: rgba(239, 236, 244, 1);
47
+ --navds-global-color-orange-900: rgba(82, 51, 0, 1);
48
+ --navds-global-color-orange-800: rgba(125, 76, 0, 1);
49
+ --navds-global-color-orange-700: rgba(168, 100, 0, 1);
50
+ --navds-global-color-orange-600: rgba(212, 123, 0, 1);
51
+ --navds-global-color-orange-500: rgba(255, 145, 0, 1);
52
+ --navds-global-color-orange-400: rgba(255, 170, 51, 1);
53
+ --navds-global-color-orange-300: rgba(255, 193, 102, 1);
54
+ --navds-global-color-orange-200: rgba(255, 215, 153, 1);
55
+ --navds-global-color-orange-100: rgba(255, 236, 204, 1);
56
+ --navds-global-color-orange-50: rgba(255, 249, 240, 1);
57
+ --navds-global-color-nav-red: rgba(195, 0, 0, 1);
58
+ --navds-global-color-limegreen-900: rgba(71, 78, 0, 1);
59
+ --navds-global-color-limegreen-800: rgba(102, 110, 0, 1);
60
+ --navds-global-color-limegreen-700: rgba(127, 137, 0, 1);
61
+ --navds-global-color-limegreen-600: rgba(147, 158, 0, 1);
62
+ --navds-global-color-limegreen-500: rgba(162, 173, 0, 1);
63
+ --navds-global-color-limegreen-400: rgba(193, 203, 51, 1);
64
+ --navds-global-color-limegreen-300: rgba(217, 227, 102, 1);
65
+ --navds-global-color-limegreen-200: rgba(236, 243, 153, 1);
66
+ --navds-global-color-limegreen-100: rgba(249, 252, 204, 1);
67
+ --navds-global-color-limegreen-50: rgba(253, 255, 230, 1);
68
+ --navds-global-color-lightblue-900: rgba(19, 72, 82, 1);
69
+ --navds-global-color-lightblue-800: rgba(35, 107, 125, 1);
70
+ --navds-global-color-lightblue-700: rgba(54, 141, 168, 1);
71
+ --navds-global-color-lightblue-600: rgba(76, 173, 205, 1);
72
+ --navds-global-color-lightblue-500: rgba(102, 203, 236, 1);
73
+ --navds-global-color-lightblue-400: rgba(124, 218, 248, 1);
74
+ --navds-global-color-lightblue-300: rgba(151, 230, 255, 1);
75
+ --navds-global-color-lightblue-200: rgba(181, 241, 255, 1);
76
+ --navds-global-color-lightblue-100: rgba(216, 249, 255, 1);
77
+ --navds-global-color-lightblue-50: rgba(235, 252, 255, 1);
78
+ --navds-global-color-green-900: rgba(0, 59, 15, 1);
79
+ --navds-global-color-green-800: rgba(0, 85, 25, 1);
80
+ --navds-global-color-green-700: rgba(0, 106, 35, 1);
81
+ --navds-global-color-green-600: rgba(0, 124, 46, 1);
82
+ --navds-global-color-green-500: rgba(6, 137, 58, 1);
83
+ --navds-global-color-green-400: rgba(51, 170, 95, 1);
84
+ --navds-global-color-green-300: rgba(102, 199, 134, 1);
85
+ --navds-global-color-green-200: rgba(153, 222, 173, 1);
86
+ --navds-global-color-green-100: rgba(204, 241, 214, 1);
87
+ --navds-global-color-green-50: rgba(243, 252, 245, 1);
88
+ --navds-global-color-gray-900: rgba(38, 38, 38, 1);
89
+ --navds-global-color-gray-800: rgba(79, 79, 79, 1);
90
+ --navds-global-color-gray-600: rgba(106, 106, 106, 1);
91
+ --navds-global-color-gray-400: rgba(160, 160, 160, 1);
92
+ --navds-global-color-gray-200: rgba(201, 201, 201, 1);
93
+ --navds-global-color-gray-100: rgba(241, 241, 241, 1);
94
+ --navds-global-color-gray-50: rgba(247, 247, 247, 1);
95
+ --navds-global-color-deepblue-900: rgba(0, 36, 58, 1);
96
+ --navds-global-color-deepblue-800: rgba(0, 52, 83, 1);
97
+ --navds-global-color-deepblue-700: rgba(0, 67, 103, 1);
98
+ --navds-global-color-deepblue-600: rgba(0, 80, 119, 1);
99
+ --navds-global-color-deepblue-500: rgba(0, 91, 130, 1);
100
+ --navds-global-color-deepblue-400: rgba(51, 128, 165, 1);
101
+ --navds-global-color-deepblue-300: rgba(102, 163, 196, 1);
102
+ --navds-global-color-deepblue-200: rgba(153, 196, 221, 1);
103
+ --navds-global-color-deepblue-100: rgba(204, 226, 240, 1);
104
+ --navds-global-color-deepblue-50: rgba(230, 241, 248, 1);
105
+ --navds-global-color-blue-900: rgba(0, 34, 82, 1);
106
+ --navds-global-color-blue-800: rgba(0, 52, 125, 1);
107
+ --navds-global-color-blue-700: rgba(0, 69, 156, 1);
108
+ --navds-global-color-blue-600: rgba(0, 86, 180, 1);
109
+ --navds-global-color-blue-500: rgba(0, 103, 197, 1);
110
+ --navds-global-color-blue-400: rgba(51, 134, 224, 1);
111
+ --navds-global-color-blue-300: rgba(102, 165, 244, 1);
112
+ --navds-global-color-blue-200: rgba(153, 195, 255, 1);
113
+ --navds-global-color-blue-100: rgba(204, 225, 255, 1);
114
+ --navds-global-color-blue-50: rgba(230, 240, 255, 1);
10
115
  --navds-z-index-focus: 10;
11
116
  --navds-z-index-popover: 1000;
12
117
  --navds-z-index-modal: 2000;
13
- --navds-layout-background-white: #ffffff;
14
- --navds-content-container-max-width: 79.5rem;
118
+ --navds-shadow-card: 0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14);
15
119
  --navds-font-weight-regular: 400;
16
120
  --navds-font-weight-bold: 600;
17
121
  --navds-font-size-small: 0.875rem;
@@ -34,149 +138,44 @@
34
138
  --navds-font-line-height-heading-xlarge: 2.5rem;
35
139
  --navds-font-line-height-heading-2xlarge: 3.25rem;
36
140
  --navds-font-family: "Source Sans Pro", Arial, sans-serif;
37
- --navds-border-radius: 4px;
38
- --navds-color-modal-overlay: rgba(38, 38, 38, 0.7);
39
- --navds-color-limegreen-90: #474E00;
40
- --navds-color-limegreen-80: #666E00;
41
- --navds-color-limegreen-70: #7F8900;
42
- --navds-color-limegreen-60: #939E00;
43
- --navds-color-limegreen-50: #a2ad00;
44
- --navds-color-limegreen-40: #C1CB33;
45
- --navds-color-limegreen-30: #D9E366;
46
- --navds-color-limegreen-20: #ECF399;
47
- --navds-color-limegreen-10: #F9FCCC;
48
- --navds-color-purple-90: #1F142F;
49
- --navds-color-purple-80: #301F46;
50
- --navds-color-purple-70: #412B5D;
51
- --navds-color-purple-60: #523874;
52
- --navds-color-purple-50: #634689;
53
- --navds-color-purple-40: #8269A2;
54
- --navds-color-purple-30: #A18DBB;
55
- --navds-color-purple-20: #C0B2D2;
56
- --navds-color-purple-10: #E0D8E9;
57
- --navds-color-red-90: #480900;
58
- --navds-color-red-80: #6A1204;
59
- --navds-color-red-70: #881D0C;
60
- --navds-color-red-60: #A32A17;
61
- --navds-color-red-50: #BA3A26;
62
- --navds-color-red-40: #D05C4A;
63
- --navds-color-red-30: #E18071;
64
- --navds-color-red-20: #EFA89D;
65
- --navds-color-red-10: #F9D2CC;
66
- --navds-color-green-90: #003B0F;
67
- --navds-color-green-80: #005519;
68
- --navds-color-green-70: #006A23;
69
- --navds-color-green-60: #007C2E;
70
- --navds-color-green-50: #06893A;
71
- --navds-color-green-40: #33AA5F;
72
- --navds-color-green-30: #66C786;
73
- --navds-color-green-20: #99DEAD;
74
- --navds-color-green-10: #CCF1D6;
75
- --navds-color-orange-90: #523300;
76
- --navds-color-orange-80: #7D4C00;
77
- --navds-color-orange-70: #A86400;
78
- --navds-color-orange-60: #D47B00;
79
- --navds-color-orange-50: #FF9100;
80
- --navds-color-orange-40: #FFAA33;
81
- --navds-color-orange-30: #FFC166;
82
- --navds-color-orange-20: #FFD799;
83
- --navds-color-orange-10: #FFECCC;
84
- --navds-color-lightblue-90: #134852;
85
- --navds-color-lightblue-80: #236B7D;
86
- --navds-color-lightblue-70: #368DA8;
87
- --navds-color-lightblue-60: #4CADCD;
88
- --navds-color-lightblue-50: #66CBEC;
89
- --navds-color-lightblue-40: #7CDAF8;
90
- --navds-color-lightblue-30: #97E6FF;
91
- --navds-color-lightblue-20: #B5F1FF;
92
- --navds-color-lightblue-10: #D8F9FF;
93
- --navds-color-deepblue-90: #00243A;
94
- --navds-color-deepblue-80: #003453;
95
- --navds-color-deepblue-70: #004367;
96
- --navds-color-deepblue-60: #005077;
97
- --navds-color-deepblue-50: #005B82;
98
- --navds-color-deepblue-40: #3380A5;
99
- --navds-color-deepblue-30: #66A3C4;
100
- --navds-color-deepblue-20: #99C4DD;
101
- --navds-color-deepblue-10: #CCE2F0;
102
- --navds-color-blue-90: #002252;
103
- --navds-color-blue-80: #00347D;
104
- --navds-color-blue-70: #00459C;
105
- --navds-color-blue-60: #0056B4;
106
- --navds-color-blue-50: #0067c5;
107
- --navds-color-blue-40: #3386E0;
108
- --navds-color-blue-30: #66A5F4;
109
- --navds-color-blue-20: #99C3FF;
110
- --navds-color-blue-10: #CCE1FF;
111
- --navds-color-gray-90: #262626;
112
- --navds-color-gray-80: #4F4F4F;
113
- --navds-color-gray-60: #6A6A6A;
114
- --navds-color-gray-40: #A0A0A0;
115
- --navds-color-gray-20: #C9C9C9;
116
- --navds-color-gray-10: #F1F1F1;
117
- --navds-color-darkgray: #262626;
118
- --navds-color-white: #ffffff;
119
- --navds-spacing-32: 8rem;
120
- --navds-spacing-24: 6rem;
121
- --navds-spacing-20: 5rem;
122
- --navds-spacing-18: 4.5rem;
123
- --navds-spacing-16: 4rem;
124
- --navds-spacing-14: 3.5rem;
125
- --navds-spacing-12: 3rem;
126
- --navds-spacing-11: 2.75rem;
127
- --navds-spacing-10: 2.5rem;
128
- --navds-spacing-9: 2.25rem;
129
- --navds-spacing-8: 2rem;
130
- --navds-spacing-7: 1.75rem;
131
- --navds-spacing-6: 1.5rem;
132
- --navds-spacing-5: 1.25rem;
133
- --navds-spacing-4: 1rem;
134
- --navds-spacing-3: 0.75rem;
135
- --navds-spacing-2: 0.5rem;
136
- --navds-spacing-1: 0.25rem;
137
- --navds-layout-padding-medium-and-larger: var(--navds-spacing-10);
138
- --navds-layout-padding-small: var(--navds-spacing-4);
139
- --navds-layout-background-gray: var(--navds-color-gray-10);
140
- --navds-grid-gutter-medium-and-larger: var(--navds-spacing-6);
141
- --navds-grid-gutter-small: var(--navds-spacing-4);
142
- --navds-content-container-padding-medium-and-larger: var(--navds-spacing-6);
143
- --navds-content-container-padding-small: var(--navds-spacing-4);
144
- --navds-text-shadow: 0 0 0 2px var(--navds-color-blue-80);
145
- --navds-text-focus: var(--navds-color-blue-80);
146
- --navds-shadow-focus-on-dark: 0 0 0 3px var(--navds-color-orange-40);
147
- --navds-shadow-focus: 0 0 0 3px var(--navds-color-blue-80);
148
- --navds-panel-hover: 1px solid var(--navds-color-blue-50);
149
- --navds-color-tag-success-background: var(--navds-color-green-10);
150
- --navds-color-tag-success-border: var(--navds-color-green-50);
151
- --navds-color-tag-info-background: var(--navds-color-lightblue-10);
152
- --navds-color-tag-info-border: var(--navds-color-lightblue-70);
153
- --navds-color-tag-warning-background: var(--navds-color-orange-10);
154
- --navds-color-tag-warning-border: var(--navds-color-orange-60);
155
- --navds-color-tag-error-background: var(--navds-color-red-10);
156
- --navds-color-tag-error-border: var(--navds-color-red-50);
157
- --navds-color-hover: var(--navds-color-gray-40);
158
- --navds-color-text-error: var(--navds-color-red-50);
159
- --navds-color-text-link: var(--navds-color-blue-50);
160
- --navds-color-text-disabled: var(--navds-color-gray-60);
161
- --navds-color-text-inverse: var(--navds-color-white);
162
- --navds-color-text-primary: var(--navds-color-gray-90);
163
- --navds-color-background: var(--navds-color-white);
164
- --navds-color-border: var(--navds-color-gray-40);
165
- --navds-color-success-background: var(--navds-color-green-10);
166
- --navds-color-success-border: var(--navds-color-green-50);
167
- --navds-color-info-background: var(--navds-color-lightblue-10);
168
- --navds-color-info-border: var(--navds-color-lightblue-70);
169
- --navds-color-warning-background: var(--navds-color-orange-10);
170
- --navds-color-warning-border: var(--navds-color-orange-60);
171
- --navds-color-error-background: var(--navds-color-red-10);
172
- --navds-color-error-border: var(--navds-color-red-50);
173
- --navds-color-danger-active: var(--navds-color-red-70);
174
- --navds-color-danger-hover: var(--navds-color-red-60);
175
- --navds-color-danger-default: var(--navds-color-red-50);
176
- --navds-color-action-active: var(--navds-color-deepblue-50);
177
- --navds-color-action-hover: var(--navds-color-blue-60);
178
- --navds-color-action-default: var(--navds-color-blue-50);
179
- --navds-color-disabled: var(--navds-color-gray-40);
180
- --navds-shadow-hover: var(--navds-color-hover) 0 2px 1px 0;
181
- --navds-border-default: 1px solid var(--navds-color-border);
141
+ --navds-semantic-color-text: var(--navds-global-color-gray-900);
142
+ --navds-semantic-color-text-muted: var(--navds-global-color-gray-600);
143
+ --navds-semantic-color-text-inverted: var(--navds-global-color-white);
144
+ --navds-semantic-color-link: var(--navds-global-color-blue-500);
145
+ --navds-semantic-color-link-visited: var(--navds-global-color-purple-500);
146
+ --navds-semantic-color-interaction-primary: var(--navds-global-color-blue-500);
147
+ --navds-semantic-color-interaction-primary-selected: var(--navds-global-color-deepblue-500);
148
+ --navds-semantic-color-interaction-primary-hover: var(--navds-global-color-blue-600);
149
+ --navds-semantic-color-interaction-primary-hover-subtle: var(--navds-global-color-blue-50);
150
+ --navds-semantic-color-interaction-danger: var(--navds-global-color-red-500);
151
+ --navds-semantic-color-interaction-danger-selected: var(--navds-global-color-red-700);
152
+ --navds-semantic-color-interaction-danger-hover: var(--navds-global-color-red-600);
153
+ --navds-semantic-color-focus: var(--navds-global-color-blue-800);
154
+ --navds-semantic-color-focus-inverted: var(--navds-global-color-blue-200);
155
+ --navds-semantic-color-feedback-warning-icon: var(--navds-global-color-orange-500);
156
+ --navds-semantic-color-feedback-warning-border: var(--navds-global-color-orange-600);
157
+ --navds-semantic-color-feedback-warning-background: var(--navds-global-color-orange-100);
158
+ --navds-semantic-color-feedback-success-icon: var(--navds-global-color-green-600);
159
+ --navds-semantic-color-feedback-success-border: var(--navds-global-color-green-500);
160
+ --navds-semantic-color-feedback-success-background: var(--navds-global-color-green-100);
161
+ --navds-semantic-color-feedback-info-icon: var(--navds-global-color-lightblue-700);
162
+ --navds-semantic-color-feedback-info-border: var(--navds-global-color-lightblue-700);
163
+ --navds-semantic-color-feedback-info-background: var(--navds-global-color-lightblue-100);
164
+ --navds-semantic-color-feedback-danger-text: var(--navds-global-color-red-500);
165
+ --navds-semantic-color-feedback-danger-icon: var(--navds-global-color-red-500);
166
+ --navds-semantic-color-feedback-danger-border: var(--navds-global-color-red-500);
167
+ --navds-semantic-color-feedback-danger-background: var(--navds-global-color-red-100);
168
+ --navds-semantic-color-divider: var(--navds-global-color-gray-200);
169
+ --navds-semantic-color-component-background-light: var(--navds-global-color-white);
170
+ --navds-semantic-color-component-background-inverted: var(--navds-global-color-gray-900);
171
+ --navds-semantic-color-component-background-alternate: var(--navds-global-color-gray-50);
172
+ --navds-semantic-color-canvas-background: var(--navds-global-color-gray-100);
173
+ --navds-semantic-color-canvas-background-light: var(--navds-global-color-white);
174
+ --navds-semantic-color-canvas-background-inverted: var(--navds-global-color-gray-900);
175
+ --navds-semantic-color-border: var(--navds-global-color-gray-600);
176
+ --navds-semantic-color-border-muted: var(--navds-global-color-gray-400);
177
+ --navds-semantic-color-border-inverted: var(--navds-global-color-gray-200);
178
+ --navds-shadow-popover: 0 2px 4px 0 var(--navds-global-color-gray-200);
179
+ --navds-shadow-focus-inverted: 0 0 0 3px var(--navds-semantic-color-focus-inverted);
180
+ --navds-shadow-focus: 0 0 0 3px var(--navds-semantic-color-focus);
182
181
  }
package/dist/tokens.js CHANGED
@@ -1,141 +1,8 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 11 Nov 2021 17:26:34 GMT
3
+ * Generated on Tue, 07 Dec 2021 15:09:16 GMT
4
4
  */
5
5
 
6
- export const NavdsSpacing1 = "0.25rem";
7
- export const NavdsSpacing2 = "0.5rem";
8
- export const NavdsSpacing3 = "0.75rem";
9
- export const NavdsSpacing4 = "1rem";
10
- export const NavdsSpacing5 = "1.25rem";
11
- export const NavdsSpacing6 = "1.5rem";
12
- export const NavdsSpacing7 = "1.75rem";
13
- export const NavdsSpacing8 = "2rem";
14
- export const NavdsSpacing9 = "2.25rem";
15
- export const NavdsSpacing10 = "2.5rem";
16
- export const NavdsSpacing11 = "2.75rem";
17
- export const NavdsSpacing12 = "3rem";
18
- export const NavdsSpacing14 = "3.5rem";
19
- export const NavdsSpacing16 = "4rem";
20
- export const NavdsSpacing18 = "4.5rem";
21
- export const NavdsSpacing20 = "5rem";
22
- export const NavdsSpacing24 = "6rem";
23
- export const NavdsSpacing32 = "8rem";
24
- export const NavdsColorWhite = "#ffffff";
25
- export const NavdsColorDarkgray = "#262626";
26
- export const NavdsColorGray10 = "#F1F1F1";
27
- export const NavdsColorGray20 = "#C9C9C9";
28
- export const NavdsColorGray40 = "#A0A0A0";
29
- export const NavdsColorGray60 = "#6A6A6A";
30
- export const NavdsColorGray80 = "#4F4F4F";
31
- export const NavdsColorGray90 = "#262626";
32
- export const NavdsColorBlue10 = "#CCE1FF";
33
- export const NavdsColorBlue20 = "#99C3FF";
34
- export const NavdsColorBlue30 = "#66A5F4";
35
- export const NavdsColorBlue40 = "#3386E0";
36
- export const NavdsColorBlue50 = "#0067c5";
37
- export const NavdsColorBlue60 = "#0056B4";
38
- export const NavdsColorBlue70 = "#00459C";
39
- export const NavdsColorBlue80 = "#00347D";
40
- export const NavdsColorBlue90 = "#002252";
41
- export const NavdsColorDeepblue10 = "#CCE2F0";
42
- export const NavdsColorDeepblue20 = "#99C4DD";
43
- export const NavdsColorDeepblue30 = "#66A3C4";
44
- export const NavdsColorDeepblue40 = "#3380A5";
45
- export const NavdsColorDeepblue50 = "#005B82";
46
- export const NavdsColorDeepblue60 = "#005077";
47
- export const NavdsColorDeepblue70 = "#004367";
48
- export const NavdsColorDeepblue80 = "#003453";
49
- export const NavdsColorDeepblue90 = "#00243A";
50
- export const NavdsColorLightblue10 = "#D8F9FF";
51
- export const NavdsColorLightblue20 = "#B5F1FF";
52
- export const NavdsColorLightblue30 = "#97E6FF";
53
- export const NavdsColorLightblue40 = "#7CDAF8";
54
- export const NavdsColorLightblue50 = "#66CBEC";
55
- export const NavdsColorLightblue60 = "#4CADCD";
56
- export const NavdsColorLightblue70 = "#368DA8";
57
- export const NavdsColorLightblue80 = "#236B7D";
58
- export const NavdsColorLightblue90 = "#134852";
59
- export const NavdsColorOrange10 = "#FFECCC";
60
- export const NavdsColorOrange20 = "#FFD799";
61
- export const NavdsColorOrange30 = "#FFC166";
62
- export const NavdsColorOrange40 = "#FFAA33";
63
- export const NavdsColorOrange50 = "#FF9100";
64
- export const NavdsColorOrange60 = "#D47B00";
65
- export const NavdsColorOrange70 = "#A86400";
66
- export const NavdsColorOrange80 = "#7D4C00";
67
- export const NavdsColorOrange90 = "#523300";
68
- export const NavdsColorGreen10 = "#CCF1D6";
69
- export const NavdsColorGreen20 = "#99DEAD";
70
- export const NavdsColorGreen30 = "#66C786";
71
- export const NavdsColorGreen40 = "#33AA5F";
72
- export const NavdsColorGreen50 = "#06893A";
73
- export const NavdsColorGreen60 = "#007C2E";
74
- export const NavdsColorGreen70 = "#006A23";
75
- export const NavdsColorGreen80 = "#005519";
76
- export const NavdsColorGreen90 = "#003B0F";
77
- export const NavdsColorRed10 = "#F9D2CC";
78
- export const NavdsColorRed20 = "#EFA89D";
79
- export const NavdsColorRed30 = "#E18071";
80
- export const NavdsColorRed40 = "#D05C4A";
81
- export const NavdsColorRed50 = "#BA3A26";
82
- export const NavdsColorRed60 = "#A32A17";
83
- export const NavdsColorRed70 = "#881D0C";
84
- export const NavdsColorRed80 = "#6A1204";
85
- export const NavdsColorRed90 = "#480900";
86
- export const NavdsColorPurple10 = "#E0D8E9";
87
- export const NavdsColorPurple20 = "#C0B2D2";
88
- export const NavdsColorPurple30 = "#A18DBB";
89
- export const NavdsColorPurple40 = "#8269A2";
90
- export const NavdsColorPurple50 = "#634689";
91
- export const NavdsColorPurple60 = "#523874";
92
- export const NavdsColorPurple70 = "#412B5D";
93
- export const NavdsColorPurple80 = "#301F46";
94
- export const NavdsColorPurple90 = "#1F142F";
95
- export const NavdsColorLimegreen10 = "#F9FCCC";
96
- export const NavdsColorLimegreen20 = "#ECF399";
97
- export const NavdsColorLimegreen30 = "#D9E366";
98
- export const NavdsColorLimegreen40 = "#C1CB33";
99
- export const NavdsColorLimegreen50 = "#a2ad00";
100
- export const NavdsColorLimegreen60 = "#939E00";
101
- export const NavdsColorLimegreen70 = "#7F8900";
102
- export const NavdsColorLimegreen80 = "#666E00";
103
- export const NavdsColorLimegreen90 = "#474E00";
104
- export const NavdsColorDisabled = "#A0A0A0";
105
- export const NavdsColorActionDefault = "#0067c5";
106
- export const NavdsColorActionHover = "#0056B4";
107
- export const NavdsColorActionActive = "#005B82";
108
- export const NavdsColorDangerDefault = "#BA3A26";
109
- export const NavdsColorDangerHover = "#A32A17";
110
- export const NavdsColorDangerActive = "#881D0C";
111
- export const NavdsColorErrorBorder = "#BA3A26";
112
- export const NavdsColorErrorBackground = "#F9D2CC";
113
- export const NavdsColorWarningBorder = "#D47B00";
114
- export const NavdsColorWarningBackground = "#FFECCC";
115
- export const NavdsColorInfoBorder = "#368DA8";
116
- export const NavdsColorInfoBackground = "#D8F9FF";
117
- export const NavdsColorSuccessBorder = "#06893A";
118
- export const NavdsColorSuccessBackground = "#CCF1D6";
119
- export const NavdsColorBorder = "#A0A0A0";
120
- export const NavdsColorBackground = "#ffffff";
121
- export const NavdsColorTextPrimary = "#262626";
122
- export const NavdsColorTextInverse = "#ffffff";
123
- export const NavdsColorTextDisabled = "#6A6A6A";
124
- export const NavdsColorTextLink = "#0067c5";
125
- export const NavdsColorTextError = "#BA3A26";
126
- export const NavdsColorHover = "#A0A0A0";
127
- export const NavdsColorTagErrorBorder = "#BA3A26";
128
- export const NavdsColorTagErrorBackground = "#F9D2CC";
129
- export const NavdsColorTagWarningBorder = "#D47B00";
130
- export const NavdsColorTagWarningBackground = "#FFECCC";
131
- export const NavdsColorTagInfoBorder = "#368DA8";
132
- export const NavdsColorTagInfoBackground = "#D8F9FF";
133
- export const NavdsColorTagSuccessBorder = "#06893A";
134
- export const NavdsColorTagSuccessBackground = "#CCF1D6";
135
- export const NavdsColorModalOverlay = "rgba(38, 38, 38, 0.7)";
136
- export const NavdsBorderDefault = "1px solid #A0A0A0";
137
- export const NavdsBorderRadius = "4px";
138
- export const NavdsPanelHover = "1px solid #0067c5";
139
6
  export const NavdsFontFamily = "\"Source Sans Pro\", Arial, sans-serif";
140
7
  export const NavdsFontLineHeightHeading2xlarge = "3.25rem";
141
8
  export const NavdsFontLineHeightHeadingXlarge = "2.5rem";
@@ -158,23 +25,155 @@ export const NavdsFontSizeMedium = "1rem";
158
25
  export const NavdsFontSizeSmall = "0.875rem";
159
26
  export const NavdsFontWeightBold = "600";
160
27
  export const NavdsFontWeightRegular = "400";
161
- export const NavdsShadowFocus = "0 0 0 3px #00347D";
162
- export const NavdsShadowFocusOnDark = "0 0 0 3px #FFAA33";
163
- export const NavdsShadowHover = "#A0A0A0 0 2px 1px 0";
164
- export const NavdsTextFocus = "#00347D";
165
- export const NavdsTextShadow = "0 0 0 2px #00347D";
166
- export const NavdsContentContainerMaxWidth = "79.5rem";
167
- export const NavdsContentContainerPaddingSmall = "1rem";
168
- export const NavdsContentContainerPaddingMediumAndLarger = "1.5rem";
169
- export const NavdsGridGutterSmall = "1rem";
170
- export const NavdsGridGutterMediumAndLarger = "1.5rem";
171
- export const NavdsLayoutBackgroundWhite = "#ffffff";
172
- export const NavdsLayoutBackgroundGray = "#F1F1F1";
173
- export const NavdsLayoutPaddingSmall = "1rem";
174
- export const NavdsLayoutPaddingMediumAndLarger = "2.5rem";
28
+ export const NavdsShadowFocus = "0 0 0 3px rgba(0, 52, 125, 1)";
29
+ export const NavdsShadowFocusInverted = "0 0 0 3px rgba(153, 195, 255, 1)";
30
+ export const NavdsShadowPopover = "0 2px 4px 0 rgba(201, 201, 201, 1)";
31
+ export const NavdsShadowCard = "0 1px 3px 0 rgba(38,38,38,0.2),0 2px 1px 0 rgba(38,38,38,0.12),0 1px 1px 0 rgba(38,38,38,0.14)";
175
32
  export const NavdsZIndexModal = 2000;
176
33
  export const NavdsZIndexPopover = 1000;
177
34
  export const NavdsZIndexFocus = 10;
178
- export const NavdsSidebarStickyOffset = "0";
179
- export const NavdsCheckmarkImageWhite = "url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMyAxMCI+ICAgIDxnPiAgICA8cGF0aCBmaWxsPSIjRkZGRkZGIiBkPSJNNCwxMGMtMC40LDAtMC44LTAuMS0xLjEtMC40TDAuNCw3LjFDMC4xLDYuOCwwLDYuNCwwLDZzMC4yLTAuOCwwLjUtMS4xQzEsNC40LDIsNC40LDIuNSw0LjlMNCw2LjRsNi40LTYgICAgQzEwLjgsMC4xLDExLjEsMCwxMS41LDBjMC40LDAsMC44LDAuMiwxLDAuNWMwLjYsMC42LDAuNSwxLjYtMC4xLDIuMXYwTDUsOS42QzQuNyw5LjksNC40LDEwLDQsMTB6IE0xMS44LDEuOUwxMS44LDEuOSAgICBDMTEuOCwxLjksMTEuOCwxLjksMTEuOCwxLjl6IE0xMS4yLDEuMUMxMS4yLDEuMSwxMS4yLDEuMSwxMS4yLDEuMUwxMS4yLDEuMXoiLz4gICAgPC9nPjwvc3ZnPg==)";
180
- export const NavdsCheckmarkImageBlue = "url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMyAxMCI+ICAgIDxnPiAgICA8cGF0aCBmaWxsPSIjMDA2N0M1IiBkPSJNNCwxMGMtMC40LDAtMC44LTAuMS0xLjEtMC40TDAuNCw3LjFDMC4xLDYuOCwwLDYuNCwwLDZzMC4yLTAuOCwwLjUtMS4xQzEsNC40LDIsNC40LDIuNSw0LjlMNCw2LjRsNi40LTYgICAgQzEwLjgsMC4xLDExLjEsMCwxMS41LDBjMC40LDAsMC44LDAuMiwxLDAuNWMwLjYsMC42LDAuNSwxLjYtMC4xLDIuMXYwTDUsOS42QzQuNyw5LjksNC40LDEwLDQsMTB6IE0xMS44LDEuOUwxMS44LDEuOSAgICBDMTEuOCwxLjksMTEuOCwxLjksMTEuOCwxLjl6IE0xMS4yLDEuMUMxMS4yLDEuMSwxMS4yLDEuMSwxMS4yLDEuMUwxMS4yLDEuMXoiLz4gICAgPC9nPjwvc3ZnPg==)";
35
+ export const NavdsGlobalColorBlue50 = "rgba(230, 240, 255, 1)";
36
+ export const NavdsGlobalColorBlue100 = "rgba(204, 225, 255, 1)";
37
+ export const NavdsGlobalColorBlue200 = "rgba(153, 195, 255, 1)";
38
+ export const NavdsGlobalColorBlue300 = "rgba(102, 165, 244, 1)";
39
+ export const NavdsGlobalColorBlue400 = "rgba(51, 134, 224, 1)";
40
+ export const NavdsGlobalColorBlue500 = "rgba(0, 103, 197, 1)";
41
+ export const NavdsGlobalColorBlue600 = "rgba(0, 86, 180, 1)";
42
+ export const NavdsGlobalColorBlue700 = "rgba(0, 69, 156, 1)";
43
+ export const NavdsGlobalColorBlue800 = "rgba(0, 52, 125, 1)";
44
+ export const NavdsGlobalColorBlue900 = "rgba(0, 34, 82, 1)";
45
+ export const NavdsGlobalColorDeepblue50 = "rgba(230, 241, 248, 1)";
46
+ export const NavdsGlobalColorDeepblue100 = "rgba(204, 226, 240, 1)";
47
+ export const NavdsGlobalColorDeepblue200 = "rgba(153, 196, 221, 1)";
48
+ export const NavdsGlobalColorDeepblue300 = "rgba(102, 163, 196, 1)";
49
+ export const NavdsGlobalColorDeepblue400 = "rgba(51, 128, 165, 1)";
50
+ export const NavdsGlobalColorDeepblue500 = "rgba(0, 91, 130, 1)";
51
+ export const NavdsGlobalColorDeepblue600 = "rgba(0, 80, 119, 1)";
52
+ export const NavdsGlobalColorDeepblue700 = "rgba(0, 67, 103, 1)";
53
+ export const NavdsGlobalColorDeepblue800 = "rgba(0, 52, 83, 1)";
54
+ export const NavdsGlobalColorDeepblue900 = "rgba(0, 36, 58, 1)";
55
+ export const NavdsGlobalColorGray50 = "rgba(247, 247, 247, 1)";
56
+ export const NavdsGlobalColorGray100 = "rgba(241, 241, 241, 1)";
57
+ export const NavdsGlobalColorGray200 = "rgba(201, 201, 201, 1)";
58
+ export const NavdsGlobalColorGray400 = "rgba(160, 160, 160, 1)";
59
+ export const NavdsGlobalColorGray600 = "rgba(106, 106, 106, 1)";
60
+ export const NavdsGlobalColorGray800 = "rgba(79, 79, 79, 1)";
61
+ export const NavdsGlobalColorGray900 = "rgba(38, 38, 38, 1)";
62
+ export const NavdsGlobalColorGreen50 = "rgba(243, 252, 245, 1)";
63
+ export const NavdsGlobalColorGreen100 = "rgba(204, 241, 214, 1)";
64
+ export const NavdsGlobalColorGreen200 = "rgba(153, 222, 173, 1)";
65
+ export const NavdsGlobalColorGreen300 = "rgba(102, 199, 134, 1)";
66
+ export const NavdsGlobalColorGreen400 = "rgba(51, 170, 95, 1)";
67
+ export const NavdsGlobalColorGreen500 = "rgba(6, 137, 58, 1)";
68
+ export const NavdsGlobalColorGreen600 = "rgba(0, 124, 46, 1)";
69
+ export const NavdsGlobalColorGreen700 = "rgba(0, 106, 35, 1)";
70
+ export const NavdsGlobalColorGreen800 = "rgba(0, 85, 25, 1)";
71
+ export const NavdsGlobalColorGreen900 = "rgba(0, 59, 15, 1)";
72
+ export const NavdsGlobalColorLightblue50 = "rgba(235, 252, 255, 1)";
73
+ export const NavdsGlobalColorLightblue100 = "rgba(216, 249, 255, 1)";
74
+ export const NavdsGlobalColorLightblue200 = "rgba(181, 241, 255, 1)";
75
+ export const NavdsGlobalColorLightblue300 = "rgba(151, 230, 255, 1)";
76
+ export const NavdsGlobalColorLightblue400 = "rgba(124, 218, 248, 1)";
77
+ export const NavdsGlobalColorLightblue500 = "rgba(102, 203, 236, 1)";
78
+ export const NavdsGlobalColorLightblue600 = "rgba(76, 173, 205, 1)";
79
+ export const NavdsGlobalColorLightblue700 = "rgba(54, 141, 168, 1)";
80
+ export const NavdsGlobalColorLightblue800 = "rgba(35, 107, 125, 1)";
81
+ export const NavdsGlobalColorLightblue900 = "rgba(19, 72, 82, 1)";
82
+ export const NavdsGlobalColorLimegreen50 = "rgba(253, 255, 230, 1)";
83
+ export const NavdsGlobalColorLimegreen100 = "rgba(249, 252, 204, 1)";
84
+ export const NavdsGlobalColorLimegreen200 = "rgba(236, 243, 153, 1)";
85
+ export const NavdsGlobalColorLimegreen300 = "rgba(217, 227, 102, 1)";
86
+ export const NavdsGlobalColorLimegreen400 = "rgba(193, 203, 51, 1)";
87
+ export const NavdsGlobalColorLimegreen500 = "rgba(162, 173, 0, 1)";
88
+ export const NavdsGlobalColorLimegreen600 = "rgba(147, 158, 0, 1)";
89
+ export const NavdsGlobalColorLimegreen700 = "rgba(127, 137, 0, 1)";
90
+ export const NavdsGlobalColorLimegreen800 = "rgba(102, 110, 0, 1)";
91
+ export const NavdsGlobalColorLimegreen900 = "rgba(71, 78, 0, 1)";
92
+ export const NavdsGlobalColorNavRed = "rgba(195, 0, 0, 1)";
93
+ export const NavdsGlobalColorOrange50 = "rgba(255, 249, 240, 1)";
94
+ export const NavdsGlobalColorOrange100 = "rgba(255, 236, 204, 1)";
95
+ export const NavdsGlobalColorOrange200 = "rgba(255, 215, 153, 1)";
96
+ export const NavdsGlobalColorOrange300 = "rgba(255, 193, 102, 1)";
97
+ export const NavdsGlobalColorOrange400 = "rgba(255, 170, 51, 1)";
98
+ export const NavdsGlobalColorOrange500 = "rgba(255, 145, 0, 1)";
99
+ export const NavdsGlobalColorOrange600 = "rgba(212, 123, 0, 1)";
100
+ export const NavdsGlobalColorOrange700 = "rgba(168, 100, 0, 1)";
101
+ export const NavdsGlobalColorOrange800 = "rgba(125, 76, 0, 1)";
102
+ export const NavdsGlobalColorOrange900 = "rgba(82, 51, 0, 1)";
103
+ export const NavdsGlobalColorPurple50 = "rgba(239, 236, 244, 1)";
104
+ export const NavdsGlobalColorPurple100 = "rgba(224, 216, 233, 1)";
105
+ export const NavdsGlobalColorPurple200 = "rgba(192, 178, 210, 1)";
106
+ export const NavdsGlobalColorPurple300 = "rgba(161, 141, 187, 1)";
107
+ export const NavdsGlobalColorPurple400 = "rgba(130, 105, 162, 1)";
108
+ export const NavdsGlobalColorPurple500 = "rgba(99, 70, 137, 1)";
109
+ export const NavdsGlobalColorPurple600 = "rgba(82, 56, 116, 1)";
110
+ export const NavdsGlobalColorPurple700 = "rgba(65, 43, 93, 1)";
111
+ export const NavdsGlobalColorPurple800 = "rgba(48, 31, 70, 1)";
112
+ export const NavdsGlobalColorPurple900 = "rgba(31, 20, 47, 1)";
113
+ export const NavdsGlobalColorRed50 = "rgba(253, 232, 230, 1)";
114
+ export const NavdsGlobalColorRed100 = "rgba(249, 210, 204, 1)";
115
+ export const NavdsGlobalColorRed200 = "rgba(239, 168, 157, 1)";
116
+ export const NavdsGlobalColorRed300 = "rgba(225, 128, 113, 1)";
117
+ export const NavdsGlobalColorRed400 = "rgba(208, 92, 74, 1)";
118
+ export const NavdsGlobalColorRed500 = "rgba(186, 58, 38, 1)";
119
+ export const NavdsGlobalColorRed600 = "rgba(163, 42, 23, 1)";
120
+ export const NavdsGlobalColorRed700 = "rgba(136, 29, 12, 1)";
121
+ export const NavdsGlobalColorRed800 = "rgba(106, 18, 4, 1)";
122
+ export const NavdsGlobalColorRed900 = "rgba(72, 9, 0, 1)";
123
+ export const NavdsGlobalColorTransparent = "rgba(255, 255, 255, 0)";
124
+ export const NavdsGlobalColorWhite = "rgba(255, 255, 255, 1)";
125
+ export const NavdsSemanticColorBorderInverted = "rgba(201, 201, 201, 1)";
126
+ export const NavdsSemanticColorBorderMuted = "rgba(160, 160, 160, 1)";
127
+ export const NavdsSemanticColorBorder = "rgba(106, 106, 106, 1)";
128
+ export const NavdsSemanticColorCanvasBackgroundInverted = "rgba(38, 38, 38, 1)";
129
+ export const NavdsSemanticColorCanvasBackgroundLight = "rgba(255, 255, 255, 1)";
130
+ export const NavdsSemanticColorCanvasBackground = "rgba(241, 241, 241, 1)";
131
+ export const NavdsSemanticColorComponentBackgroundAlternate = "rgba(247, 247, 247, 1)";
132
+ export const NavdsSemanticColorComponentBackgroundInverted = "rgba(38, 38, 38, 1)";
133
+ export const NavdsSemanticColorComponentBackgroundLight = "rgba(255, 255, 255, 1)";
134
+ export const NavdsSemanticColorDivider = "rgba(201, 201, 201, 1)";
135
+ export const NavdsSemanticColorFeedbackDangerBackground = "rgba(249, 210, 204, 1)";
136
+ export const NavdsSemanticColorFeedbackDangerBorder = "rgba(186, 58, 38, 1)";
137
+ export const NavdsSemanticColorFeedbackDangerIcon = "rgba(186, 58, 38, 1)";
138
+ export const NavdsSemanticColorFeedbackDangerText = "rgba(186, 58, 38, 1)";
139
+ export const NavdsSemanticColorFeedbackInfoBackground = "rgba(216, 249, 255, 1)";
140
+ export const NavdsSemanticColorFeedbackInfoBorder = "rgba(54, 141, 168, 1)";
141
+ export const NavdsSemanticColorFeedbackInfoIcon = "rgba(54, 141, 168, 1)";
142
+ export const NavdsSemanticColorFeedbackSuccessBackground = "rgba(204, 241, 214, 1)";
143
+ export const NavdsSemanticColorFeedbackSuccessBorder = "rgba(6, 137, 58, 1)";
144
+ export const NavdsSemanticColorFeedbackSuccessIcon = "rgba(0, 124, 46, 1)";
145
+ export const NavdsSemanticColorFeedbackWarningBackground = "rgba(255, 236, 204, 1)";
146
+ export const NavdsSemanticColorFeedbackWarningBorder = "rgba(212, 123, 0, 1)";
147
+ export const NavdsSemanticColorFeedbackWarningIcon = "rgba(255, 145, 0, 1)";
148
+ export const NavdsSemanticColorFocusInverted = "rgba(153, 195, 255, 1)";
149
+ export const NavdsSemanticColorFocus = "rgba(0, 52, 125, 1)";
150
+ export const NavdsSemanticColorInteractionDangerHover = "rgba(163, 42, 23, 1)";
151
+ export const NavdsSemanticColorInteractionDangerSelected = "rgba(136, 29, 12, 1)";
152
+ export const NavdsSemanticColorInteractionDanger = "rgba(186, 58, 38, 1)";
153
+ export const NavdsSemanticColorInteractionPrimaryHoverSubtle = "rgba(230, 240, 255, 1)";
154
+ export const NavdsSemanticColorInteractionPrimaryHover = "rgba(0, 86, 180, 1)";
155
+ export const NavdsSemanticColorInteractionPrimarySelected = "rgba(0, 91, 130, 1)";
156
+ export const NavdsSemanticColorInteractionPrimary = "rgba(0, 103, 197, 1)";
157
+ export const NavdsSemanticColorLinkVisited = "rgba(99, 70, 137, 1)";
158
+ export const NavdsSemanticColorLink = "rgba(0, 103, 197, 1)";
159
+ export const NavdsSemanticColorTextInverted = "rgba(255, 255, 255, 1)";
160
+ export const NavdsSemanticColorTextMuted = "rgba(106, 106, 106, 1)";
161
+ export const NavdsSemanticColorText = "rgba(38, 38, 38, 1)";
162
+ export const NavdsSpacing1 = "0.25rem";
163
+ export const NavdsSpacing2 = "0.5rem";
164
+ export const NavdsSpacing3 = "0.75rem";
165
+ export const NavdsSpacing4 = "1rem";
166
+ export const NavdsSpacing5 = "1.25rem";
167
+ export const NavdsSpacing6 = "1.5rem";
168
+ export const NavdsSpacing7 = "1.75rem";
169
+ export const NavdsSpacing8 = "2rem";
170
+ export const NavdsSpacing9 = "2.25rem";
171
+ export const NavdsSpacing10 = "2.5rem";
172
+ export const NavdsSpacing11 = "2.75rem";
173
+ export const NavdsSpacing12 = "3rem";
174
+ export const NavdsSpacing14 = "3.5rem";
175
+ export const NavdsSpacing16 = "4rem";
176
+ export const NavdsSpacing18 = "4.5rem";
177
+ export const NavdsSpacing20 = "5rem";
178
+ export const NavdsSpacing24 = "6rem";
179
+ export const NavdsSpacing32 = "8rem";