@gitlab/ui 133.0.0 → 134.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.
- package/dist/components/base/broadcast_message/broadcast_message.js +3 -3
- package/dist/index.css +1 -1
- package/dist/index.css.map +1 -1
- package/dist/tokens/build/js/tokens.dark.js +1 -145
- package/dist/tokens/build/js/tokens.js +1 -145
- package/dist/utils/constants.js +12 -12
- package/package.json +1 -1
- package/src/components/base/broadcast_message/broadcast_message.vue +3 -3
- package/src/tokens/build/css/tokens.css +16 -160
- package/src/tokens/build/css/tokens.dark.css +16 -160
- package/src/tokens/build/docs/tokens-tailwind-docs.dark.json +15293 -26883
- package/src/tokens/build/docs/tokens-tailwind-docs.json +15293 -26883
- package/src/tokens/build/figma/constants.dark.json +0 -1152
- package/src/tokens/build/figma/constants.json +0 -1152
- package/src/tokens/build/figma/mode.dark.json +160 -16
- package/src/tokens/build/figma/mode.json +160 -16
- package/src/tokens/build/js/tokens.dark.js +0 -144
- package/src/tokens/build/js/tokens.js +0 -144
- package/src/tokens/build/json/tokens.dark.json +15296 -19354
- package/src/tokens/build/json/tokens.json +15173 -19231
- package/src/tokens/build/scss/_tokens.dark.scss +16 -160
- package/src/tokens/build/scss/_tokens.scss +16 -160
- package/src/tokens/build/scss/_tokens_custom_properties.scss +0 -144
- package/src/tokens/build/tailwind/tokens.cjs +0 -75
- package/src/tokens/contextual/broadcast.tokens.json +160 -16
- package/src/utils/constants.js +11 -11
- package/tailwind.defaults.js +0 -2
- package/src/tokens/constant/color.theme.tokens.json +0 -1168
- package/src/tokens/deprecated/deprecated.color.theme.tokens.json +0 -2248
|
@@ -4,7 +4,16 @@
|
|
|
4
4
|
"background": {
|
|
5
5
|
"color": {
|
|
6
6
|
"blue": {
|
|
7
|
-
"$value":
|
|
7
|
+
"$value": {
|
|
8
|
+
"colorSpace": "srgb",
|
|
9
|
+
"components": [
|
|
10
|
+
0.13725490196078433,
|
|
11
|
+
0.3176470588235294,
|
|
12
|
+
0.5019607843137255
|
|
13
|
+
],
|
|
14
|
+
"alpha": 1,
|
|
15
|
+
"hex": "#235180"
|
|
16
|
+
},
|
|
8
17
|
"$type": "color",
|
|
9
18
|
"$description": "Used for the background for the blue banner type.",
|
|
10
19
|
"$extensions": {
|
|
@@ -26,7 +35,16 @@
|
|
|
26
35
|
}
|
|
27
36
|
},
|
|
28
37
|
"green": {
|
|
29
|
-
"$value":
|
|
38
|
+
"$value": {
|
|
39
|
+
"colorSpace": "srgb",
|
|
40
|
+
"components": [
|
|
41
|
+
0.10588235294117647,
|
|
42
|
+
0.396078431372549,
|
|
43
|
+
0.24705882352941178
|
|
44
|
+
],
|
|
45
|
+
"alpha": 1,
|
|
46
|
+
"hex": "#1b653f"
|
|
47
|
+
},
|
|
30
48
|
"$type": "color",
|
|
31
49
|
"$description": "Used for the background for the green banner type.",
|
|
32
50
|
"$extensions": {
|
|
@@ -37,7 +55,16 @@
|
|
|
37
55
|
}
|
|
38
56
|
},
|
|
39
57
|
"indigo": {
|
|
40
|
-
"$value":
|
|
58
|
+
"$value": {
|
|
59
|
+
"colorSpace": "srgb",
|
|
60
|
+
"components": [
|
|
61
|
+
0.2549019607843137,
|
|
62
|
+
0.2549019607843137,
|
|
63
|
+
0.6235294117647059
|
|
64
|
+
],
|
|
65
|
+
"alpha": 1,
|
|
66
|
+
"hex": "#41419f"
|
|
67
|
+
},
|
|
41
68
|
"$type": "color",
|
|
42
69
|
"$description": "Used for the background for the indigo banner type.",
|
|
43
70
|
"$extensions": {
|
|
@@ -59,7 +86,16 @@
|
|
|
59
86
|
}
|
|
60
87
|
},
|
|
61
88
|
"lightblue": {
|
|
62
|
-
"$value":
|
|
89
|
+
"$value": {
|
|
90
|
+
"colorSpace": "srgb",
|
|
91
|
+
"components": [
|
|
92
|
+
0.28627450980392155,
|
|
93
|
+
0.4666666666666667,
|
|
94
|
+
0.6470588235294118
|
|
95
|
+
],
|
|
96
|
+
"alpha": 1,
|
|
97
|
+
"hex": "#4977a5"
|
|
98
|
+
},
|
|
63
99
|
"$type": "color",
|
|
64
100
|
"$description": "Used for the background for the lightblue banner type.",
|
|
65
101
|
"$extensions": {
|
|
@@ -70,7 +106,16 @@
|
|
|
70
106
|
}
|
|
71
107
|
},
|
|
72
108
|
"lightgreen": {
|
|
73
|
-
"$value":
|
|
109
|
+
"$value": {
|
|
110
|
+
"colorSpace": "srgb",
|
|
111
|
+
"components": [
|
|
112
|
+
0.18823529411764706,
|
|
113
|
+
0.5098039215686274,
|
|
114
|
+
0.34509803921568627
|
|
115
|
+
],
|
|
116
|
+
"alpha": 1,
|
|
117
|
+
"hex": "#308258"
|
|
118
|
+
},
|
|
74
119
|
"$type": "color",
|
|
75
120
|
"$description": "Used for the background for the lightgreen banner type.",
|
|
76
121
|
"$extensions": {
|
|
@@ -81,7 +126,16 @@
|
|
|
81
126
|
}
|
|
82
127
|
},
|
|
83
128
|
"lightindigo": {
|
|
84
|
-
"$value":
|
|
129
|
+
"$value": {
|
|
130
|
+
"colorSpace": "srgb",
|
|
131
|
+
"components": [
|
|
132
|
+
0.4,
|
|
133
|
+
0.4,
|
|
134
|
+
0.7686274509803922
|
|
135
|
+
],
|
|
136
|
+
"alpha": 1,
|
|
137
|
+
"hex": "#6666c4"
|
|
138
|
+
},
|
|
85
139
|
"$type": "color",
|
|
86
140
|
"$description": "Used for the background for the lightindigo banner type.",
|
|
87
141
|
"$extensions": {
|
|
@@ -92,7 +146,16 @@
|
|
|
92
146
|
}
|
|
93
147
|
},
|
|
94
148
|
"lightred": {
|
|
95
|
-
"$value":
|
|
149
|
+
"$value":{
|
|
150
|
+
"colorSpace": "srgb",
|
|
151
|
+
"components": [
|
|
152
|
+
0.6784313725490196,
|
|
153
|
+
0.2901960784313726,
|
|
154
|
+
0.23137254901960785
|
|
155
|
+
],
|
|
156
|
+
"alpha": 1,
|
|
157
|
+
"hex": "#ad4a3b"
|
|
158
|
+
},
|
|
96
159
|
"$type": "color",
|
|
97
160
|
"$description": "Used for the background for the lightred banner type.",
|
|
98
161
|
"$extensions": {
|
|
@@ -103,7 +166,16 @@
|
|
|
103
166
|
}
|
|
104
167
|
},
|
|
105
168
|
"red": {
|
|
106
|
-
"$value":
|
|
169
|
+
"$value": {
|
|
170
|
+
"colorSpace": "srgb",
|
|
171
|
+
"components": [
|
|
172
|
+
0.5607843137254902,
|
|
173
|
+
0.12941176470588237,
|
|
174
|
+
0.06274509803921569
|
|
175
|
+
],
|
|
176
|
+
"alpha": 1,
|
|
177
|
+
"hex": "#8f2110"
|
|
178
|
+
},
|
|
107
179
|
"$type": "color",
|
|
108
180
|
"$description": "Used for the background for the red banner type.",
|
|
109
181
|
"$extensions": {
|
|
@@ -118,7 +190,16 @@
|
|
|
118
190
|
"border": {
|
|
119
191
|
"color": {
|
|
120
192
|
"blue": {
|
|
121
|
-
"$value":
|
|
193
|
+
"$value": {
|
|
194
|
+
"colorSpace": "srgb",
|
|
195
|
+
"components": [
|
|
196
|
+
0.043137254901960784,
|
|
197
|
+
0.14901960784313725,
|
|
198
|
+
0.25098039215686274
|
|
199
|
+
],
|
|
200
|
+
"alpha": 1,
|
|
201
|
+
"hex": "#0b2640"
|
|
202
|
+
},
|
|
122
203
|
"$type": "color",
|
|
123
204
|
"$description": "Used for the border for the blue banner type.",
|
|
124
205
|
"$extensions": {
|
|
@@ -138,7 +219,16 @@
|
|
|
138
219
|
}
|
|
139
220
|
},
|
|
140
221
|
"green": {
|
|
141
|
-
"$value":
|
|
222
|
+
"$value": {
|
|
223
|
+
"colorSpace": "srgb",
|
|
224
|
+
"components": [
|
|
225
|
+
0.054901960784313725,
|
|
226
|
+
0.2627450980392157,
|
|
227
|
+
0.1568627450980392
|
|
228
|
+
],
|
|
229
|
+
"alpha": 1,
|
|
230
|
+
"hex": "#0e4328"
|
|
231
|
+
},
|
|
142
232
|
"$type": "color",
|
|
143
233
|
"$description": "Used for the border for the green banner type.",
|
|
144
234
|
"$extensions": {
|
|
@@ -148,7 +238,16 @@
|
|
|
148
238
|
}
|
|
149
239
|
},
|
|
150
240
|
"indigo": {
|
|
151
|
-
"$value":
|
|
241
|
+
"$value": {
|
|
242
|
+
"colorSpace": "srgb",
|
|
243
|
+
"components": [
|
|
244
|
+
0.13333333333333333,
|
|
245
|
+
0.13333333333333333,
|
|
246
|
+
0.3803921568627451
|
|
247
|
+
],
|
|
248
|
+
"alpha": 1,
|
|
249
|
+
"hex": "#222261"
|
|
250
|
+
},
|
|
152
251
|
"$type": "color",
|
|
153
252
|
"$description": "Used for the border for the indigo banner type.",
|
|
154
253
|
"$extensions": {
|
|
@@ -168,7 +267,16 @@
|
|
|
168
267
|
}
|
|
169
268
|
},
|
|
170
269
|
"lightblue": {
|
|
171
|
-
"$value":
|
|
270
|
+
"$value": {
|
|
271
|
+
"colorSpace": "srgb",
|
|
272
|
+
"components": [
|
|
273
|
+
0.13725490196078433,
|
|
274
|
+
0.3176470588235294,
|
|
275
|
+
0.5019607843137255
|
|
276
|
+
],
|
|
277
|
+
"alpha": 1,
|
|
278
|
+
"hex": "#235180"
|
|
279
|
+
},
|
|
172
280
|
"$type": "color",
|
|
173
281
|
"$description": "Used for the border for the lightblue banner type.",
|
|
174
282
|
"$extensions": {
|
|
@@ -178,7 +286,16 @@
|
|
|
178
286
|
}
|
|
179
287
|
},
|
|
180
288
|
"lightgreen": {
|
|
181
|
-
"$value":
|
|
289
|
+
"$value": {
|
|
290
|
+
"colorSpace": "srgb",
|
|
291
|
+
"components": [
|
|
292
|
+
0.10588235294117647,
|
|
293
|
+
0.396078431372549,
|
|
294
|
+
0.24705882352941178
|
|
295
|
+
],
|
|
296
|
+
"alpha": 1,
|
|
297
|
+
"hex": "#1b653f"
|
|
298
|
+
},
|
|
182
299
|
"$type": "color",
|
|
183
300
|
"$description": "Used for the border for the lightgreen banner type.",
|
|
184
301
|
"$extensions": {
|
|
@@ -188,7 +305,16 @@
|
|
|
188
305
|
}
|
|
189
306
|
},
|
|
190
307
|
"lightindigo": {
|
|
191
|
-
"$value":
|
|
308
|
+
"$value": {
|
|
309
|
+
"colorSpace": "srgb",
|
|
310
|
+
"components": [
|
|
311
|
+
0.2549019607843137,
|
|
312
|
+
0.2549019607843137,
|
|
313
|
+
0.6235294117647059
|
|
314
|
+
],
|
|
315
|
+
"alpha": 1,
|
|
316
|
+
"hex": "#41419f"
|
|
317
|
+
},
|
|
192
318
|
"$type": "color",
|
|
193
319
|
"$description": "Used for the border for the lightindigo banner type.",
|
|
194
320
|
"$extensions": {
|
|
@@ -198,7 +324,16 @@
|
|
|
198
324
|
}
|
|
199
325
|
},
|
|
200
326
|
"lightred": {
|
|
201
|
-
"$value":
|
|
327
|
+
"$value": {
|
|
328
|
+
"colorSpace": "srgb",
|
|
329
|
+
"components": [
|
|
330
|
+
0.5607843137254902,
|
|
331
|
+
0.12941176470588237,
|
|
332
|
+
0.06274509803921569
|
|
333
|
+
],
|
|
334
|
+
"alpha": 1,
|
|
335
|
+
"hex": "#8f2110"
|
|
336
|
+
},
|
|
202
337
|
"$type": "color",
|
|
203
338
|
"$description": "Used for the border for the lightred banner type.",
|
|
204
339
|
"$extensions": {
|
|
@@ -208,7 +343,16 @@
|
|
|
208
343
|
}
|
|
209
344
|
},
|
|
210
345
|
"red": {
|
|
211
|
-
"$value":
|
|
346
|
+
"$value": {
|
|
347
|
+
"colorSpace": "srgb",
|
|
348
|
+
"components": [
|
|
349
|
+
0.34509803921568627,
|
|
350
|
+
0.050980392156862744,
|
|
351
|
+
0.00784313725490196
|
|
352
|
+
],
|
|
353
|
+
"alpha": 1,
|
|
354
|
+
"hex": "#580d02"
|
|
355
|
+
},
|
|
212
356
|
"$type": "color",
|
|
213
357
|
"$description": "Used for the border for the red banner type.",
|
|
214
358
|
"$extensions": {
|
package/src/utils/constants.js
CHANGED
|
@@ -276,17 +276,17 @@ export const alertVariantIconMap = {
|
|
|
276
276
|
tip: 'bulb',
|
|
277
277
|
};
|
|
278
278
|
|
|
279
|
-
export const
|
|
280
|
-
indigo: '
|
|
281
|
-
'light-indigo': '
|
|
282
|
-
blue: '
|
|
283
|
-
'light-blue': '
|
|
284
|
-
green: '
|
|
285
|
-
'light-green': '
|
|
286
|
-
red: '
|
|
287
|
-
'light-red': '
|
|
288
|
-
dark: '
|
|
289
|
-
light: '
|
|
279
|
+
export const broadcastMessageThemes = {
|
|
280
|
+
indigo: 'indigo',
|
|
281
|
+
'light-indigo': 'light-indigo',
|
|
282
|
+
blue: 'blue',
|
|
283
|
+
'light-blue': 'light-blue',
|
|
284
|
+
green: 'green',
|
|
285
|
+
'light-green': 'light-green',
|
|
286
|
+
red: 'red',
|
|
287
|
+
'light-red': 'light-red',
|
|
288
|
+
dark: 'dark',
|
|
289
|
+
light: 'light',
|
|
290
290
|
};
|
|
291
291
|
|
|
292
292
|
export const modalButtonDefaults = {
|
package/tailwind.defaults.js
CHANGED
|
@@ -309,8 +309,6 @@ module.exports = {
|
|
|
309
309
|
'inner-b-1-border-default':
|
|
310
310
|
'inset 0 -1px 0 0 var(--gl-border-color-default, var(--gl-color-neutral-100, #dcdcde))',
|
|
311
311
|
'inner-b-2-blue-500': 'inset 0 -2px 0 0 var(--blue-500, #1f75cb)',
|
|
312
|
-
'inner-b-2-theme-accent':
|
|
313
|
-
'inset 0 -2px 0 0 var(--gl-theme-accent, var(--theme-indigo-500, #6666c4))',
|
|
314
312
|
'inner-l-3-red-600': 'inset 3px 0 0 0 var(--red-600, #c91c00)',
|
|
315
313
|
'inner-l-4-gray-100': 'inset 4px 0 0 0 var(--gray-100, #dcdcde)',
|
|
316
314
|
'x0-y0-b3-s1-blue-500': 'inset 0 0 3px 1px var(--blue-500, #1f75cb)',
|