@bi-digital/css 0.12.0 → 0.12.2

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/components/card.css +12 -9
  2. package/dist/components/dialog.css +6 -0
  3. package/dist/components/footer.css +2 -2
  4. package/dist/components/logo.css +1 -1
  5. package/dist/components/tabs.css +1 -1
  6. package/dist/components.css +26 -13
  7. package/dist/index.css +10 -10
  8. package/dist/salesforce.css +36 -23
  9. package/dist/tokens.css +10 -10
  10. package/package.json +2 -2
package/dist/components/card.css CHANGED
@@ -26,6 +26,10 @@
26
26
  flex-direction: row;
27
27
  display: flex;
28
28
 
29
+ @media (width < 768px) {
30
+ --bic-card-content-padding: var(--bi-scale-3x);
31
+ }
32
+
29
33
  &[data-orientation="horizontal"] {
30
34
  & > div:first-child {
31
35
  border-top-left-radius: var(--bic-card-border-radius);
@@ -39,11 +43,11 @@
39
43
 
40
44
  --bic-card-media-width: 15.75rem;
41
45
 
42
- @media (width < 1024px) {
46
+ @media (width < 1128px) {
43
47
  --bic-card-media-width: 14.5rem;
44
48
  }
45
49
 
46
- @media (width < 600px) {
50
+ @media (width < 768px) {
47
51
  --bic-card-media-width: 8.4375rem;
48
52
  }
49
53
  }
@@ -98,8 +102,7 @@
98
102
  overflow: hidden;
99
103
  }
100
104
 
101
- @media (width < 600px) {
102
- --bic-card-content-padding: var(--bi-scale-3x);
105
+ @media (width < 768px) {
103
106
  gap: var(--bi-scale-3x);
104
107
  }
105
108
  }
@@ -151,7 +154,7 @@
151
154
  background-color: var(--bic-card-actions-background-color);
152
155
  display: flex;
153
156
 
154
- @media (width < 600px) {
157
+ @media (width < 768px) {
155
158
  width: var(--bi-scale-11x);
156
159
  }
157
160
 
@@ -161,7 +164,7 @@
161
164
  --bic-button-size: var(--bi-scale-14x);
162
165
  flex: 1;
163
166
 
164
- @media (width < 600px) {
167
+ @media (width < 768px) {
165
168
  --bic-button-size: var(--bi-scale-11x);
166
169
  }
167
170
 
@@ -184,7 +187,7 @@
184
187
  color: var(--bic-card-header-label-color);
185
188
  margin: 0;
186
189
 
187
- @media (width < 600px) {
190
+ @media (width < 768px) {
188
191
  font: var(--bi-font-body-small);
189
192
  }
190
193
 
@@ -215,7 +218,7 @@
215
218
  display: -webkit-box;
216
219
  overflow: hidden;
217
220
 
218
- @media (width < 600px) {
221
+ @media (width < 768px) {
219
222
  font: var(--bi-font-title-bold-xs);
220
223
  }
221
224
  }
@@ -234,7 +237,7 @@
234
237
  width: 100%;
235
238
  display: block;
236
239
 
237
- @media (width < 600px) {
240
+ @media (width < 768px) {
238
241
  aspect-ratio: 3 / 2;
239
242
  }
240
243
  }
package/dist/components/dialog.css CHANGED
@@ -102,6 +102,12 @@
102
102
  }
103
103
  }
104
104
 
105
+ & .bi-dialog--close {
106
+ &.bi-button[data-variant="text"] {
107
+ --bic-button-color: var(--bi-color-text-secondary);
108
+ }
109
+ }
110
+
105
111
  & > button.bi-dialog--close {
106
112
  top: var(--bic-dialog-icon-spacing);
107
113
  right: var(--bic-dialog-icon-spacing);
package/dist/components/footer.css CHANGED
@@ -83,7 +83,7 @@
83
83
  min-height: 58px;
84
84
  display: flex;
85
85
 
86
- @media (width < 600px) {
86
+ @media (width < 768px) {
87
87
  gap: var(--bi-scale-2x) var(--bi-scale-1x);
88
88
  }
89
89
 
@@ -118,7 +118,7 @@
118
118
  flex-wrap: wrap;
119
119
  display: flex;
120
120
 
121
- @media (width < 600px) {
121
+ @media (width < 768px) {
122
122
  gap: var(--bi-scale-2x);
123
123
  }
124
124
  }
package/dist/components/logo.css CHANGED
@@ -56,7 +56,7 @@
56
56
  --bic-logo-height: var(--bi-scale-48x);
57
57
  }
58
58
 
59
- @media (width >= 795px) {
59
+ @media (width >= 768px) {
60
60
  &[data-international="true"] {
61
61
  &[data-vertical="true"] {
62
62
  background-image: var(--bic-logo-international-vertical);
package/dist/components/tabs.css CHANGED
@@ -101,7 +101,7 @@
101
101
  color: var(--bic-tabs-tab-color-selected);
102
102
 
103
103
  &:after {
104
- width: calc(100% - var(--bi-scale-6x));
104
+ width: 100%;
105
105
  }
106
106
  }
107
107
  }
package/dist/components.css CHANGED
@@ -352,6 +352,10 @@
352
352
  flex-direction: row;
353
353
  display: flex;
354
354
 
355
+ @media (width < 768px) {
356
+ --bic-card-content-padding: var(--bi-scale-3x);
357
+ }
358
+
355
359
  &[data-orientation="horizontal"] {
356
360
  & > div:first-child {
357
361
  border-top-left-radius: var(--bic-card-border-radius);
@@ -365,11 +369,11 @@
365
369
 
366
370
  --bic-card-media-width: 15.75rem;
367
371
 
368
- @media (width < 1024px) {
372
+ @media (width < 1128px) {
369
373
  --bic-card-media-width: 14.5rem;
370
374
  }
371
375
 
372
- @media (width < 600px) {
376
+ @media (width < 768px) {
373
377
  --bic-card-media-width: 8.4375rem;
374
378
  }
375
379
  }
@@ -424,8 +428,7 @@
424
428
  overflow: hidden;
425
429
  }
426
430
 
427
- @media (width < 600px) {
428
- --bic-card-content-padding: var(--bi-scale-3x);
431
+ @media (width < 768px) {
429
432
  gap: var(--bi-scale-3x);
430
433
  }
431
434
  }
@@ -477,7 +480,7 @@
477
480
  background-color: var(--bic-card-actions-background-color);
478
481
  display: flex;
479
482
 
480
- @media (width < 600px) {
483
+ @media (width < 768px) {
481
484
  width: var(--bi-scale-11x);
482
485
  }
483
486
 
@@ -487,7 +490,7 @@
487
490
  --bic-button-size: var(--bi-scale-14x);
488
491
  flex: 1;
489
492
 
490
- @media (width < 600px) {
493
+ @media (width < 768px) {
491
494
  --bic-button-size: var(--bi-scale-11x);
492
495
  }
493
496
 
@@ -510,7 +513,7 @@
510
513
  color: var(--bic-card-header-label-color);
511
514
  margin: 0;
512
515
 
513
- @media (width < 600px) {
516
+ @media (width < 768px) {
514
517
  font: var(--bi-font-body-small);
515
518
  }
516
519
 
@@ -541,7 +544,7 @@
541
544
  display: -webkit-box;
542
545
  overflow: hidden;
543
546
 
544
- @media (width < 600px) {
547
+ @media (width < 768px) {
545
548
  font: var(--bi-font-title-bold-xs);
546
549
  }
547
550
  }
@@ -560,7 +563,7 @@
560
563
  width: 100%;
561
564
  display: block;
562
565
 
563
- @media (width < 600px) {
566
+ @media (width < 768px) {
564
567
  aspect-ratio: 3 / 2;
565
568
  }
566
569
  }
@@ -912,6 +915,12 @@ details.bi-details {
912
915
  }
913
916
  }
914
917
 
918
+ & .bi-dialog--close {
919
+ &.bi-button[data-variant="text"] {
920
+ --bic-button-color: var(--bi-color-text-secondary);
921
+ }
922
+ }
923
+
915
924
  & > button.bi-dialog--close {
916
925
  top: var(--bic-dialog-icon-spacing);
917
926
  right: var(--bic-dialog-icon-spacing);
@@ -1747,7 +1756,7 @@ body:has(.bi-dialog:modal) {
1747
1756
  min-height: 58px;
1748
1757
  display: flex;
1749
1758
 
1750
- @media (width < 600px) {
1759
+ @media (width < 768px) {
1751
1760
  gap: var(--bi-scale-2x) var(--bi-scale-1x);
1752
1761
  }
1753
1762
 
@@ -1782,7 +1791,7 @@ body:has(.bi-dialog:modal) {
1782
1791
  flex-wrap: wrap;
1783
1792
  display: flex;
1784
1793
 
1785
- @media (width < 600px) {
1794
+ @media (width < 768px) {
1786
1795
  gap: var(--bi-scale-2x);
1787
1796
  }
1788
1797
  }
@@ -1977,7 +1986,7 @@ svg {
1977
1986
  --bic-logo-height: var(--bi-scale-48x);
1978
1987
  }
1979
1988
 
1980
- @media (width >= 795px) {
1989
+ @media (width >= 768px) {
1981
1990
  &[data-international="true"] {
1982
1991
  &[data-vertical="true"] {
1983
1992
  background-image: var(--bic-logo-international-vertical);
@@ -2348,7 +2357,7 @@ svg {
2348
2357
  color: var(--bic-tabs-tab-color-selected);
2349
2358
 
2350
2359
  &:after {
2351
- width: calc(100% - var(--bi-scale-6x));
2360
+ width: 100%;
2352
2361
  }
2353
2362
  }
2354
2363
  }
@@ -2477,6 +2486,10 @@ html {
2477
2486
  }
2478
2487
 
2479
2488
  &:has(.bi-navbar[data-fixed="true"]) {
2489
+ & .bi-sub-navbar[data-fixed="true"]:not([data-scroll-dir]) {
2490
+ top: var(--bi-layout-navbar-height);
2491
+ }
2492
+
2480
2493
  &:has(.bi-sub-navbar[data-fixed="true"][data-scroll-dir="up"]) {
2481
2494
  & .bi-navbar > header {
2482
2495
  transform: translateY(0);
package/dist/index.css CHANGED
@@ -154,15 +154,15 @@
154
154
  --bi-scale-84x: 21rem;
155
155
  --bi-scale-128x: 32rem;
156
156
  --bi-scale-max: 624.938rem;
157
+ --bi-color-stroke-basic-subtle: #0000001a;
158
+ --bi-color-stroke-basic: #0003;
159
+ --bi-color-stroke-basic-strong: #0000004d;
160
+ --bi-color-stroke-basic-contrast: #00000080;
157
161
  --bi-color-primary-text-secondary: #042f5bb3;
158
162
  --bi-color-info-text-secondary: #2e0b61b3;
159
163
  --bi-color-warning-text-secondary: #4a3c01b3;
160
164
  --bi-color-success-text-secondary: #143a16b3;
161
165
  --bi-color-alert-text-secondary: #6a1b16b3;
162
- --bi-color-stroke-basic-subtle: #0000001a;
163
- --bi-color-stroke-basic: #0003;
164
- --bi-color-stroke-basic-strong: #0000004d;
165
- --bi-color-stroke-basic-contrast: #00000080;
166
166
  --bi-states-hover: #26333f1a;
167
167
  --bi-states-press: #26333f26;
168
168
  --bi-states-hover-dark: #26333f1a;
@@ -477,6 +477,10 @@
477
477
  }
478
478
 
479
479
  [data-color-scheme="dark"] {
480
+ --bi-color-stroke-basic-subtle: #ffffff1a;
481
+ --bi-color-stroke-basic: #fff3;
482
+ --bi-color-stroke-basic-strong: #ffffff4d;
483
+ --bi-color-stroke-basic-contrast: #fff6;
480
484
  --bi-color-neutral-background: var(--bi-neutral-100);
481
485
  --bi-color-neutral-surface-subtle: var(--bi-neutral-95);
482
486
  --bi-color-neutral-surface: var(--bi-neutral-90);
@@ -509,8 +513,8 @@
509
513
  --bi-color-primary-text-secondary: #ffffffb2;
510
514
  --bi-color-primary-text-subtle: var(--bi-primary-10);
511
515
  --bi-color-primary-text-accent: var(--bi-primary-30);
512
- --bi-color-primary-contrast: var(--bi-primary-20);
513
- --bi-color-primary-contrast-hover: var(--bi-primary-30);
516
+ --bi-color-primary-contrast: var(--bi-primary-30);
517
+ --bi-color-primary-contrast-hover: var(--bi-primary-20);
514
518
  --bi-color-primary-fill: var(--bi-primary-50);
515
519
  --bi-color-primary-on-fill: var(--bi-basic-white);
516
520
  --bi-color-info-background: var(--bi-info-100);
@@ -585,10 +589,6 @@
585
589
  --bi-color-alert-contrast-hover: var(--bi-alert-15);
586
590
  --bi-color-alert-fill: var(--bi-alert-60);
587
591
  --bi-color-alert-on-fill: var(--bi-basic-white);
588
- --bi-color-stroke-basic-subtle: #ffffff1a;
589
- --bi-color-stroke-basic: #fff3;
590
- --bi-color-stroke-basic-strong: #ffffff4d;
591
- --bi-color-stroke-basic-contrast: #fff6;
592
592
  --bi-states-hover: #ffffff1a;
593
593
  --bi-states-press: #ffffff26;
594
594
  --bi-states-focus: var(--bi-primary-30);
package/dist/salesforce.css CHANGED
@@ -153,15 +153,15 @@
153
153
  --bi-scale-84x: 21rem;
154
154
  --bi-scale-128x: 32rem;
155
155
  --bi-scale-max: 624.938rem;
156
+ --bi-color-stroke-basic-subtle: #0000001a;
157
+ --bi-color-stroke-basic: #0003;
158
+ --bi-color-stroke-basic-strong: #0000004d;
159
+ --bi-color-stroke-basic-contrast: #00000080;
156
160
  --bi-color-primary-text-secondary: #042f5bb3;
157
161
  --bi-color-info-text-secondary: #2e0b61b3;
158
162
  --bi-color-warning-text-secondary: #4a3c01b3;
159
163
  --bi-color-success-text-secondary: #143a16b3;
160
164
  --bi-color-alert-text-secondary: #6a1b16b3;
161
- --bi-color-stroke-basic-subtle: #0000001a;
162
- --bi-color-stroke-basic: #0003;
163
- --bi-color-stroke-basic-strong: #0000004d;
164
- --bi-color-stroke-basic-contrast: #00000080;
165
165
  --bi-states-hover: #26333f1a;
166
166
  --bi-states-press: #26333f26;
167
167
  --bi-states-hover-dark: #26333f1a;
@@ -476,6 +476,10 @@
476
476
  }
477
477
 
478
478
  [data-color-scheme="dark"] {
479
+ --bi-color-stroke-basic-subtle: #ffffff1a;
480
+ --bi-color-stroke-basic: #fff3;
481
+ --bi-color-stroke-basic-strong: #ffffff4d;
482
+ --bi-color-stroke-basic-contrast: #fff6;
479
483
  --bi-color-neutral-background: var(--bi-neutral-100);
480
484
  --bi-color-neutral-surface-subtle: var(--bi-neutral-95);
481
485
  --bi-color-neutral-surface: var(--bi-neutral-90);
@@ -508,8 +512,8 @@
508
512
  --bi-color-primary-text-secondary: #ffffffb2;
509
513
  --bi-color-primary-text-subtle: var(--bi-primary-10);
510
514
  --bi-color-primary-text-accent: var(--bi-primary-30);
511
- --bi-color-primary-contrast: var(--bi-primary-20);
512
- --bi-color-primary-contrast-hover: var(--bi-primary-30);
515
+ --bi-color-primary-contrast: var(--bi-primary-30);
516
+ --bi-color-primary-contrast-hover: var(--bi-primary-20);
513
517
  --bi-color-primary-fill: var(--bi-primary-50);
514
518
  --bi-color-primary-on-fill: var(--bi-basic-white);
515
519
  --bi-color-info-background: var(--bi-info-100);
@@ -584,10 +588,6 @@
584
588
  --bi-color-alert-contrast-hover: var(--bi-alert-15);
585
589
  --bi-color-alert-fill: var(--bi-alert-60);
586
590
  --bi-color-alert-on-fill: var(--bi-basic-white);
587
- --bi-color-stroke-basic-subtle: #ffffff1a;
588
- --bi-color-stroke-basic: #fff3;
589
- --bi-color-stroke-basic-strong: #ffffff4d;
590
- --bi-color-stroke-basic-contrast: #fff6;
591
591
  --bi-states-hover: #ffffff1a;
592
592
  --bi-states-press: #ffffff26;
593
593
  --bi-states-focus: var(--bi-primary-30);
@@ -1075,6 +1075,10 @@
1075
1075
  flex-direction: row;
1076
1076
  display: flex;
1077
1077
 
1078
+ @media (width < 768px) {
1079
+ --bic-card-content-padding: var(--bi-scale-3x);
1080
+ }
1081
+
1078
1082
  &[data-orientation="horizontal"] {
1079
1083
  & > div:first-child {
1080
1084
  border-top-left-radius: var(--bic-card-border-radius);
@@ -1088,11 +1092,11 @@
1088
1092
 
1089
1093
  --bic-card-media-width: 15.75rem;
1090
1094
 
1091
- @media (width < 1024px) {
1095
+ @media (width < 1128px) {
1092
1096
  --bic-card-media-width: 14.5rem;
1093
1097
  }
1094
1098
 
1095
- @media (width < 600px) {
1099
+ @media (width < 768px) {
1096
1100
  --bic-card-media-width: 8.4375rem;
1097
1101
  }
1098
1102
  }
@@ -1147,8 +1151,7 @@
1147
1151
  overflow: hidden;
1148
1152
  }
1149
1153
 
1150
- @media (width < 600px) {
1151
- --bic-card-content-padding: var(--bi-scale-3x);
1154
+ @media (width < 768px) {
1152
1155
  gap: var(--bi-scale-3x);
1153
1156
  }
1154
1157
  }
@@ -1200,7 +1203,7 @@
1200
1203
  background-color: var(--bic-card-actions-background-color);
1201
1204
  display: flex;
1202
1205
 
1203
- @media (width < 600px) {
1206
+ @media (width < 768px) {
1204
1207
  width: var(--bi-scale-11x);
1205
1208
  }
1206
1209
 
@@ -1210,7 +1213,7 @@
1210
1213
  --bic-button-size: var(--bi-scale-14x);
1211
1214
  flex: 1;
1212
1215
 
1213
- @media (width < 600px) {
1216
+ @media (width < 768px) {
1214
1217
  --bic-button-size: var(--bi-scale-11x);
1215
1218
  }
1216
1219
 
@@ -1233,7 +1236,7 @@
1233
1236
  color: var(--bic-card-header-label-color);
1234
1237
  margin: 0;
1235
1238
 
1236
- @media (width < 600px) {
1239
+ @media (width < 768px) {
1237
1240
  font: var(--bi-font-body-small);
1238
1241
  }
1239
1242
 
@@ -1264,7 +1267,7 @@
1264
1267
  display: -webkit-box;
1265
1268
  overflow: hidden;
1266
1269
 
1267
- @media (width < 600px) {
1270
+ @media (width < 768px) {
1268
1271
  font: var(--bi-font-title-bold-xs);
1269
1272
  }
1270
1273
  }
@@ -1283,7 +1286,7 @@
1283
1286
  width: 100%;
1284
1287
  display: block;
1285
1288
 
1286
- @media (width < 600px) {
1289
+ @media (width < 768px) {
1287
1290
  aspect-ratio: 3 / 2;
1288
1291
  }
1289
1292
  }
@@ -1635,6 +1638,12 @@ details.bi-details {
1635
1638
  }
1636
1639
  }
1637
1640
 
1641
+ & .bi-dialog--close {
1642
+ &.bi-button[data-variant="text"] {
1643
+ --bic-button-color: var(--bi-color-text-secondary);
1644
+ }
1645
+ }
1646
+
1638
1647
  & > button.bi-dialog--close {
1639
1648
  top: var(--bic-dialog-icon-spacing);
1640
1649
  right: var(--bic-dialog-icon-spacing);
@@ -2470,7 +2479,7 @@ body:has(.bi-dialog:modal) {
2470
2479
  min-height: 58px;
2471
2480
  display: flex;
2472
2481
 
2473
- @media (width < 600px) {
2482
+ @media (width < 768px) {
2474
2483
  gap: var(--bi-scale-2x) var(--bi-scale-1x);
2475
2484
  }
2476
2485
 
@@ -2505,7 +2514,7 @@ body:has(.bi-dialog:modal) {
2505
2514
  flex-wrap: wrap;
2506
2515
  display: flex;
2507
2516
 
2508
- @media (width < 600px) {
2517
+ @media (width < 768px) {
2509
2518
  gap: var(--bi-scale-2x);
2510
2519
  }
2511
2520
  }
@@ -2700,7 +2709,7 @@ svg {
2700
2709
  --bic-logo-height: var(--bi-scale-48x);
2701
2710
  }
2702
2711
 
2703
- @media (width >= 795px) {
2712
+ @media (width >= 768px) {
2704
2713
  &[data-international="true"] {
2705
2714
  &[data-vertical="true"] {
2706
2715
  background-image: var(--bic-logo-international-vertical);
@@ -3071,7 +3080,7 @@ svg {
3071
3080
  color: var(--bic-tabs-tab-color-selected);
3072
3081
 
3073
3082
  &:after {
3074
- width: calc(100% - var(--bi-scale-6x));
3083
+ width: 100%;
3075
3084
  }
3076
3085
  }
3077
3086
  }
@@ -3200,6 +3209,10 @@ html {
3200
3209
  }
3201
3210
 
3202
3211
  &:has(.bi-navbar[data-fixed="true"]) {
3212
+ & .bi-sub-navbar[data-fixed="true"]:not([data-scroll-dir]) {
3213
+ top: var(--bi-layout-navbar-height);
3214
+ }
3215
+
3203
3216
  &:has(.bi-sub-navbar[data-fixed="true"][data-scroll-dir="up"]) {
3204
3217
  & .bi-navbar > header {
3205
3218
  transform: translateY(0);
package/dist/tokens.css CHANGED
@@ -153,15 +153,15 @@
153
153
  --bi-scale-84x: 21rem;
154
154
  --bi-scale-128x: 32rem;
155
155
  --bi-scale-max: 624.938rem;
156
+ --bi-color-stroke-basic-subtle: #0000001a;
157
+ --bi-color-stroke-basic: #0003;
158
+ --bi-color-stroke-basic-strong: #0000004d;
159
+ --bi-color-stroke-basic-contrast: #00000080;
156
160
  --bi-color-primary-text-secondary: #042f5bb3;
157
161
  --bi-color-info-text-secondary: #2e0b61b3;
158
162
  --bi-color-warning-text-secondary: #4a3c01b3;
159
163
  --bi-color-success-text-secondary: #143a16b3;
160
164
  --bi-color-alert-text-secondary: #6a1b16b3;
161
- --bi-color-stroke-basic-subtle: #0000001a;
162
- --bi-color-stroke-basic: #0003;
163
- --bi-color-stroke-basic-strong: #0000004d;
164
- --bi-color-stroke-basic-contrast: #00000080;
165
165
  --bi-states-hover: #26333f1a;
166
166
  --bi-states-press: #26333f26;
167
167
  --bi-states-hover-dark: #26333f1a;
@@ -476,6 +476,10 @@
476
476
  }
477
477
 
478
478
  [data-color-scheme="dark"] {
479
+ --bi-color-stroke-basic-subtle: #ffffff1a;
480
+ --bi-color-stroke-basic: #fff3;
481
+ --bi-color-stroke-basic-strong: #ffffff4d;
482
+ --bi-color-stroke-basic-contrast: #fff6;
479
483
  --bi-color-neutral-background: var(--bi-neutral-100);
480
484
  --bi-color-neutral-surface-subtle: var(--bi-neutral-95);
481
485
  --bi-color-neutral-surface: var(--bi-neutral-90);
@@ -508,8 +512,8 @@
508
512
  --bi-color-primary-text-secondary: #ffffffb2;
509
513
  --bi-color-primary-text-subtle: var(--bi-primary-10);
510
514
  --bi-color-primary-text-accent: var(--bi-primary-30);
511
- --bi-color-primary-contrast: var(--bi-primary-20);
512
- --bi-color-primary-contrast-hover: var(--bi-primary-30);
515
+ --bi-color-primary-contrast: var(--bi-primary-30);
516
+ --bi-color-primary-contrast-hover: var(--bi-primary-20);
513
517
  --bi-color-primary-fill: var(--bi-primary-50);
514
518
  --bi-color-primary-on-fill: var(--bi-basic-white);
515
519
  --bi-color-info-background: var(--bi-info-100);
@@ -584,10 +588,6 @@
584
588
  --bi-color-alert-contrast-hover: var(--bi-alert-15);
585
589
  --bi-color-alert-fill: var(--bi-alert-60);
586
590
  --bi-color-alert-on-fill: var(--bi-basic-white);
587
- --bi-color-stroke-basic-subtle: #ffffff1a;
588
- --bi-color-stroke-basic: #fff3;
589
- --bi-color-stroke-basic-strong: #ffffff4d;
590
- --bi-color-stroke-basic-contrast: #fff6;
591
591
  --bi-states-hover: #ffffff1a;
592
592
  --bi-states-press: #ffffff26;
593
593
  --bi-states-focus: var(--bi-primary-30);
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bi-digital/css",
3
3
  "type": "module",
4
- "version": "0.12.0",
4
+ "version": "0.12.2",
5
5
  "description": "CSS for the BI Design System",
6
6
  "author": "BI Digital",
7
7
  "homepage": "https://designsystem.bi.no/",
@@ -30,7 +30,7 @@
30
30
  "browserslist": "^4.28.1",
31
31
  "lightningcss": "^1.32.0",
32
32
  "modern-normalize": "^3.0.1",
33
- "@bi-digital/tokens": "0.12.0"
33
+ "@bi-digital/tokens": "0.12.2"
34
34
  },
35
35
  "scripts": {
36
36
  "build": "node config.js",