@i-cell/ids-styles 0.0.5 → 0.0.7
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/accessibility.css +11 -0
- package/dist/accessibility.min.css +1 -0
- package/dist/accessibility.plugin.js +20 -0
- package/dist/action-item/action-item.css +6 -0
- package/dist/action-item/action-item.min.css +1 -1
- package/dist/action-item/action-item.plugin.js +2 -0
- package/dist/avatar/avatar.css +6 -0
- package/dist/avatar/avatar.min.css +1 -1
- package/dist/avatar/avatar.plugin.js +2 -0
- package/dist/button/button.css +6 -0
- package/dist/button/button.min.css +1 -1
- package/dist/button/button.plugin.js +2 -0
- package/dist/checkbox/checkbox.css +5 -0
- package/dist/checkbox/checkbox.min.css +1 -1
- package/dist/checkbox/checkbox.plugin.js +5 -0
- package/dist/components.css +291 -112
- package/dist/components.min.css +1 -1
- package/dist/components.plugin.js +250 -113
- package/dist/icon-button/icon-button.css +6 -0
- package/dist/icon-button/icon-button.min.css +1 -1
- package/dist/icon-button/icon-button.plugin.js +2 -0
- package/dist/paginator/paginator.css +51 -8
- package/dist/paginator/paginator.min.css +1 -1
- package/dist/paginator/paginator.plugin.js +39 -9
- package/dist/segmented-control/segmented-control-toggle.css +102 -56
- package/dist/segmented-control/segmented-control-toggle.min.css +1 -1
- package/dist/segmented-control/segmented-control-toggle.plugin.js +98 -56
- package/dist/segmented-control/segmented-control.css +102 -48
- package/dist/segmented-control/segmented-control.min.css +1 -1
- package/dist/segmented-control/segmented-control.plugin.js +98 -48
- package/dist/tag/tag.css +7 -0
- package/dist/tag/tag.min.css +1 -1
- package/dist/tag/tag.plugin.js +2 -0
- package/package.json +2 -2
|
@@ -11,6 +11,8 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
11
11
|
textWrap: 'nowrap',
|
|
12
12
|
},
|
|
13
13
|
'.ids-segmented-control .ids-segmented-control-item>button:focus': { zIndex: 1, outlineStyle: 'solid', outlineOffset: '2px' },
|
|
14
|
+
'.ids-segmented-control .ids-segmented-control-item>button:not(:disabled)': { cursor: 'pointer' },
|
|
15
|
+
'.ids-segmented-control .ids-segmented-control-item>button:disabled': { cursor: 'not-allowed' },
|
|
14
16
|
'.ids-segmented-control.ids-segmented-control-compact': {
|
|
15
17
|
padding:
|
|
16
18
|
'var(--ids-comp-segmented-control-container-size-padding-y-compact) var(--ids-comp-segmented-control-container-size-padding-x-compact)',
|
|
@@ -171,6 +173,7 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
171
173
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button': {
|
|
172
174
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-primary-default)',
|
|
173
175
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-default)',
|
|
176
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-primary-default)',
|
|
174
177
|
},
|
|
175
178
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button .ids-icon': {
|
|
176
179
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-default)',
|
|
@@ -179,30 +182,35 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
179
182
|
{
|
|
180
183
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-primary-active)',
|
|
181
184
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-active)',
|
|
185
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-primary-active)',
|
|
182
186
|
},
|
|
183
187
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon':
|
|
184
188
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-active)' },
|
|
185
189
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:hover': {
|
|
186
190
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-primary-hovered)',
|
|
187
191
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-hovered)',
|
|
192
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-primary-hovered)',
|
|
188
193
|
},
|
|
189
194
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:hover .ids-icon':
|
|
190
195
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-hovered)' },
|
|
191
196
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:active': {
|
|
192
197
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-primary-pressed)',
|
|
193
198
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-pressed)',
|
|
199
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-primary-pressed)',
|
|
194
200
|
},
|
|
195
201
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:active .ids-icon':
|
|
196
202
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-pressed)' },
|
|
197
203
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:focus': {
|
|
198
204
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-primary-focused)',
|
|
199
205
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-focused)',
|
|
206
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-primary-focused)',
|
|
200
207
|
},
|
|
201
208
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:focus .ids-icon':
|
|
202
209
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-focused)' },
|
|
203
210
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:disabled': {
|
|
204
211
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-primary-disabled)',
|
|
205
212
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-primary-disabled)',
|
|
213
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-primary-disabled)',
|
|
206
214
|
},
|
|
207
215
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-filled .ids-segmented-control-item>button:disabled .ids-icon':
|
|
208
216
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-primary-disabled)' },
|
|
@@ -212,42 +220,48 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
212
220
|
},
|
|
213
221
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button': {
|
|
214
222
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-primary-default)',
|
|
215
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
223
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-default)',
|
|
224
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-primary-default)',
|
|
216
225
|
},
|
|
217
226
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button .ids-icon': {
|
|
218
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
227
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-default)',
|
|
219
228
|
},
|
|
220
229
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled)':
|
|
221
230
|
{
|
|
222
231
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-primary-active)',
|
|
223
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
232
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-active)',
|
|
233
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-primary-active)',
|
|
224
234
|
},
|
|
225
235
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon':
|
|
226
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
236
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-active)' },
|
|
227
237
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:hover': {
|
|
228
238
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-primary-hovered)',
|
|
229
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
239
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-hovered)',
|
|
240
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-primary-hovered)',
|
|
230
241
|
},
|
|
231
242
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:hover .ids-icon':
|
|
232
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
243
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-hovered)' },
|
|
233
244
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:active': {
|
|
234
245
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-primary-pressed)',
|
|
235
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
246
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-pressed)',
|
|
247
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-primary-pressed)',
|
|
236
248
|
},
|
|
237
249
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:active .ids-icon':
|
|
238
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
250
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-pressed)' },
|
|
239
251
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:focus': {
|
|
240
252
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-primary-focused)',
|
|
241
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
253
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-focused)',
|
|
254
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-primary-focused)',
|
|
242
255
|
},
|
|
243
256
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:focus .ids-icon':
|
|
244
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
257
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-focused)' },
|
|
245
258
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled': {
|
|
246
259
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-primary-disabled)',
|
|
247
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
260
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-primary-disabled)',
|
|
261
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-primary-disabled)',
|
|
248
262
|
},
|
|
249
263
|
'.ids-segmented-control.ids-segmented-control-primary.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled .ids-icon':
|
|
250
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
264
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-primary-disabled)' },
|
|
251
265
|
'.ids-segmented-control.ids-segmented-control-surface .ids-segmented-control-item>button:focus': {
|
|
252
266
|
outlineColor: 'var(--ids-comp-segmented-control-focused-outline-color-dark-focused)',
|
|
253
267
|
},
|
|
@@ -258,6 +272,7 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
258
272
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button': {
|
|
259
273
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-surface-default)',
|
|
260
274
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-default)',
|
|
275
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-surface-default)',
|
|
261
276
|
},
|
|
262
277
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button .ids-icon': {
|
|
263
278
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-default)',
|
|
@@ -266,30 +281,35 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
266
281
|
{
|
|
267
282
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-surface-active)',
|
|
268
283
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-active)',
|
|
284
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-surface-active)',
|
|
269
285
|
},
|
|
270
286
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon':
|
|
271
287
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-active)' },
|
|
272
288
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:hover': {
|
|
273
289
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-surface-hovered)',
|
|
274
290
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-hovered)',
|
|
291
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-surface-hovered)',
|
|
275
292
|
},
|
|
276
293
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:hover .ids-icon':
|
|
277
294
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-hovered)' },
|
|
278
295
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:active': {
|
|
279
296
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-surface-pressed)',
|
|
280
297
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-pressed)',
|
|
298
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-surface-pressed)',
|
|
281
299
|
},
|
|
282
300
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:active .ids-icon':
|
|
283
301
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-pressed)' },
|
|
284
302
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:focus': {
|
|
285
303
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-surface-focused)',
|
|
286
304
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-focused)',
|
|
305
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-surface-focused)',
|
|
287
306
|
},
|
|
288
307
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:focus .ids-icon':
|
|
289
308
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-focused)' },
|
|
290
309
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:disabled': {
|
|
291
310
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-surface-disabled)',
|
|
292
311
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-surface-disabled)',
|
|
312
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-surface-disabled)',
|
|
293
313
|
},
|
|
294
314
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-filled .ids-segmented-control-item>button:disabled .ids-icon':
|
|
295
315
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-surface-disabled)' },
|
|
@@ -299,42 +319,48 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
299
319
|
},
|
|
300
320
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button': {
|
|
301
321
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-surface-default)',
|
|
302
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
322
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-default)',
|
|
323
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-surface-default)',
|
|
303
324
|
},
|
|
304
325
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button .ids-icon': {
|
|
305
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
326
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-default)',
|
|
306
327
|
},
|
|
307
328
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled)':
|
|
308
329
|
{
|
|
309
330
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-surface-active)',
|
|
310
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
331
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-active)',
|
|
332
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-surface-active)',
|
|
311
333
|
},
|
|
312
334
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon':
|
|
313
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
335
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-active)' },
|
|
314
336
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:hover': {
|
|
315
337
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-surface-hovered)',
|
|
316
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
338
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-hovered)',
|
|
339
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-surface-hovered)',
|
|
317
340
|
},
|
|
318
341
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:hover .ids-icon':
|
|
319
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
342
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-hovered)' },
|
|
320
343
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:active': {
|
|
321
344
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-surface-pressed)',
|
|
322
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
345
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-pressed)',
|
|
346
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-surface-pressed)',
|
|
323
347
|
},
|
|
324
348
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:active .ids-icon':
|
|
325
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
349
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-pressed)' },
|
|
326
350
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:focus': {
|
|
327
351
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-surface-focused)',
|
|
328
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
352
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-focused)',
|
|
353
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-surface-focused)',
|
|
329
354
|
},
|
|
330
355
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:focus .ids-icon':
|
|
331
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
356
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-focused)' },
|
|
332
357
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled': {
|
|
333
358
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-surface-disabled)',
|
|
334
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
359
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-surface-disabled)',
|
|
360
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-surface-disabled)',
|
|
335
361
|
},
|
|
336
362
|
'.ids-segmented-control.ids-segmented-control-surface.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled .ids-icon':
|
|
337
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
363
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-surface-disabled)' },
|
|
338
364
|
'.ids-segmented-control.ids-segmented-control-light .ids-segmented-control-item>button:focus': {
|
|
339
365
|
outlineColor: 'var(--ids-comp-segmented-control-focused-outline-color-light-focused)',
|
|
340
366
|
},
|
|
@@ -345,6 +371,7 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
345
371
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button': {
|
|
346
372
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-light-default)',
|
|
347
373
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-light-default)',
|
|
374
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-light-default)',
|
|
348
375
|
},
|
|
349
376
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button .ids-icon': {
|
|
350
377
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-default)',
|
|
@@ -353,30 +380,35 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
353
380
|
{
|
|
354
381
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-light-active)',
|
|
355
382
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-light-active)',
|
|
383
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-light-active)',
|
|
356
384
|
},
|
|
357
385
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon':
|
|
358
386
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-active)' },
|
|
359
387
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:hover': {
|
|
360
388
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-light-hovered)',
|
|
361
389
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-light-hovered)',
|
|
390
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-light-hovered)',
|
|
362
391
|
},
|
|
363
392
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:hover .ids-icon':
|
|
364
393
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-hovered)' },
|
|
365
394
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:active': {
|
|
366
395
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-light-pressed)',
|
|
367
396
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-light-pressed)',
|
|
397
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-light-pressed)',
|
|
368
398
|
},
|
|
369
399
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:active .ids-icon':
|
|
370
400
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-pressed)' },
|
|
371
401
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:focus': {
|
|
372
402
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-light-focused)',
|
|
373
403
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-light-focused)',
|
|
404
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-light-focused)',
|
|
374
405
|
},
|
|
375
406
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:focus .ids-icon':
|
|
376
407
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-focused)' },
|
|
377
408
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:disabled': {
|
|
378
409
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-light-disabled)',
|
|
379
410
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-light-disabled)',
|
|
411
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-light-disabled)',
|
|
380
412
|
},
|
|
381
413
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-filled .ids-segmented-control-item>button:disabled .ids-icon':
|
|
382
414
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-light-disabled)' },
|
|
@@ -386,42 +418,48 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
386
418
|
},
|
|
387
419
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button': {
|
|
388
420
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-light-default)',
|
|
389
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
421
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-default)',
|
|
422
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-light-default)',
|
|
390
423
|
},
|
|
391
424
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button .ids-icon': {
|
|
392
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
425
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-default)',
|
|
393
426
|
},
|
|
394
427
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled)':
|
|
395
428
|
{
|
|
396
429
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-light-active)',
|
|
397
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
430
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-active)',
|
|
431
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-light-active)',
|
|
398
432
|
},
|
|
399
433
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon':
|
|
400
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
434
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-active)' },
|
|
401
435
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:hover': {
|
|
402
436
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-light-hovered)',
|
|
403
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
437
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-hovered)',
|
|
438
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-light-hovered)',
|
|
404
439
|
},
|
|
405
440
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:hover .ids-icon':
|
|
406
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
441
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-hovered)' },
|
|
407
442
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:active': {
|
|
408
443
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-light-pressed)',
|
|
409
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
444
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-pressed)',
|
|
445
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-light-pressed)',
|
|
410
446
|
},
|
|
411
447
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:active .ids-icon':
|
|
412
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
448
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-pressed)' },
|
|
413
449
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:focus': {
|
|
414
450
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-light-focused)',
|
|
415
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
451
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-focused)',
|
|
452
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-light-focused)',
|
|
416
453
|
},
|
|
417
454
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:focus .ids-icon':
|
|
418
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
455
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-focused)' },
|
|
419
456
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled': {
|
|
420
457
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-light-disabled)',
|
|
421
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
458
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-light-disabled)',
|
|
459
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-light-disabled)',
|
|
422
460
|
},
|
|
423
461
|
'.ids-segmented-control.ids-segmented-control-light.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled .ids-icon':
|
|
424
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
462
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-light-disabled)' },
|
|
425
463
|
'.ids-segmented-control.ids-segmented-control-dark .ids-segmented-control-item>button:focus': {
|
|
426
464
|
outlineColor: 'var(--ids-comp-segmented-control-focused-outline-color-dark-focused)',
|
|
427
465
|
},
|
|
@@ -432,6 +470,7 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
432
470
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button': {
|
|
433
471
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-dark-default)',
|
|
434
472
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-default)',
|
|
473
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-dark-default)',
|
|
435
474
|
},
|
|
436
475
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button .ids-icon': {
|
|
437
476
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-default)',
|
|
@@ -440,12 +479,14 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
440
479
|
{
|
|
441
480
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-dark-active)',
|
|
442
481
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-active)',
|
|
482
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-dark-active)',
|
|
443
483
|
},
|
|
444
484
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon':
|
|
445
485
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-active)' },
|
|
446
486
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:hover': {
|
|
447
487
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-dark-hovered)',
|
|
448
488
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-hovered)',
|
|
489
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-dark-hovered)',
|
|
449
490
|
},
|
|
450
491
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:hover .ids-icon': {
|
|
451
492
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-hovered)',
|
|
@@ -453,12 +494,14 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
453
494
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:active': {
|
|
454
495
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-dark-pressed)',
|
|
455
496
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-pressed)',
|
|
497
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-dark-pressed)',
|
|
456
498
|
},
|
|
457
499
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:active .ids-icon':
|
|
458
500
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-pressed)' },
|
|
459
501
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:focus': {
|
|
460
502
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-dark-focused)',
|
|
461
503
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-focused)',
|
|
504
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-dark-focused)',
|
|
462
505
|
},
|
|
463
506
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:focus .ids-icon': {
|
|
464
507
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-focused)',
|
|
@@ -466,6 +509,7 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
466
509
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:disabled': {
|
|
467
510
|
backgroundColor: 'var(--ids-comp-segmented-control-button-filled-color-bg-dark-disabled)',
|
|
468
511
|
color: 'var(--ids-comp-segmented-control-button-filled-color-fg-label-dark-disabled)',
|
|
512
|
+
borderColor: 'var(--ids-comp-segmented-control-button-filled-color-border-dark-disabled)',
|
|
469
513
|
},
|
|
470
514
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-filled .ids-segmented-control-item>button:disabled .ids-icon':
|
|
471
515
|
{ color: 'var(--ids-comp-segmented-control-button-filled-color-fg-icon-dark-disabled)' },
|
|
@@ -475,42 +519,48 @@ module.exports = function SegmentedControlPlugin() {
|
|
|
475
519
|
},
|
|
476
520
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button': {
|
|
477
521
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-dark-default)',
|
|
478
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
522
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-default)',
|
|
523
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-dark-default)',
|
|
479
524
|
},
|
|
480
525
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button .ids-icon': {
|
|
481
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
526
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-default)',
|
|
482
527
|
},
|
|
483
528
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled)':
|
|
484
529
|
{
|
|
485
530
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-dark-active)',
|
|
486
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
531
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-active)',
|
|
532
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-dark-active)',
|
|
487
533
|
},
|
|
488
534
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button.ids-segmented-control-item-selected:not(:disabled) .ids-icon':
|
|
489
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
535
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-active)' },
|
|
490
536
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:hover': {
|
|
491
537
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-dark-hovered)',
|
|
492
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
538
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-hovered)',
|
|
539
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-dark-hovered)',
|
|
493
540
|
},
|
|
494
541
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:hover .ids-icon':
|
|
495
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
542
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-hovered)' },
|
|
496
543
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:active': {
|
|
497
544
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-dark-pressed)',
|
|
498
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
545
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-pressed)',
|
|
546
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-dark-pressed)',
|
|
499
547
|
},
|
|
500
548
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:active .ids-icon':
|
|
501
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
549
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-pressed)' },
|
|
502
550
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:focus': {
|
|
503
551
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-dark-focused)',
|
|
504
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
552
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-focused)',
|
|
553
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-dark-focused)',
|
|
505
554
|
},
|
|
506
555
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:focus .ids-icon':
|
|
507
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
556
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-focused)' },
|
|
508
557
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled': {
|
|
509
558
|
backgroundColor: 'var(--ids-comp-segmented-control-button-outlined-color-bg-dark-disabled)',
|
|
510
|
-
color: 'var(--ids-comp-segmented-control-button-
|
|
559
|
+
color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-label-dark-disabled)',
|
|
560
|
+
borderColor: 'var(--ids-comp-segmented-control-button-outlined-color-border-dark-disabled)',
|
|
511
561
|
},
|
|
512
562
|
'.ids-segmented-control.ids-segmented-control-dark.ids-segmented-control-outlined .ids-segmented-control-item>button:disabled .ids-icon':
|
|
513
|
-
{ color: 'var(--ids-comp-segmented-control-button-
|
|
563
|
+
{ color: 'var(--ids-comp-segmented-control-button-outlined-color-fg-icon-dark-disabled)' },
|
|
514
564
|
};
|
|
515
565
|
|
|
516
566
|
addComponents(cssObj);
|
package/dist/tag/tag.css
CHANGED
|
@@ -459,4 +459,11 @@
|
|
|
459
459
|
color: var(--ids-comp-tag-outlined-color-fg-label-surface-pressed);
|
|
460
460
|
background: var(--ids-comp-tag-outlined-color-bg-surface-pressed);
|
|
461
461
|
border-color: var(--ids-comp-tag-outlined-color-border-surface-pressed);
|
|
462
|
+
}
|
|
463
|
+
|
|
464
|
+
button.ids-tag :not(:disabled) {
|
|
465
|
+
cursor: pointer;
|
|
466
|
+
}
|
|
467
|
+
button.ids-tag :disabled {
|
|
468
|
+
cursor: not-allowed;
|
|
462
469
|
}
|
package/dist/tag/tag.min.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ids-tag{flex-shrink:0;width:fit-content;display:inline-flex;align-items:center;justify-content:center;border-style:solid;box-sizing:border-box}.ids-tag:focus{outline-offset:2px;outline:var(--ids-comp-tag-focused-outline-size-outline) solid var(--ids-comp-tag-focused-outline-color-dark-focused)}.ids-tag:focus.ids-tag-light{outline-color:var(--ids-comp-tag-focused-outline-color-light-focused)}.ids-tag:active{outline:none}.ids-tag *[icon-leading],.ids-tag *[icon-trailing]{gap:10px;display:flex;align-items:center;justify-content:center}.ids-tag.ids-tag-compact{gap:var(--ids-comp-tag-size-gap-compact);height:var(--ids-comp-tag-size-height-compact);padding:var(--ids-comp-tag-size-padding-y-compact) var(--ids-comp-tag-size-padding-x-compact);border-radius:var(--ids-comp-tag-size-border-radius-compact);border:var(--ids-comp-tag-size-border-width-compact)}.ids-tag.ids-tag-compact>.ids-tag-label{font-family:var(--ids-comp-tag-label-typography-font-family-compact);font-size:var(--ids-comp-tag-label-typography-font-size-compact);font-weight:var(--ids-comp-tag-label-typography-font-weight-compact);letter-spacing:var(--ids-comp-tag-label-typography-letter-spacing-compact);line-height:var(--ids-comp-tag-label-typography-line-height-compact)}.ids-tag.ids-tag-compact *[icon-leading],.ids-tag.ids-tag-compact *[icon-trailing]{width:var(--ids-comp-tag-size-icon-compact);height:var(--ids-comp-tag-size-icon-compact)}.ids-tag.ids-tag-comfortable{gap:var(--ids-comp-tag-size-gap-comfortable);height:var(--ids-comp-tag-size-height-comfortable);padding:var(--ids-comp-tag-size-padding-y-comfortable) var(--ids-comp-tag-size-padding-x-comfortable);border-radius:var(--ids-comp-tag-size-border-radius-comfortable);border:var(--ids-comp-tag-size-border-width-comfortable)}.ids-tag.ids-tag-comfortable>.ids-tag-label{font-family:var(--ids-comp-tag-label-typography-font-family-comfortable);font-size:var(--ids-comp-tag-label-typography-font-size-comfortable);font-weight:var(--ids-comp-tag-label-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-tag-label-typography-letter-spacing-comfortable);line-height:var(--ids-comp-tag-label-typography-line-height-comfortable)}.ids-tag.ids-tag-comfortable *[icon-leading],.ids-tag.ids-tag-comfortable *[icon-trailing]{width:var(--ids-comp-tag-size-icon-comfortable);height:var(--ids-comp-tag-size-icon-comfortable)}.ids-tag.ids-tag-spacious{gap:var(--ids-comp-tag-size-gap-spacious);height:var(--ids-comp-tag-size-height-spacious);padding:var(--ids-comp-tag-size-padding-y-spacious) var(--ids-comp-tag-size-padding-x-spacious);border-radius:var(--ids-comp-tag-size-border-radius-spacious);border:var(--ids-comp-tag-size-border-width-spacious)}.ids-tag.ids-tag-spacious>.ids-tag-label{font-family:var(--ids-comp-tag-label-typography-font-family-spacious);font-size:var(--ids-comp-tag-label-typography-font-size-spacious);font-weight:var(--ids-comp-tag-label-typography-font-weight-spacious);letter-spacing:var(--ids-comp-tag-label-typography-letter-spacing-spacious);line-height:var(--ids-comp-tag-label-typography-line-height-spacious)}.ids-tag.ids-tag-spacious *[icon-leading],.ids-tag.ids-tag-spacious *[icon-trailing]{width:var(--ids-comp-tag-size-icon-spacious);height:var(--ids-comp-tag-size-icon-spacious)}.ids-tag.ids-tag-dense{gap:var(--ids-comp-tag-size-gap-dense);height:var(--ids-comp-tag-size-height-dense);padding:var(--ids-comp-tag-size-padding-y-dense) var(--ids-comp-tag-size-padding-x-dense);border-radius:var(--ids-comp-tag-size-border-radius-dense);border:var(--ids-comp-tag-size-border-width-dense)}.ids-tag.ids-tag-dense>.ids-tag-label{font-family:var(--ids-comp-tag-label-typography-font-family-dense);font-size:var(--ids-comp-tag-label-typography-font-size-dense);font-weight:var(--ids-comp-tag-label-typography-font-weight-dense);letter-spacing:var(--ids-comp-tag-label-typography-letter-spacing-dense);line-height:var(--ids-comp-tag-label-typography-line-height-dense)}.ids-tag.ids-tag-dense *[icon-leading],.ids-tag.ids-tag-dense *[icon-trailing]{width:var(--ids-comp-tag-size-icon-dense);height:var(--ids-comp-tag-size-icon-dense)}.ids-tag.ids-tag-filled.ids-tag-primary{color:var(--ids-comp-tag-filled-color-fg-label-primary-default);background:var(--ids-comp-tag-filled-color-bg-primary-default);border-color:var(--ids-comp-tag-filled-color-border-primary-default)}.ids-tag.ids-tag-filled.ids-tag-primary:hover{color:var(--ids-comp-tag-filled-color-fg-label-primary-hovered);background:var(--ids-comp-tag-filled-color-bg-primary-hovered);border-color:var(--ids-comp-tag-filled-color-border-primary-hovered)}.ids-tag.ids-tag-filled.ids-tag-primary:focus{color:var(--ids-comp-tag-filled-color-fg-label-primary-focused);background:var(--ids-comp-tag-filled-color-bg-primary-focused);border-color:var(--ids-comp-tag-filled-color-border-primary-focused)}.ids-tag.ids-tag-filled.ids-tag-primary:active{color:var(--ids-comp-tag-filled-color-fg-label-primary-pressed);background:var(--ids-comp-tag-filled-color-bg-primary-pressed);border-color:var(--ids-comp-tag-filled-color-border-primary-pressed)}.ids-tag.ids-tag-filled.ids-tag-secondary{color:var(--ids-comp-tag-filled-color-fg-label-secondary-default);background:var(--ids-comp-tag-filled-color-bg-secondary-default);border-color:var(--ids-comp-tag-filled-color-border-secondary-default)}.ids-tag.ids-tag-filled.ids-tag-secondary:hover{color:var(--ids-comp-tag-filled-color-fg-label-secondary-hovered);background:var(--ids-comp-tag-filled-color-bg-secondary-hovered);border-color:var(--ids-comp-tag-filled-color-border-secondary-hovered)}.ids-tag.ids-tag-filled.ids-tag-secondary:focus{color:var(--ids-comp-tag-filled-color-fg-label-secondary-focused);background:var(--ids-comp-tag-filled-color-bg-secondary-focused);border-color:var(--ids-comp-tag-filled-color-border-secondary-focused)}.ids-tag.ids-tag-filled.ids-tag-secondary:active{color:var(--ids-comp-tag-filled-color-fg-label-secondary-pressed);background:var(--ids-comp-tag-filled-color-bg-secondary-pressed);border-color:var(--ids-comp-tag-filled-color-border-secondary-pressed)}.ids-tag.ids-tag-filled.ids-tag-brand{color:var(--ids-comp-tag-filled-color-fg-label-brand-default);background:var(--ids-comp-tag-filled-color-bg-brand-default);border-color:var(--ids-comp-tag-filled-color-border-brand-default)}.ids-tag.ids-tag-filled.ids-tag-brand:hover{color:var(--ids-comp-tag-filled-color-fg-label-brand-hovered);background:var(--ids-comp-tag-filled-color-bg-brand-hovered);border-color:var(--ids-comp-tag-filled-color-border-brand-hovered)}.ids-tag.ids-tag-filled.ids-tag-brand:focus{color:var(--ids-comp-tag-filled-color-fg-label-brand-focused);background:var(--ids-comp-tag-filled-color-bg-brand-focused);border-color:var(--ids-comp-tag-filled-color-border-brand-focused)}.ids-tag.ids-tag-filled.ids-tag-brand:active{color:var(--ids-comp-tag-filled-color-fg-label-brand-pressed);background:var(--ids-comp-tag-filled-color-bg-brand-pressed);border-color:var(--ids-comp-tag-filled-color-border-brand-pressed)}.ids-tag.ids-tag-filled.ids-tag-error{color:var(--ids-comp-tag-filled-color-fg-label-error-default);background:var(--ids-comp-tag-filled-color-bg-error-default);border-color:var(--ids-comp-tag-filled-color-border-error-default)}.ids-tag.ids-tag-filled.ids-tag-error:hover{color:var(--ids-comp-tag-filled-color-fg-label-error-hovered);background:var(--ids-comp-tag-filled-color-bg-error-hovered);border-color:var(--ids-comp-tag-filled-color-border-error-hovered)}.ids-tag.ids-tag-filled.ids-tag-error:focus{color:var(--ids-comp-tag-filled-color-fg-label-error-focused);background:var(--ids-comp-tag-filled-color-bg-error-focused);border-color:var(--ids-comp-tag-filled-color-border-error-focused)}.ids-tag.ids-tag-filled.ids-tag-error:active{color:var(--ids-comp-tag-filled-color-fg-label-error-pressed);background:var(--ids-comp-tag-filled-color-bg-error-pressed);border-color:var(--ids-comp-tag-filled-color-border-error-pressed)}.ids-tag.ids-tag-filled.ids-tag-success{color:var(--ids-comp-tag-filled-color-fg-label-success-default);background:var(--ids-comp-tag-filled-color-bg-success-default);border-color:var(--ids-comp-tag-filled-color-border-success-default)}.ids-tag.ids-tag-filled.ids-tag-success:hover{color:var(--ids-comp-tag-filled-color-fg-label-success-hovered);background:var(--ids-comp-tag-filled-color-bg-success-hovered);border-color:var(--ids-comp-tag-filled-color-border-success-hovered)}.ids-tag.ids-tag-filled.ids-tag-success:focus{color:var(--ids-comp-tag-filled-color-fg-label-success-focused);background:var(--ids-comp-tag-filled-color-bg-success-focused);border-color:var(--ids-comp-tag-filled-color-border-success-focused)}.ids-tag.ids-tag-filled.ids-tag-success:active{color:var(--ids-comp-tag-filled-color-fg-label-success-pressed);background:var(--ids-comp-tag-filled-color-bg-success-pressed);border-color:var(--ids-comp-tag-filled-color-border-success-pressed)}.ids-tag.ids-tag-filled.ids-tag-warning{color:var(--ids-comp-tag-filled-color-fg-label-warning-default);background:var(--ids-comp-tag-filled-color-bg-warning-default);border-color:var(--ids-comp-tag-filled-color-border-warning-default)}.ids-tag.ids-tag-filled.ids-tag-warning:hover{color:var(--ids-comp-tag-filled-color-fg-label-warning-hovered);background:var(--ids-comp-tag-filled-color-bg-warning-hovered);border-color:var(--ids-comp-tag-filled-color-border-warning-hovered)}.ids-tag.ids-tag-filled.ids-tag-warning:focus{color:var(--ids-comp-tag-filled-color-fg-label-warning-focused);background:var(--ids-comp-tag-filled-color-bg-warning-focused);border-color:var(--ids-comp-tag-filled-color-border-warning-focused)}.ids-tag.ids-tag-filled.ids-tag-warning:active{color:var(--ids-comp-tag-filled-color-fg-label-warning-pressed);background:var(--ids-comp-tag-filled-color-bg-warning-pressed);border-color:var(--ids-comp-tag-filled-color-border-warning-pressed)}.ids-tag.ids-tag-filled.ids-tag-light{color:var(--ids-comp-tag-filled-color-fg-label-light-default);background:var(--ids-comp-tag-filled-color-bg-light-default);border-color:var(--ids-comp-tag-filled-color-border-light-default)}.ids-tag.ids-tag-filled.ids-tag-light:hover{color:var(--ids-comp-tag-filled-color-fg-label-light-hovered);background:var(--ids-comp-tag-filled-color-bg-light-hovered);border-color:var(--ids-comp-tag-filled-color-border-light-hovered)}.ids-tag.ids-tag-filled.ids-tag-light:focus{color:var(--ids-comp-tag-filled-color-fg-label-light-focused);background:var(--ids-comp-tag-filled-color-bg-light-focused);border-color:var(--ids-comp-tag-filled-color-border-light-focused)}.ids-tag.ids-tag-filled.ids-tag-light:active{color:var(--ids-comp-tag-filled-color-fg-label-light-pressed);background:var(--ids-comp-tag-filled-color-bg-light-pressed);border-color:var(--ids-comp-tag-filled-color-border-light-pressed)}.ids-tag.ids-tag-filled.ids-tag-dark{color:var(--ids-comp-tag-filled-color-fg-label-dark-default);background:var(--ids-comp-tag-filled-color-bg-dark-default);border-color:var(--ids-comp-tag-filled-color-border-dark-default)}.ids-tag.ids-tag-filled.ids-tag-dark:hover{color:var(--ids-comp-tag-filled-color-fg-label-dark-hovered);background:var(--ids-comp-tag-filled-color-bg-dark-hovered);border-color:var(--ids-comp-tag-filled-color-border-dark-hovered)}.ids-tag.ids-tag-filled.ids-tag-dark:focus{color:var(--ids-comp-tag-filled-color-fg-label-dark-focused);background:var(--ids-comp-tag-filled-color-bg-dark-focused);border-color:var(--ids-comp-tag-filled-color-border-dark-focused)}.ids-tag.ids-tag-filled.ids-tag-dark:active{color:var(--ids-comp-tag-filled-color-fg-label-dark-pressed);background:var(--ids-comp-tag-filled-color-bg-dark-pressed);border-color:var(--ids-comp-tag-filled-color-border-dark-pressed)}.ids-tag.ids-tag-filled.ids-tag-surface{color:var(--ids-comp-tag-filled-color-fg-label-surface-default);background:var(--ids-comp-tag-filled-color-bg-surface-default);border-color:var(--ids-comp-tag-filled-color-border-surface-default)}.ids-tag.ids-tag-filled.ids-tag-surface:hover{color:var(--ids-comp-tag-filled-color-fg-label-surface-hovered);background:var(--ids-comp-tag-filled-color-bg-surface-hovered);border-color:var(--ids-comp-tag-filled-color-border-surface-hovered)}.ids-tag.ids-tag-filled.ids-tag-surface:focus{color:var(--ids-comp-tag-filled-color-fg-label-surface-focused);background:var(--ids-comp-tag-filled-color-bg-surface-focused);border-color:var(--ids-comp-tag-filled-color-border-surface-focused)}.ids-tag.ids-tag-filled.ids-tag-surface:active{color:var(--ids-comp-tag-filled-color-fg-label-surface-pressed);background:var(--ids-comp-tag-filled-color-bg-surface-pressed);border-color:var(--ids-comp-tag-filled-color-border-surface-pressed)}.ids-tag.ids-tag-outlined.ids-tag-primary{color:var(--ids-comp-tag-outlined-color-fg-label-primary-default);background:var(--ids-comp-tag-outlined-color-bg-primary-default);border-color:var(--ids-comp-tag-outlined-color-border-primary-default)}.ids-tag.ids-tag-outlined.ids-tag-primary:hover{color:var(--ids-comp-tag-outlined-color-fg-label-primary-hovered);background:var(--ids-comp-tag-outlined-color-bg-primary-hovered);border-color:var(--ids-comp-tag-outlined-color-border-primary-hovered)}.ids-tag.ids-tag-outlined.ids-tag-primary:focus{color:var(--ids-comp-tag-outlined-color-fg-label-primary-focused);background:var(--ids-comp-tag-outlined-color-bg-primary-focused);border-color:var(--ids-comp-tag-outlined-color-border-primary-focused)}.ids-tag.ids-tag-outlined.ids-tag-primary:active{color:var(--ids-comp-tag-outlined-color-fg-label-primary-pressed);background:var(--ids-comp-tag-outlined-color-bg-primary-pressed);border-color:var(--ids-comp-tag-outlined-color-border-primary-pressed)}.ids-tag.ids-tag-outlined.ids-tag-secondary{color:var(--ids-comp-tag-outlined-color-fg-label-secondary-default);background:var(--ids-comp-tag-outlined-color-bg-secondary-default);border-color:var(--ids-comp-tag-outlined-color-border-secondary-default)}.ids-tag.ids-tag-outlined.ids-tag-secondary:hover{color:var(--ids-comp-tag-outlined-color-fg-label-secondary-hovered);background:var(--ids-comp-tag-outlined-color-bg-secondary-hovered);border-color:var(--ids-comp-tag-outlined-color-border-secondary-hovered)}.ids-tag.ids-tag-outlined.ids-tag-secondary:focus{color:var(--ids-comp-tag-outlined-color-fg-label-secondary-focused);background:var(--ids-comp-tag-outlined-color-bg-secondary-focused);border-color:var(--ids-comp-tag-outlined-color-border-secondary-focused)}.ids-tag.ids-tag-outlined.ids-tag-secondary:active{color:var(--ids-comp-tag-outlined-color-fg-label-secondary-pressed);background:var(--ids-comp-tag-outlined-color-bg-secondary-pressed);border-color:var(--ids-comp-tag-outlined-color-border-secondary-pressed)}.ids-tag.ids-tag-outlined.ids-tag-brand{color:var(--ids-comp-tag-outlined-color-fg-label-brand-default);background:var(--ids-comp-tag-outlined-color-bg-brand-default);border-color:var(--ids-comp-tag-outlined-color-border-brand-default)}.ids-tag.ids-tag-outlined.ids-tag-brand:hover{color:var(--ids-comp-tag-outlined-color-fg-label-brand-hovered);background:var(--ids-comp-tag-outlined-color-bg-brand-hovered);border-color:var(--ids-comp-tag-outlined-color-border-brand-hovered)}.ids-tag.ids-tag-outlined.ids-tag-brand:focus{color:var(--ids-comp-tag-outlined-color-fg-label-brand-focused);background:var(--ids-comp-tag-outlined-color-bg-brand-focused);border-color:var(--ids-comp-tag-outlined-color-border-brand-focused)}.ids-tag.ids-tag-outlined.ids-tag-brand:active{color:var(--ids-comp-tag-outlined-color-fg-label-brand-pressed);background:var(--ids-comp-tag-outlined-color-bg-brand-pressed);border-color:var(--ids-comp-tag-outlined-color-border-brand-pressed)}.ids-tag.ids-tag-outlined.ids-tag-error{color:var(--ids-comp-tag-outlined-color-fg-label-error-default);background:var(--ids-comp-tag-outlined-color-bg-error-default);border-color:var(--ids-comp-tag-outlined-color-border-error-default)}.ids-tag.ids-tag-outlined.ids-tag-error:hover{color:var(--ids-comp-tag-outlined-color-fg-label-error-hovered);background:var(--ids-comp-tag-outlined-color-bg-error-hovered);border-color:var(--ids-comp-tag-outlined-color-border-error-hovered)}.ids-tag.ids-tag-outlined.ids-tag-error:focus{color:var(--ids-comp-tag-outlined-color-fg-label-error-focused);background:var(--ids-comp-tag-outlined-color-bg-error-focused);border-color:var(--ids-comp-tag-outlined-color-border-error-focused)}.ids-tag.ids-tag-outlined.ids-tag-error:active{color:var(--ids-comp-tag-outlined-color-fg-label-error-pressed);background:var(--ids-comp-tag-outlined-color-bg-error-pressed);border-color:var(--ids-comp-tag-outlined-color-border-error-pressed)}.ids-tag.ids-tag-outlined.ids-tag-success{color:var(--ids-comp-tag-outlined-color-fg-label-success-default);background:var(--ids-comp-tag-outlined-color-bg-success-default);border-color:var(--ids-comp-tag-outlined-color-border-success-default)}.ids-tag.ids-tag-outlined.ids-tag-success:hover{color:var(--ids-comp-tag-outlined-color-fg-label-success-hovered);background:var(--ids-comp-tag-outlined-color-bg-success-hovered);border-color:var(--ids-comp-tag-outlined-color-border-success-hovered)}.ids-tag.ids-tag-outlined.ids-tag-success:focus{color:var(--ids-comp-tag-outlined-color-fg-label-success-focused);background:var(--ids-comp-tag-outlined-color-bg-success-focused);border-color:var(--ids-comp-tag-outlined-color-border-success-focused)}.ids-tag.ids-tag-outlined.ids-tag-success:active{color:var(--ids-comp-tag-outlined-color-fg-label-success-pressed);background:var(--ids-comp-tag-outlined-color-bg-success-pressed);border-color:var(--ids-comp-tag-outlined-color-border-success-pressed)}.ids-tag.ids-tag-outlined.ids-tag-warning{color:var(--ids-comp-tag-outlined-color-fg-label-warning-default);background:var(--ids-comp-tag-outlined-color-bg-warning-default);border-color:var(--ids-comp-tag-outlined-color-border-warning-default)}.ids-tag.ids-tag-outlined.ids-tag-warning:hover{color:var(--ids-comp-tag-outlined-color-fg-label-warning-hovered);background:var(--ids-comp-tag-outlined-color-bg-warning-hovered);border-color:var(--ids-comp-tag-outlined-color-border-warning-hovered)}.ids-tag.ids-tag-outlined.ids-tag-warning:focus{color:var(--ids-comp-tag-outlined-color-fg-label-warning-focused);background:var(--ids-comp-tag-outlined-color-bg-warning-focused);border-color:var(--ids-comp-tag-outlined-color-border-warning-focused)}.ids-tag.ids-tag-outlined.ids-tag-warning:active{color:var(--ids-comp-tag-outlined-color-fg-label-warning-pressed);background:var(--ids-comp-tag-outlined-color-bg-warning-pressed);border-color:var(--ids-comp-tag-outlined-color-border-warning-pressed)}.ids-tag.ids-tag-outlined.ids-tag-light{color:var(--ids-comp-tag-outlined-color-fg-label-light-default);background:var(--ids-comp-tag-outlined-color-bg-light-default);border-color:var(--ids-comp-tag-outlined-color-border-light-default)}.ids-tag.ids-tag-outlined.ids-tag-light:hover{color:var(--ids-comp-tag-outlined-color-fg-label-light-hovered);background:var(--ids-comp-tag-outlined-color-bg-light-hovered);border-color:var(--ids-comp-tag-outlined-color-border-light-hovered)}.ids-tag.ids-tag-outlined.ids-tag-light:focus{color:var(--ids-comp-tag-outlined-color-fg-label-light-focused);background:var(--ids-comp-tag-outlined-color-bg-light-focused);border-color:var(--ids-comp-tag-outlined-color-border-light-focused)}.ids-tag.ids-tag-outlined.ids-tag-light:active{color:var(--ids-comp-tag-outlined-color-fg-label-light-pressed);background:var(--ids-comp-tag-outlined-color-bg-light-pressed);border-color:var(--ids-comp-tag-outlined-color-border-light-pressed)}.ids-tag.ids-tag-outlined.ids-tag-dark{color:var(--ids-comp-tag-outlined-color-fg-label-dark-default);background:var(--ids-comp-tag-outlined-color-bg-dark-default);border-color:var(--ids-comp-tag-outlined-color-border-dark-default)}.ids-tag.ids-tag-outlined.ids-tag-dark:hover{color:var(--ids-comp-tag-outlined-color-fg-label-dark-hovered);background:var(--ids-comp-tag-outlined-color-bg-dark-hovered);border-color:var(--ids-comp-tag-outlined-color-border-dark-hovered)}.ids-tag.ids-tag-outlined.ids-tag-dark:focus{color:var(--ids-comp-tag-outlined-color-fg-label-dark-focused);background:var(--ids-comp-tag-outlined-color-bg-dark-focused);border-color:var(--ids-comp-tag-outlined-color-border-dark-focused)}.ids-tag.ids-tag-outlined.ids-tag-dark:active{color:var(--ids-comp-tag-outlined-color-fg-label-dark-pressed);background:var(--ids-comp-tag-outlined-color-bg-dark-pressed);border-color:var(--ids-comp-tag-outlined-color-border-dark-pressed)}.ids-tag.ids-tag-outlined.ids-tag-surface{color:var(--ids-comp-tag-outlined-color-fg-label-surface-default);background:var(--ids-comp-tag-outlined-color-bg-surface-default);border-color:var(--ids-comp-tag-outlined-color-border-surface-default)}.ids-tag.ids-tag-outlined.ids-tag-surface:hover{color:var(--ids-comp-tag-outlined-color-fg-label-surface-hovered);background:var(--ids-comp-tag-outlined-color-bg-surface-hovered);border-color:var(--ids-comp-tag-outlined-color-border-surface-hovered)}.ids-tag.ids-tag-outlined.ids-tag-surface:focus{color:var(--ids-comp-tag-outlined-color-fg-label-surface-focused);background:var(--ids-comp-tag-outlined-color-bg-surface-focused);border-color:var(--ids-comp-tag-outlined-color-border-surface-focused)}.ids-tag.ids-tag-outlined.ids-tag-surface:active{color:var(--ids-comp-tag-outlined-color-fg-label-surface-pressed);background:var(--ids-comp-tag-outlined-color-bg-surface-pressed);border-color:var(--ids-comp-tag-outlined-color-border-surface-pressed)}
|
|
1
|
+
.ids-tag{flex-shrink:0;width:fit-content;display:inline-flex;align-items:center;justify-content:center;border-style:solid;box-sizing:border-box}.ids-tag:focus{outline-offset:2px;outline:var(--ids-comp-tag-focused-outline-size-outline) solid var(--ids-comp-tag-focused-outline-color-dark-focused)}.ids-tag:focus.ids-tag-light{outline-color:var(--ids-comp-tag-focused-outline-color-light-focused)}.ids-tag:active{outline:none}.ids-tag *[icon-leading],.ids-tag *[icon-trailing]{gap:10px;display:flex;align-items:center;justify-content:center}.ids-tag.ids-tag-compact{gap:var(--ids-comp-tag-size-gap-compact);height:var(--ids-comp-tag-size-height-compact);padding:var(--ids-comp-tag-size-padding-y-compact) var(--ids-comp-tag-size-padding-x-compact);border-radius:var(--ids-comp-tag-size-border-radius-compact);border:var(--ids-comp-tag-size-border-width-compact)}.ids-tag.ids-tag-compact>.ids-tag-label{font-family:var(--ids-comp-tag-label-typography-font-family-compact);font-size:var(--ids-comp-tag-label-typography-font-size-compact);font-weight:var(--ids-comp-tag-label-typography-font-weight-compact);letter-spacing:var(--ids-comp-tag-label-typography-letter-spacing-compact);line-height:var(--ids-comp-tag-label-typography-line-height-compact)}.ids-tag.ids-tag-compact *[icon-leading],.ids-tag.ids-tag-compact *[icon-trailing]{width:var(--ids-comp-tag-size-icon-compact);height:var(--ids-comp-tag-size-icon-compact)}.ids-tag.ids-tag-comfortable{gap:var(--ids-comp-tag-size-gap-comfortable);height:var(--ids-comp-tag-size-height-comfortable);padding:var(--ids-comp-tag-size-padding-y-comfortable) var(--ids-comp-tag-size-padding-x-comfortable);border-radius:var(--ids-comp-tag-size-border-radius-comfortable);border:var(--ids-comp-tag-size-border-width-comfortable)}.ids-tag.ids-tag-comfortable>.ids-tag-label{font-family:var(--ids-comp-tag-label-typography-font-family-comfortable);font-size:var(--ids-comp-tag-label-typography-font-size-comfortable);font-weight:var(--ids-comp-tag-label-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-tag-label-typography-letter-spacing-comfortable);line-height:var(--ids-comp-tag-label-typography-line-height-comfortable)}.ids-tag.ids-tag-comfortable *[icon-leading],.ids-tag.ids-tag-comfortable *[icon-trailing]{width:var(--ids-comp-tag-size-icon-comfortable);height:var(--ids-comp-tag-size-icon-comfortable)}.ids-tag.ids-tag-spacious{gap:var(--ids-comp-tag-size-gap-spacious);height:var(--ids-comp-tag-size-height-spacious);padding:var(--ids-comp-tag-size-padding-y-spacious) var(--ids-comp-tag-size-padding-x-spacious);border-radius:var(--ids-comp-tag-size-border-radius-spacious);border:var(--ids-comp-tag-size-border-width-spacious)}.ids-tag.ids-tag-spacious>.ids-tag-label{font-family:var(--ids-comp-tag-label-typography-font-family-spacious);font-size:var(--ids-comp-tag-label-typography-font-size-spacious);font-weight:var(--ids-comp-tag-label-typography-font-weight-spacious);letter-spacing:var(--ids-comp-tag-label-typography-letter-spacing-spacious);line-height:var(--ids-comp-tag-label-typography-line-height-spacious)}.ids-tag.ids-tag-spacious *[icon-leading],.ids-tag.ids-tag-spacious *[icon-trailing]{width:var(--ids-comp-tag-size-icon-spacious);height:var(--ids-comp-tag-size-icon-spacious)}.ids-tag.ids-tag-dense{gap:var(--ids-comp-tag-size-gap-dense);height:var(--ids-comp-tag-size-height-dense);padding:var(--ids-comp-tag-size-padding-y-dense) var(--ids-comp-tag-size-padding-x-dense);border-radius:var(--ids-comp-tag-size-border-radius-dense);border:var(--ids-comp-tag-size-border-width-dense)}.ids-tag.ids-tag-dense>.ids-tag-label{font-family:var(--ids-comp-tag-label-typography-font-family-dense);font-size:var(--ids-comp-tag-label-typography-font-size-dense);font-weight:var(--ids-comp-tag-label-typography-font-weight-dense);letter-spacing:var(--ids-comp-tag-label-typography-letter-spacing-dense);line-height:var(--ids-comp-tag-label-typography-line-height-dense)}.ids-tag.ids-tag-dense *[icon-leading],.ids-tag.ids-tag-dense *[icon-trailing]{width:var(--ids-comp-tag-size-icon-dense);height:var(--ids-comp-tag-size-icon-dense)}.ids-tag.ids-tag-filled.ids-tag-primary{color:var(--ids-comp-tag-filled-color-fg-label-primary-default);background:var(--ids-comp-tag-filled-color-bg-primary-default);border-color:var(--ids-comp-tag-filled-color-border-primary-default)}.ids-tag.ids-tag-filled.ids-tag-primary:hover{color:var(--ids-comp-tag-filled-color-fg-label-primary-hovered);background:var(--ids-comp-tag-filled-color-bg-primary-hovered);border-color:var(--ids-comp-tag-filled-color-border-primary-hovered)}.ids-tag.ids-tag-filled.ids-tag-primary:focus{color:var(--ids-comp-tag-filled-color-fg-label-primary-focused);background:var(--ids-comp-tag-filled-color-bg-primary-focused);border-color:var(--ids-comp-tag-filled-color-border-primary-focused)}.ids-tag.ids-tag-filled.ids-tag-primary:active{color:var(--ids-comp-tag-filled-color-fg-label-primary-pressed);background:var(--ids-comp-tag-filled-color-bg-primary-pressed);border-color:var(--ids-comp-tag-filled-color-border-primary-pressed)}.ids-tag.ids-tag-filled.ids-tag-secondary{color:var(--ids-comp-tag-filled-color-fg-label-secondary-default);background:var(--ids-comp-tag-filled-color-bg-secondary-default);border-color:var(--ids-comp-tag-filled-color-border-secondary-default)}.ids-tag.ids-tag-filled.ids-tag-secondary:hover{color:var(--ids-comp-tag-filled-color-fg-label-secondary-hovered);background:var(--ids-comp-tag-filled-color-bg-secondary-hovered);border-color:var(--ids-comp-tag-filled-color-border-secondary-hovered)}.ids-tag.ids-tag-filled.ids-tag-secondary:focus{color:var(--ids-comp-tag-filled-color-fg-label-secondary-focused);background:var(--ids-comp-tag-filled-color-bg-secondary-focused);border-color:var(--ids-comp-tag-filled-color-border-secondary-focused)}.ids-tag.ids-tag-filled.ids-tag-secondary:active{color:var(--ids-comp-tag-filled-color-fg-label-secondary-pressed);background:var(--ids-comp-tag-filled-color-bg-secondary-pressed);border-color:var(--ids-comp-tag-filled-color-border-secondary-pressed)}.ids-tag.ids-tag-filled.ids-tag-brand{color:var(--ids-comp-tag-filled-color-fg-label-brand-default);background:var(--ids-comp-tag-filled-color-bg-brand-default);border-color:var(--ids-comp-tag-filled-color-border-brand-default)}.ids-tag.ids-tag-filled.ids-tag-brand:hover{color:var(--ids-comp-tag-filled-color-fg-label-brand-hovered);background:var(--ids-comp-tag-filled-color-bg-brand-hovered);border-color:var(--ids-comp-tag-filled-color-border-brand-hovered)}.ids-tag.ids-tag-filled.ids-tag-brand:focus{color:var(--ids-comp-tag-filled-color-fg-label-brand-focused);background:var(--ids-comp-tag-filled-color-bg-brand-focused);border-color:var(--ids-comp-tag-filled-color-border-brand-focused)}.ids-tag.ids-tag-filled.ids-tag-brand:active{color:var(--ids-comp-tag-filled-color-fg-label-brand-pressed);background:var(--ids-comp-tag-filled-color-bg-brand-pressed);border-color:var(--ids-comp-tag-filled-color-border-brand-pressed)}.ids-tag.ids-tag-filled.ids-tag-error{color:var(--ids-comp-tag-filled-color-fg-label-error-default);background:var(--ids-comp-tag-filled-color-bg-error-default);border-color:var(--ids-comp-tag-filled-color-border-error-default)}.ids-tag.ids-tag-filled.ids-tag-error:hover{color:var(--ids-comp-tag-filled-color-fg-label-error-hovered);background:var(--ids-comp-tag-filled-color-bg-error-hovered);border-color:var(--ids-comp-tag-filled-color-border-error-hovered)}.ids-tag.ids-tag-filled.ids-tag-error:focus{color:var(--ids-comp-tag-filled-color-fg-label-error-focused);background:var(--ids-comp-tag-filled-color-bg-error-focused);border-color:var(--ids-comp-tag-filled-color-border-error-focused)}.ids-tag.ids-tag-filled.ids-tag-error:active{color:var(--ids-comp-tag-filled-color-fg-label-error-pressed);background:var(--ids-comp-tag-filled-color-bg-error-pressed);border-color:var(--ids-comp-tag-filled-color-border-error-pressed)}.ids-tag.ids-tag-filled.ids-tag-success{color:var(--ids-comp-tag-filled-color-fg-label-success-default);background:var(--ids-comp-tag-filled-color-bg-success-default);border-color:var(--ids-comp-tag-filled-color-border-success-default)}.ids-tag.ids-tag-filled.ids-tag-success:hover{color:var(--ids-comp-tag-filled-color-fg-label-success-hovered);background:var(--ids-comp-tag-filled-color-bg-success-hovered);border-color:var(--ids-comp-tag-filled-color-border-success-hovered)}.ids-tag.ids-tag-filled.ids-tag-success:focus{color:var(--ids-comp-tag-filled-color-fg-label-success-focused);background:var(--ids-comp-tag-filled-color-bg-success-focused);border-color:var(--ids-comp-tag-filled-color-border-success-focused)}.ids-tag.ids-tag-filled.ids-tag-success:active{color:var(--ids-comp-tag-filled-color-fg-label-success-pressed);background:var(--ids-comp-tag-filled-color-bg-success-pressed);border-color:var(--ids-comp-tag-filled-color-border-success-pressed)}.ids-tag.ids-tag-filled.ids-tag-warning{color:var(--ids-comp-tag-filled-color-fg-label-warning-default);background:var(--ids-comp-tag-filled-color-bg-warning-default);border-color:var(--ids-comp-tag-filled-color-border-warning-default)}.ids-tag.ids-tag-filled.ids-tag-warning:hover{color:var(--ids-comp-tag-filled-color-fg-label-warning-hovered);background:var(--ids-comp-tag-filled-color-bg-warning-hovered);border-color:var(--ids-comp-tag-filled-color-border-warning-hovered)}.ids-tag.ids-tag-filled.ids-tag-warning:focus{color:var(--ids-comp-tag-filled-color-fg-label-warning-focused);background:var(--ids-comp-tag-filled-color-bg-warning-focused);border-color:var(--ids-comp-tag-filled-color-border-warning-focused)}.ids-tag.ids-tag-filled.ids-tag-warning:active{color:var(--ids-comp-tag-filled-color-fg-label-warning-pressed);background:var(--ids-comp-tag-filled-color-bg-warning-pressed);border-color:var(--ids-comp-tag-filled-color-border-warning-pressed)}.ids-tag.ids-tag-filled.ids-tag-light{color:var(--ids-comp-tag-filled-color-fg-label-light-default);background:var(--ids-comp-tag-filled-color-bg-light-default);border-color:var(--ids-comp-tag-filled-color-border-light-default)}.ids-tag.ids-tag-filled.ids-tag-light:hover{color:var(--ids-comp-tag-filled-color-fg-label-light-hovered);background:var(--ids-comp-tag-filled-color-bg-light-hovered);border-color:var(--ids-comp-tag-filled-color-border-light-hovered)}.ids-tag.ids-tag-filled.ids-tag-light:focus{color:var(--ids-comp-tag-filled-color-fg-label-light-focused);background:var(--ids-comp-tag-filled-color-bg-light-focused);border-color:var(--ids-comp-tag-filled-color-border-light-focused)}.ids-tag.ids-tag-filled.ids-tag-light:active{color:var(--ids-comp-tag-filled-color-fg-label-light-pressed);background:var(--ids-comp-tag-filled-color-bg-light-pressed);border-color:var(--ids-comp-tag-filled-color-border-light-pressed)}.ids-tag.ids-tag-filled.ids-tag-dark{color:var(--ids-comp-tag-filled-color-fg-label-dark-default);background:var(--ids-comp-tag-filled-color-bg-dark-default);border-color:var(--ids-comp-tag-filled-color-border-dark-default)}.ids-tag.ids-tag-filled.ids-tag-dark:hover{color:var(--ids-comp-tag-filled-color-fg-label-dark-hovered);background:var(--ids-comp-tag-filled-color-bg-dark-hovered);border-color:var(--ids-comp-tag-filled-color-border-dark-hovered)}.ids-tag.ids-tag-filled.ids-tag-dark:focus{color:var(--ids-comp-tag-filled-color-fg-label-dark-focused);background:var(--ids-comp-tag-filled-color-bg-dark-focused);border-color:var(--ids-comp-tag-filled-color-border-dark-focused)}.ids-tag.ids-tag-filled.ids-tag-dark:active{color:var(--ids-comp-tag-filled-color-fg-label-dark-pressed);background:var(--ids-comp-tag-filled-color-bg-dark-pressed);border-color:var(--ids-comp-tag-filled-color-border-dark-pressed)}.ids-tag.ids-tag-filled.ids-tag-surface{color:var(--ids-comp-tag-filled-color-fg-label-surface-default);background:var(--ids-comp-tag-filled-color-bg-surface-default);border-color:var(--ids-comp-tag-filled-color-border-surface-default)}.ids-tag.ids-tag-filled.ids-tag-surface:hover{color:var(--ids-comp-tag-filled-color-fg-label-surface-hovered);background:var(--ids-comp-tag-filled-color-bg-surface-hovered);border-color:var(--ids-comp-tag-filled-color-border-surface-hovered)}.ids-tag.ids-tag-filled.ids-tag-surface:focus{color:var(--ids-comp-tag-filled-color-fg-label-surface-focused);background:var(--ids-comp-tag-filled-color-bg-surface-focused);border-color:var(--ids-comp-tag-filled-color-border-surface-focused)}.ids-tag.ids-tag-filled.ids-tag-surface:active{color:var(--ids-comp-tag-filled-color-fg-label-surface-pressed);background:var(--ids-comp-tag-filled-color-bg-surface-pressed);border-color:var(--ids-comp-tag-filled-color-border-surface-pressed)}.ids-tag.ids-tag-outlined.ids-tag-primary{color:var(--ids-comp-tag-outlined-color-fg-label-primary-default);background:var(--ids-comp-tag-outlined-color-bg-primary-default);border-color:var(--ids-comp-tag-outlined-color-border-primary-default)}.ids-tag.ids-tag-outlined.ids-tag-primary:hover{color:var(--ids-comp-tag-outlined-color-fg-label-primary-hovered);background:var(--ids-comp-tag-outlined-color-bg-primary-hovered);border-color:var(--ids-comp-tag-outlined-color-border-primary-hovered)}.ids-tag.ids-tag-outlined.ids-tag-primary:focus{color:var(--ids-comp-tag-outlined-color-fg-label-primary-focused);background:var(--ids-comp-tag-outlined-color-bg-primary-focused);border-color:var(--ids-comp-tag-outlined-color-border-primary-focused)}.ids-tag.ids-tag-outlined.ids-tag-primary:active{color:var(--ids-comp-tag-outlined-color-fg-label-primary-pressed);background:var(--ids-comp-tag-outlined-color-bg-primary-pressed);border-color:var(--ids-comp-tag-outlined-color-border-primary-pressed)}.ids-tag.ids-tag-outlined.ids-tag-secondary{color:var(--ids-comp-tag-outlined-color-fg-label-secondary-default);background:var(--ids-comp-tag-outlined-color-bg-secondary-default);border-color:var(--ids-comp-tag-outlined-color-border-secondary-default)}.ids-tag.ids-tag-outlined.ids-tag-secondary:hover{color:var(--ids-comp-tag-outlined-color-fg-label-secondary-hovered);background:var(--ids-comp-tag-outlined-color-bg-secondary-hovered);border-color:var(--ids-comp-tag-outlined-color-border-secondary-hovered)}.ids-tag.ids-tag-outlined.ids-tag-secondary:focus{color:var(--ids-comp-tag-outlined-color-fg-label-secondary-focused);background:var(--ids-comp-tag-outlined-color-bg-secondary-focused);border-color:var(--ids-comp-tag-outlined-color-border-secondary-focused)}.ids-tag.ids-tag-outlined.ids-tag-secondary:active{color:var(--ids-comp-tag-outlined-color-fg-label-secondary-pressed);background:var(--ids-comp-tag-outlined-color-bg-secondary-pressed);border-color:var(--ids-comp-tag-outlined-color-border-secondary-pressed)}.ids-tag.ids-tag-outlined.ids-tag-brand{color:var(--ids-comp-tag-outlined-color-fg-label-brand-default);background:var(--ids-comp-tag-outlined-color-bg-brand-default);border-color:var(--ids-comp-tag-outlined-color-border-brand-default)}.ids-tag.ids-tag-outlined.ids-tag-brand:hover{color:var(--ids-comp-tag-outlined-color-fg-label-brand-hovered);background:var(--ids-comp-tag-outlined-color-bg-brand-hovered);border-color:var(--ids-comp-tag-outlined-color-border-brand-hovered)}.ids-tag.ids-tag-outlined.ids-tag-brand:focus{color:var(--ids-comp-tag-outlined-color-fg-label-brand-focused);background:var(--ids-comp-tag-outlined-color-bg-brand-focused);border-color:var(--ids-comp-tag-outlined-color-border-brand-focused)}.ids-tag.ids-tag-outlined.ids-tag-brand:active{color:var(--ids-comp-tag-outlined-color-fg-label-brand-pressed);background:var(--ids-comp-tag-outlined-color-bg-brand-pressed);border-color:var(--ids-comp-tag-outlined-color-border-brand-pressed)}.ids-tag.ids-tag-outlined.ids-tag-error{color:var(--ids-comp-tag-outlined-color-fg-label-error-default);background:var(--ids-comp-tag-outlined-color-bg-error-default);border-color:var(--ids-comp-tag-outlined-color-border-error-default)}.ids-tag.ids-tag-outlined.ids-tag-error:hover{color:var(--ids-comp-tag-outlined-color-fg-label-error-hovered);background:var(--ids-comp-tag-outlined-color-bg-error-hovered);border-color:var(--ids-comp-tag-outlined-color-border-error-hovered)}.ids-tag.ids-tag-outlined.ids-tag-error:focus{color:var(--ids-comp-tag-outlined-color-fg-label-error-focused);background:var(--ids-comp-tag-outlined-color-bg-error-focused);border-color:var(--ids-comp-tag-outlined-color-border-error-focused)}.ids-tag.ids-tag-outlined.ids-tag-error:active{color:var(--ids-comp-tag-outlined-color-fg-label-error-pressed);background:var(--ids-comp-tag-outlined-color-bg-error-pressed);border-color:var(--ids-comp-tag-outlined-color-border-error-pressed)}.ids-tag.ids-tag-outlined.ids-tag-success{color:var(--ids-comp-tag-outlined-color-fg-label-success-default);background:var(--ids-comp-tag-outlined-color-bg-success-default);border-color:var(--ids-comp-tag-outlined-color-border-success-default)}.ids-tag.ids-tag-outlined.ids-tag-success:hover{color:var(--ids-comp-tag-outlined-color-fg-label-success-hovered);background:var(--ids-comp-tag-outlined-color-bg-success-hovered);border-color:var(--ids-comp-tag-outlined-color-border-success-hovered)}.ids-tag.ids-tag-outlined.ids-tag-success:focus{color:var(--ids-comp-tag-outlined-color-fg-label-success-focused);background:var(--ids-comp-tag-outlined-color-bg-success-focused);border-color:var(--ids-comp-tag-outlined-color-border-success-focused)}.ids-tag.ids-tag-outlined.ids-tag-success:active{color:var(--ids-comp-tag-outlined-color-fg-label-success-pressed);background:var(--ids-comp-tag-outlined-color-bg-success-pressed);border-color:var(--ids-comp-tag-outlined-color-border-success-pressed)}.ids-tag.ids-tag-outlined.ids-tag-warning{color:var(--ids-comp-tag-outlined-color-fg-label-warning-default);background:var(--ids-comp-tag-outlined-color-bg-warning-default);border-color:var(--ids-comp-tag-outlined-color-border-warning-default)}.ids-tag.ids-tag-outlined.ids-tag-warning:hover{color:var(--ids-comp-tag-outlined-color-fg-label-warning-hovered);background:var(--ids-comp-tag-outlined-color-bg-warning-hovered);border-color:var(--ids-comp-tag-outlined-color-border-warning-hovered)}.ids-tag.ids-tag-outlined.ids-tag-warning:focus{color:var(--ids-comp-tag-outlined-color-fg-label-warning-focused);background:var(--ids-comp-tag-outlined-color-bg-warning-focused);border-color:var(--ids-comp-tag-outlined-color-border-warning-focused)}.ids-tag.ids-tag-outlined.ids-tag-warning:active{color:var(--ids-comp-tag-outlined-color-fg-label-warning-pressed);background:var(--ids-comp-tag-outlined-color-bg-warning-pressed);border-color:var(--ids-comp-tag-outlined-color-border-warning-pressed)}.ids-tag.ids-tag-outlined.ids-tag-light{color:var(--ids-comp-tag-outlined-color-fg-label-light-default);background:var(--ids-comp-tag-outlined-color-bg-light-default);border-color:var(--ids-comp-tag-outlined-color-border-light-default)}.ids-tag.ids-tag-outlined.ids-tag-light:hover{color:var(--ids-comp-tag-outlined-color-fg-label-light-hovered);background:var(--ids-comp-tag-outlined-color-bg-light-hovered);border-color:var(--ids-comp-tag-outlined-color-border-light-hovered)}.ids-tag.ids-tag-outlined.ids-tag-light:focus{color:var(--ids-comp-tag-outlined-color-fg-label-light-focused);background:var(--ids-comp-tag-outlined-color-bg-light-focused);border-color:var(--ids-comp-tag-outlined-color-border-light-focused)}.ids-tag.ids-tag-outlined.ids-tag-light:active{color:var(--ids-comp-tag-outlined-color-fg-label-light-pressed);background:var(--ids-comp-tag-outlined-color-bg-light-pressed);border-color:var(--ids-comp-tag-outlined-color-border-light-pressed)}.ids-tag.ids-tag-outlined.ids-tag-dark{color:var(--ids-comp-tag-outlined-color-fg-label-dark-default);background:var(--ids-comp-tag-outlined-color-bg-dark-default);border-color:var(--ids-comp-tag-outlined-color-border-dark-default)}.ids-tag.ids-tag-outlined.ids-tag-dark:hover{color:var(--ids-comp-tag-outlined-color-fg-label-dark-hovered);background:var(--ids-comp-tag-outlined-color-bg-dark-hovered);border-color:var(--ids-comp-tag-outlined-color-border-dark-hovered)}.ids-tag.ids-tag-outlined.ids-tag-dark:focus{color:var(--ids-comp-tag-outlined-color-fg-label-dark-focused);background:var(--ids-comp-tag-outlined-color-bg-dark-focused);border-color:var(--ids-comp-tag-outlined-color-border-dark-focused)}.ids-tag.ids-tag-outlined.ids-tag-dark:active{color:var(--ids-comp-tag-outlined-color-fg-label-dark-pressed);background:var(--ids-comp-tag-outlined-color-bg-dark-pressed);border-color:var(--ids-comp-tag-outlined-color-border-dark-pressed)}.ids-tag.ids-tag-outlined.ids-tag-surface{color:var(--ids-comp-tag-outlined-color-fg-label-surface-default);background:var(--ids-comp-tag-outlined-color-bg-surface-default);border-color:var(--ids-comp-tag-outlined-color-border-surface-default)}.ids-tag.ids-tag-outlined.ids-tag-surface:hover{color:var(--ids-comp-tag-outlined-color-fg-label-surface-hovered);background:var(--ids-comp-tag-outlined-color-bg-surface-hovered);border-color:var(--ids-comp-tag-outlined-color-border-surface-hovered)}.ids-tag.ids-tag-outlined.ids-tag-surface:focus{color:var(--ids-comp-tag-outlined-color-fg-label-surface-focused);background:var(--ids-comp-tag-outlined-color-bg-surface-focused);border-color:var(--ids-comp-tag-outlined-color-border-surface-focused)}.ids-tag.ids-tag-outlined.ids-tag-surface:active{color:var(--ids-comp-tag-outlined-color-fg-label-surface-pressed);background:var(--ids-comp-tag-outlined-color-bg-surface-pressed);border-color:var(--ids-comp-tag-outlined-color-border-surface-pressed)}button.ids-tag :not(:disabled){cursor:pointer}button.ids-tag :disabled{cursor:not-allowed}
|
package/dist/tag/tag.plugin.js
CHANGED
|
@@ -455,6 +455,8 @@ module.exports = function TagPlugin() {
|
|
|
455
455
|
background: 'var(--ids-comp-tag-outlined-color-bg-surface-pressed)',
|
|
456
456
|
borderColor: 'var(--ids-comp-tag-outlined-color-border-surface-pressed)',
|
|
457
457
|
},
|
|
458
|
+
'button.ids-tag :not(:disabled)': { cursor: 'pointer' },
|
|
459
|
+
'button.ids-tag :disabled': { cursor: 'not-allowed' },
|
|
458
460
|
};
|
|
459
461
|
|
|
460
462
|
addComponents(cssObj);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@i-cell/ids-styles",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.7",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "Stylesheets for i-Cell Design System UI Kit components (currently Vue and Angular)",
|
|
6
6
|
"scripts": {
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
},
|
|
36
36
|
"homepage": "https://github.com/i-Cell-Mobilsoft-Open-Source/ids-styles#readme",
|
|
37
37
|
"devDependencies": {
|
|
38
|
-
"@i-cell/ids-tokens": "0.0.
|
|
38
|
+
"@i-cell/ids-tokens": "0.0.14",
|
|
39
39
|
"commander": "^12.1.0",
|
|
40
40
|
"gulp": "^5.0.0",
|
|
41
41
|
"gulp-prettier": "^6.0.0",
|