@i-cell/ids-styles 0.0.61 → 0.0.63

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dist/autocomplete/autocomplete.css +69 -20
  2. package/dist/autocomplete/autocomplete.min.css +1 -1
  3. package/dist/autocomplete/autocomplete.plugin.js +38 -20
  4. package/dist/components.css +98 -21
  5. package/dist/components.min.css +1 -1
  6. package/dist/components.plugin.js +70 -24
  7. package/dist/paginator/paginator.css +29 -1
  8. package/dist/paginator/paginator.min.css +1 -1
  9. package/dist/paginator/paginator.plugin.js +29 -1
  10. package/package.json +2 -2
package/dist/paginator/paginator.plugin.js CHANGED
@@ -42,7 +42,7 @@ module.exports = function PaginatorPlugin() {
42
42
  justifyContent: 'center',
43
43
  alignItems: 'center',
44
44
  fontStyle: 'normal',
45
- borderStyle: 'none',
45
+ borderStyle: 'solid',
46
46
  },
47
47
  '.ids-paginator .ids-paginator__navigation-container .ids-paginator__page-button:focus,.ids-paginator .ids-paginator__navigation-container .ids-paginator__page-button:focus-visible':
48
48
  { outlineOffset: '2px', outlineStyle: 'solid' },
@@ -67,6 +67,7 @@ module.exports = function PaginatorPlugin() {
67
67
  '.ids-paginator.ids-paginator-compact .ids-paginator__navigation-container .ids-paginator__page-button': {
68
68
  height: 'var(--ids-comp-paginator-page-links-size-height-compact)',
69
69
  minWidth: 'var(--ids-comp-paginator-page-links-size-min-width-compact)',
70
+ borderWidth: 'var(--ids-comp-paginator-page-links-size-border-width-compact)',
70
71
  padding: 'var(--ids-comp-paginator-page-links-size-padding-y-compact) var(--ids-comp-paginator-page-links-size-padding-x-compact)',
71
72
  fontFamily: 'var(--ids-comp-paginator-page-links-label-typography-font-family-compact)',
72
73
  fontSize: 'var(--ids-comp-paginator-page-links-label-typography-font-size-compact)',
@@ -112,6 +113,7 @@ module.exports = function PaginatorPlugin() {
112
113
  '.ids-paginator.ids-paginator-comfortable .ids-paginator__navigation-container .ids-paginator__page-button': {
113
114
  height: 'var(--ids-comp-paginator-page-links-size-height-comfortable)',
114
115
  minWidth: 'var(--ids-comp-paginator-page-links-size-min-width-comfortable)',
116
+ borderWidth: 'var(--ids-comp-paginator-page-links-size-border-width-comfortable)',
115
117
  padding:
116
118
  'var(--ids-comp-paginator-page-links-size-padding-y-comfortable) var(--ids-comp-paginator-page-links-size-padding-x-comfortable)',
117
119
  fontFamily: 'var(--ids-comp-paginator-page-links-label-typography-font-family-comfortable)',
@@ -156,6 +158,7 @@ module.exports = function PaginatorPlugin() {
156
158
  '.ids-paginator.ids-paginator-spacious .ids-paginator__navigation-container .ids-paginator__page-button': {
157
159
  height: 'var(--ids-comp-paginator-page-links-size-height-spacious)',
158
160
  minWidth: 'var(--ids-comp-paginator-page-links-size-min-width-spacious)',
161
+ borderWidth: 'var(--ids-comp-paginator-page-links-size-border-width-spacious)',
159
162
  padding:
160
163
  'var(--ids-comp-paginator-page-links-size-padding-y-spacious) var(--ids-comp-paginator-page-links-size-padding-x-spacious)',
161
164
  fontFamily: 'var(--ids-comp-paginator-page-links-label-typography-font-family-spacious)',
@@ -200,6 +203,7 @@ module.exports = function PaginatorPlugin() {
200
203
  '.ids-paginator.ids-paginator-dense .ids-paginator__navigation-container .ids-paginator__page-button': {
201
204
  height: 'var(--ids-comp-paginator-page-links-size-height-dense)',
202
205
  minWidth: 'var(--ids-comp-paginator-page-links-size-min-width-dense)',
206
+ borderWidth: 'var(--ids-comp-paginator-page-links-size-border-width-dense)',
203
207
  padding: 'var(--ids-comp-paginator-page-links-size-padding-y-dense) var(--ids-comp-paginator-page-links-size-padding-x-dense)',
204
208
  fontFamily: 'var(--ids-comp-paginator-page-links-label-typography-font-family-dense)',
205
209
  fontSize: 'var(--ids-comp-paginator-page-links-label-typography-font-size-dense)',
@@ -245,31 +249,37 @@ module.exports = function PaginatorPlugin() {
245
249
  {
246
250
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-primary-default)',
247
251
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-primary-default)',
252
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-primary-default)',
248
253
  },
249
254
  '.ids-paginator.ids-paginator-primary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain.active:not(:disabled)':
250
255
  {
251
256
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-primary-active)',
252
257
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-primary-active)',
258
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-primary-active)',
253
259
  },
254
260
  '.ids-paginator.ids-paginator-primary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:focus,.ids-paginator.ids-paginator-primary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:focus-visible':
255
261
  {
256
262
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-primary-focused)',
257
263
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-primary-focused)',
264
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-primary-focused)',
258
265
  },
259
266
  '.ids-paginator.ids-paginator-primary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:hover':
260
267
  {
261
268
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-primary-hovered)',
262
269
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-primary-hovered)',
270
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-primary-hovered)',
263
271
  },
264
272
  '.ids-paginator.ids-paginator-primary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:active':
265
273
  {
266
274
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-primary-pressed)',
267
275
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-primary-pressed)',
276
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-primary-pressed)',
268
277
  },
269
278
  '.ids-paginator.ids-paginator-primary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:disabled':
270
279
  {
271
280
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-primary-disabled)',
272
281
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-primary-disabled)',
282
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-primary-disabled)',
273
283
  },
274
284
  '.ids-paginator.ids-paginator-primary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain.ids-paginator__page-button-arrow':
275
285
  { color: 'var(--ids-comp-paginator-page-links-plain-color-fg-icon-primary-default)' },
@@ -294,31 +304,37 @@ module.exports = function PaginatorPlugin() {
294
304
  {
295
305
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-secondary-default)',
296
306
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-secondary-default)',
307
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-secondary-default)',
297
308
  },
298
309
  '.ids-paginator.ids-paginator-secondary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain.active:not(:disabled)':
299
310
  {
300
311
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-secondary-active)',
301
312
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-secondary-active)',
313
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-secondary-active)',
302
314
  },
303
315
  '.ids-paginator.ids-paginator-secondary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:focus,.ids-paginator.ids-paginator-secondary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:focus-visible':
304
316
  {
305
317
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-secondary-focused)',
306
318
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-secondary-focused)',
319
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-secondary-focused)',
307
320
  },
308
321
  '.ids-paginator.ids-paginator-secondary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:hover':
309
322
  {
310
323
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-secondary-hovered)',
311
324
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-secondary-hovered)',
325
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-secondary-hovered)',
312
326
  },
313
327
  '.ids-paginator.ids-paginator-secondary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:active':
314
328
  {
315
329
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-secondary-pressed)',
316
330
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-secondary-pressed)',
331
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-secondary-pressed)',
317
332
  },
318
333
  '.ids-paginator.ids-paginator-secondary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:disabled':
319
334
  {
320
335
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-secondary-disabled)',
321
336
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-secondary-disabled)',
337
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-secondary-disabled)',
322
338
  },
323
339
  '.ids-paginator.ids-paginator-secondary .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain.ids-paginator__page-button-arrow':
324
340
  { color: 'var(--ids-comp-paginator-page-links-plain-color-fg-icon-secondary-default)' },
@@ -343,31 +359,37 @@ module.exports = function PaginatorPlugin() {
343
359
  {
344
360
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-light-default)',
345
361
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-light-default)',
362
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-light-default)',
346
363
  },
347
364
  '.ids-paginator.ids-paginator-light .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain.active:not(:disabled)':
348
365
  {
349
366
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-light-active)',
350
367
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-light-active)',
368
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-light-active)',
351
369
  },
352
370
  '.ids-paginator.ids-paginator-light .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:focus,.ids-paginator.ids-paginator-light .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:focus-visible':
353
371
  {
354
372
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-light-focused)',
355
373
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-light-focused)',
374
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-light-focused)',
356
375
  },
357
376
  '.ids-paginator.ids-paginator-light .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:hover':
358
377
  {
359
378
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-light-hovered)',
360
379
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-light-hovered)',
380
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-light-hovered)',
361
381
  },
362
382
  '.ids-paginator.ids-paginator-light .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:active':
363
383
  {
364
384
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-light-pressed)',
365
385
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-light-pressed)',
386
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-light-pressed)',
366
387
  },
367
388
  '.ids-paginator.ids-paginator-light .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:disabled':
368
389
  {
369
390
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-light-disabled)',
370
391
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-light-disabled)',
392
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-light-disabled)',
371
393
  },
372
394
  '.ids-paginator.ids-paginator-light .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain.ids-paginator__page-button-arrow':
373
395
  { color: 'var(--ids-comp-paginator-page-links-plain-color-fg-icon-light-default)' },
@@ -392,31 +414,37 @@ module.exports = function PaginatorPlugin() {
392
414
  {
393
415
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-surface-default)',
394
416
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-surface-default)',
417
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-surface-default)',
395
418
  },
396
419
  '.ids-paginator.ids-paginator-surface .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain.active:not(:disabled)':
397
420
  {
398
421
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-surface-active)',
399
422
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-surface-active)',
423
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-surface-active)',
400
424
  },
401
425
  '.ids-paginator.ids-paginator-surface .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:focus,.ids-paginator.ids-paginator-surface .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:focus-visible':
402
426
  {
403
427
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-surface-focused)',
404
428
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-surface-focused)',
429
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-surface-focused)',
405
430
  },
406
431
  '.ids-paginator.ids-paginator-surface .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:hover':
407
432
  {
408
433
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-surface-hovered)',
409
434
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-surface-hovered)',
435
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-surface-hovered)',
410
436
  },
411
437
  '.ids-paginator.ids-paginator-surface .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:active':
412
438
  {
413
439
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-surface-pressed)',
414
440
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-surface-pressed)',
441
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-surface-pressed)',
415
442
  },
416
443
  '.ids-paginator.ids-paginator-surface .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain:disabled':
417
444
  {
418
445
  background: 'var(--ids-comp-paginator-page-links-plain-color-bg-surface-disabled)',
419
446
  color: 'var(--ids-comp-paginator-page-links-plain-color-fg-label-surface-disabled)',
447
+ borderColor: 'var(--ids-comp-paginator-page-links-plain-color-border-surface-disabled)',
420
448
  },
421
449
  '.ids-paginator.ids-paginator-surface .ids-paginator__navigation-container .ids-paginator__page-button.ids-paginator__page-button-plain.ids-paginator__page-button-arrow':
422
450
  { color: 'var(--ids-comp-paginator-page-links-plain-color-fg-icon-surface-default)' },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@i-cell/ids-styles",
3
- "version": "0.0.61",
3
+ "version": "0.0.63",
4
4
  "private": false,
5
5
  "description": "Stylesheets for i-Cell Design System UI Kit components (currently Vue and Angular)",
6
6
  "scripts": {
@@ -36,7 +36,7 @@
36
36
  },
37
37
  "homepage": "https://github.com/i-Cell-Mobilsoft-Open-Source/ids-styles#readme",
38
38
  "devDependencies": {
39
- "@i-cell/ids-tokens": "0.0.37",
39
+ "@i-cell/ids-tokens": "0.0.39",
40
40
  "commander": "^12.1.0",
41
41
  "gulp": "^5.0.0",
42
42
  "gulp-prettier": "^6.0.0",