@navikt/ds-tailwind 4.12.0 → 5.0.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 (2) hide show
  1. package/package.json +2 -2
  2. package/tailwind.config.js +57 -57
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@navikt/ds-tailwind",
3
- "version": "4.12.0",
3
+ "version": "5.0.0",
4
4
  "description": "Tailwind config based on @navikt/ds-tokens",
5
5
  "author": "Aksel | NAV designsystem team",
6
6
  "keywords": [
@@ -22,7 +22,7 @@
22
22
  "directory": "@navikt/core/tailwind"
23
23
  },
24
24
  "devDependencies": {
25
- "@navikt/ds-tokens": "^4.12.0",
25
+ "@navikt/ds-tokens": "^5.0.0",
26
26
  "@types/jest": "^29.0.0",
27
27
  "color": "4.2.3",
28
28
  "jest": "^29.0.0",
package/tailwind.config.js CHANGED
@@ -1,12 +1,12 @@
1
1
  module.exports = {
2
2
  "theme": {
3
3
  "colors": {
4
- "border-default": "rgba(0, 0, 0, 0.44)",
5
- "border-strong": "rgba(0, 0, 0, 0.65)",
6
- "border-divider": "rgba(0, 0, 0, 0.19)",
7
- "border-subtle-hover": "rgba(0, 0, 0, 0.19)",
8
- "border-subtle": "rgba(0, 0, 0, 0.1)",
9
- "border-action-selected": "rgba(0, 91, 130, 1)",
4
+ "border-default": "rgba(2, 20, 49, 0.49)",
5
+ "border-strong": "rgba(1, 11, 24, 0.68)",
6
+ "border-divider": "rgba(7, 26, 54, 0.21)",
7
+ "border-subtle-hover": "rgba(5, 23, 51, 0.34)",
8
+ "border-subtle": "rgba(7, 26, 54, 0.21)",
9
+ "border-action-selected": "rgba(0, 69, 156, 1)",
10
10
  "border-action": "rgba(0, 103, 197, 1)",
11
11
  "border-selected": "rgba(0, 103, 197, 1)",
12
12
  "border-success": "rgba(6, 137, 58, 1)",
@@ -15,8 +15,8 @@ module.exports = {
15
15
  "border-info": "rgba(54, 141, 168, 1)",
16
16
  "border-focus-on-inverted": "rgba(153, 195, 255, 1)",
17
17
  "border-focus": "rgba(0, 52, 125, 1)",
18
- "border-on-inverted": "rgba(229, 229, 229, 1)",
19
- "border-on-inverted-subtle": "rgba(89, 89, 89, 1)",
18
+ "border-on-inverted": "rgba(224, 227, 230, 1)",
19
+ "border-on-inverted-subtle": "rgba(82, 89, 98, 1)",
20
20
  "border-alt-1": "rgba(130, 105, 162, 1)",
21
21
  "border-alt-2": "rgba(127, 137, 0, 1)",
22
22
  "border-alt-3": "rgba(0, 91, 130, 1)",
@@ -41,26 +41,26 @@ module.exports = {
41
41
  "transparent": "rgba(255, 255, 255, 0)",
42
42
  "white": "rgba(255, 255, 255, 1)",
43
43
  "nav-red": "rgba(195, 0, 0, 1)",
44
- "gray-50": "rgba(247, 247, 247, 1)",
45
- "gray-100": "rgba(241, 241, 241, 1)",
46
- "gray-200": "rgba(229, 229, 229, 1)",
47
- "gray-300": "rgba(207, 207, 207, 1)",
48
- "gray-400": "rgba(176, 176, 176, 1)",
49
- "gray-500": "rgba(143, 143, 143, 1)",
50
- "gray-600": "rgba(112, 112, 112, 1)",
51
- "gray-700": "rgba(89, 89, 89, 1)",
52
- "gray-800": "rgba(64, 64, 64, 1)",
53
- "gray-900": "rgba(38, 38, 38, 1)",
54
- "grayalpha-50": "rgba(0, 0, 0, 0.03)",
55
- "grayalpha-100": "rgba(0, 0, 0, 0.05)",
56
- "grayalpha-200": "rgba(0, 0, 0, 0.1)",
57
- "grayalpha-300": "rgba(0, 0, 0, 0.19)",
58
- "grayalpha-400": "rgba(0, 0, 0, 0.31)",
59
- "grayalpha-500": "rgba(0, 0, 0, 0.44)",
60
- "grayalpha-600": "rgba(0, 0, 0, 0.56)",
61
- "grayalpha-700": "rgba(0, 0, 0, 0.65)",
62
- "grayalpha-800": "rgba(0, 0, 0, 0.75)",
63
- "grayalpha-900": "rgba(0, 0, 0, 0.85)",
44
+ "gray-50": "rgba(242, 243, 245, 1)",
45
+ "gray-100": "rgba(236, 238, 240, 1)",
46
+ "gray-200": "rgba(224, 227, 230, 1)",
47
+ "gray-300": "rgba(203, 207, 213, 1)",
48
+ "gray-400": "rgba(170, 176, 186, 1)",
49
+ "gray-500": "rgba(131, 140, 154, 1)",
50
+ "gray-600": "rgba(103, 111, 123, 1)",
51
+ "gray-700": "rgba(82, 89, 98, 1)",
52
+ "gray-800": "rgba(66, 71, 79, 1)",
53
+ "gray-900": "rgba(35, 38, 42, 1)",
54
+ "grayalpha-50": "rgba(38, 55, 89, 0.06)",
55
+ "grayalpha-100": "rgba(18, 43, 68, 0.08)",
56
+ "grayalpha-200": "rgba(17, 41, 64, 0.13)",
57
+ "grayalpha-300": "rgba(7, 26, 54, 0.21)",
58
+ "grayalpha-400": "rgba(5, 23, 51, 0.34)",
59
+ "grayalpha-500": "rgba(2, 20, 49, 0.49)",
60
+ "grayalpha-600": "rgba(2, 15, 34, 0.6)",
61
+ "grayalpha-700": "rgba(1, 11, 24, 0.68)",
62
+ "grayalpha-800": "rgba(3, 11, 22, 0.75)",
63
+ "grayalpha-900": "rgba(2, 5, 9, 0.87)",
64
64
  "blue-50": "rgba(230, 240, 255, 1)",
65
65
  "blue-100": "rgba(204, 225, 255, 1)",
66
66
  "blue-200": "rgba(153, 195, 255, 1)",
@@ -141,11 +141,11 @@ module.exports = {
141
141
  "purple-700": "rgba(65, 43, 93, 1)",
142
142
  "purple-800": "rgba(48, 31, 70, 1)",
143
143
  "purple-900": "rgba(31, 20, 47, 1)",
144
- "text-default": "rgba(38, 38, 38, 1)",
145
- "text-subtle": "rgba(0, 0, 0, 0.65)",
144
+ "text-default": "rgba(35, 38, 42, 1)",
145
+ "text-subtle": "rgba(1, 11, 24, 0.68)",
146
146
  "text-visited": "rgba(99, 70, 137, 1)",
147
147
  "text-danger": "rgba(195, 0, 0, 1)",
148
- "text-action-selected": "rgba(0, 91, 130, 1)",
148
+ "text-action-selected": "rgba(0, 69, 156, 1)",
149
149
  "text-action-on-action-subtle": "rgba(0, 86, 180, 1)",
150
150
  "text-action": "rgba(0, 103, 197, 1)",
151
151
  "text-on-inverted": "rgba(255, 255, 255, 1)",
@@ -153,37 +153,37 @@ module.exports = {
153
153
  "text-on-action": "rgba(255, 255, 255, 1)",
154
154
  "text-on-success": "rgba(255, 255, 255, 1)",
155
155
  "text-on-danger": "rgba(255, 255, 255, 1)",
156
- "text-on-warning": "rgba(38, 38, 38, 1)",
157
- "text-on-info": "rgba(38, 38, 38, 1)",
156
+ "text-on-warning": "rgba(35, 38, 42, 1)",
157
+ "text-on-info": "rgba(35, 38, 42, 1)",
158
158
  "text-on-alt-1": "rgba(255, 255, 255, 1)",
159
- "text-on-alt-2": "rgba(38, 38, 38, 1)",
159
+ "text-on-alt-2": "rgba(35, 38, 42, 1)",
160
160
  "text-on-alt-3": "rgba(255, 255, 255, 1)",
161
161
  "bg-default": "rgba(255, 255, 255, 1)",
162
- "bg-subtle": "rgba(241, 241, 241, 1)",
162
+ "bg-subtle": "rgba(236, 238, 240, 1)",
163
163
  "surface-default": "rgba(255, 255, 255, 1)",
164
- "surface-hover": "rgba(0, 0, 0, 0.05)",
165
- "surface-active": "rgba(0, 0, 0, 0.1)",
164
+ "surface-hover": "rgba(18, 43, 68, 0.08)",
165
+ "surface-active": "rgba(17, 41, 64, 0.13)",
166
166
  "surface-selected": "rgba(230, 240, 255, 1)",
167
- "surface-subtle": "rgba(247, 247, 247, 1)",
167
+ "surface-subtle": "rgba(242, 243, 245, 1)",
168
168
  "surface-transparent": "rgba(255, 255, 255, 0)",
169
- "surface-backdrop": "rgba(0, 0, 0, 0.65)",
170
- "surface-inverted-hover": "rgba(64, 64, 64, 1)",
171
- "surface-inverted-active": "rgba(89, 89, 89, 1)",
172
- "surface-inverted": "rgba(38, 38, 38, 1)",
169
+ "surface-backdrop": "rgba(2, 20, 49, 0.49)",
170
+ "surface-inverted-hover": "rgba(66, 71, 79, 1)",
171
+ "surface-inverted-active": "rgba(82, 89, 98, 1)",
172
+ "surface-inverted": "rgba(35, 38, 42, 1)",
173
173
  "surface-action-subtle-hover": "rgba(204, 225, 255, 1)",
174
174
  "surface-action-subtle": "rgba(230, 240, 255, 1)",
175
175
  "surface-action-hover": "rgba(0, 86, 180, 1)",
176
- "surface-action-active": "rgba(0, 91, 130, 1)",
177
- "surface-action-selected-hover": "rgba(0, 80, 119, 1)",
178
- "surface-action-selected": "rgba(0, 91, 130, 1)",
176
+ "surface-action-active": "rgba(0, 69, 156, 1)",
177
+ "surface-action-selected-hover": "rgba(0, 52, 125, 1)",
178
+ "surface-action-selected": "rgba(0, 69, 156, 1)",
179
179
  "surface-action": "rgba(0, 103, 197, 1)",
180
- "surface-neutral-subtle-hover": "rgba(0, 0, 0, 0.1)",
181
- "surface-neutral-subtle": "rgba(0, 0, 0, 0.05)",
182
- "surface-neutral-moderate": "rgba(0, 0, 0, 0.1)",
183
- "surface-neutral-hover": "rgba(64, 64, 64, 1)",
184
- "surface-neutral-selected": "rgba(38, 38, 38, 1)",
185
- "surface-neutral-active": "rgba(38, 38, 38, 1)",
186
- "surface-neutral": "rgba(89, 89, 89, 1)",
180
+ "surface-neutral-subtle-hover": "rgba(17, 41, 64, 0.13)",
181
+ "surface-neutral-subtle": "rgba(18, 43, 68, 0.08)",
182
+ "surface-neutral-moderate": "rgba(17, 41, 64, 0.13)",
183
+ "surface-neutral-hover": "rgba(66, 71, 79, 1)",
184
+ "surface-neutral-selected": "rgba(35, 38, 42, 1)",
185
+ "surface-neutral-active": "rgba(35, 38, 42, 1)",
186
+ "surface-neutral": "rgba(82, 89, 98, 1)",
187
187
  "surface-success-subtle-hover": "rgba(153, 222, 173, 1)",
188
188
  "surface-success-subtle": "rgba(204, 241, 214, 1)",
189
189
  "surface-success-moderate": "rgba(153, 222, 173, 1)",
@@ -213,9 +213,9 @@ module.exports = {
213
213
  "surface-alt-3-moderate": "rgba(153, 196, 221, 1)",
214
214
  "surface-alt-3-strong": "rgba(0, 52, 83, 1)",
215
215
  "surface-alt-3": "rgba(0, 91, 130, 1)",
216
- "icon-default": "rgba(38, 38, 38, 1)",
217
- "icon-subtle": "rgba(0, 0, 0, 0.65)",
218
- "icon-action-selected": "rgba(0, 91, 130, 1)",
216
+ "icon-default": "rgba(35, 38, 42, 1)",
217
+ "icon-subtle": "rgba(1, 11, 24, 0.68)",
218
+ "icon-action-selected": "rgba(0, 69, 156, 1)",
219
219
  "icon-action-on-action-subtle": "rgba(0, 86, 180, 1)",
220
220
  "icon-action": "rgba(0, 103, 197, 1)",
221
221
  "icon-success": "rgba(6, 137, 58, 1)",
@@ -230,8 +230,8 @@ module.exports = {
230
230
  "icon-on-action": "rgba(255, 255, 255, 1)",
231
231
  "icon-on-success": "rgba(255, 255, 255, 1)",
232
232
  "icon-on-danger": "rgba(255, 255, 255, 1)",
233
- "icon-on-warning": "rgba(38, 38, 38, 1)",
234
- "icon-on-info": "rgba(38, 38, 38, 1)"
233
+ "icon-on-warning": "rgba(35, 38, 42, 1)",
234
+ "icon-on-info": "rgba(35, 38, 42, 1)"
235
235
  },
236
236
  "screen": {
237
237
  "sm": "480px",