@utrecht/component-library-css 1.0.0-alpha.350 → 1.0.0-alpha.352

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 (3) hide show
  1. package/dist/html.css +18 -11
  2. package/dist/index.css +26 -16
  3. package/package.json +2 -2
package/dist/html.css CHANGED
@@ -460,11 +460,8 @@ however browsers don't seem to have implemented great looking supixel tweening y
460
460
  )
461
461
  );
462
462
  --_utrecht-button-disabled-color: var(
463
- --utrecht-hint-button-disabled-color,
464
- var(
465
- --utrecht-button-appearance-button-disabled-color,
466
- var(--utrecht-button-disabled-color, var(--utrecht-button-color))
467
- )
463
+ --_utrecht-button-hint-disabled-color,
464
+ var(--_utrecht-button-appearance-disabled-color, var(--utrecht-button-disabled-color, var(--utrecht-button-color)))
468
465
  );
469
466
  --_utrecht-button-focus-background-color: var(
470
467
  --_utrecht-button-hint-focus-background-color,
@@ -590,6 +587,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
590
587
  border-bottom-width: var(--_utrecht-button-border-bottom-width);
591
588
  box-sizing: border-box;
592
589
  color: var(--_utrecht-button-color);
590
+ cursor: var(--utrecht-action-activate-cursor);
593
591
  display: inline-flex;
594
592
  font-family: var(--utrecht-button-font-family, var(--utrecht-document-font-family));
595
593
  font-size: var(--utrecht-button-font-size, var(--utrecht-document-font-family));
@@ -751,7 +749,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
751
749
  page-break-inside: avoid;
752
750
  color: var(--utrecht-heading-1-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
753
751
  font-family: var(--utrecht-heading-1-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
754
- font-size: var(--utrecht-heading-1-font-size);
752
+ font-size: var(--utrecht-heading-1-font-size, revert);
755
753
  font-weight: var(--utrecht-heading-1-font-weight, var(--utrecht-heading-font-weight, bold));
756
754
  letter-spacing: var(--utrecht-heading-1-letter-spacing);
757
755
  line-height: var(--utrecht-heading-1-line-height);
@@ -766,7 +764,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
766
764
  page-break-inside: avoid;
767
765
  color: var(--utrecht-heading-2-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
768
766
  font-family: var(--utrecht-heading-2-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
769
- font-size: var(--utrecht-heading-2-font-size);
767
+ font-size: var(--utrecht-heading-2-font-size, revert);
770
768
  font-weight: var(--utrecht-heading-2-font-weight, var(--utrecht-heading-font-weight, bold));
771
769
  letter-spacing: var(--utrecht-heading-2-letter-spacing);
772
770
  line-height: var(--utrecht-heading-2-line-height);
@@ -781,7 +779,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
781
779
  page-break-inside: avoid;
782
780
  color: var(--utrecht-heading-3-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
783
781
  font-family: var(--utrecht-heading-3-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
784
- font-size: var(--utrecht-heading-3-font-size);
782
+ font-size: var(--utrecht-heading-3-font-size, revert);
785
783
  font-weight: var(--utrecht-heading-3-font-weight, var(--utrecht-heading-font-weight, bold));
786
784
  letter-spacing: var(--utrecht-heading-3-letter-spacing);
787
785
  line-height: var(--utrecht-heading-3-line-height);
@@ -796,7 +794,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
796
794
  page-break-inside: avoid;
797
795
  color: var(--utrecht-heading-4-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
798
796
  font-family: var(--utrecht-heading-4-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
799
- font-size: var(--utrecht-heading-4-font-size);
797
+ font-size: var(--utrecht-heading-4-font-size, revert);
800
798
  font-weight: var(--utrecht-heading-4-font-weight, var(--utrecht-heading-font-weight, bold));
801
799
  letter-spacing: var(--utrecht-heading-4-letter-spacing);
802
800
  line-height: var(--utrecht-heading-4-line-height);
@@ -811,7 +809,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
811
809
  page-break-inside: avoid;
812
810
  color: var(--utrecht-heading-5-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
813
811
  font-family: var(--utrecht-heading-5-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
814
- font-size: var(--utrecht-heading-5-font-size);
812
+ font-size: var(--utrecht-heading-5-font-size, revert);
815
813
  font-weight: var(--utrecht-heading-5-font-weight, var(--utrecht-heading-font-weight, bold));
816
814
  letter-spacing: var(--utrecht-heading-5-letter-spacing);
817
815
  line-height: var(--utrecht-heading-5-line-height);
@@ -826,7 +824,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
826
824
  page-break-inside: avoid;
827
825
  color: var(--utrecht-heading-6-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
828
826
  font-family: var(--utrecht-heading-6-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
829
- font-size: var(--utrecht-heading-6-font-size);
827
+ font-size: var(--utrecht-heading-6-font-size, revert);
830
828
  font-weight: var(--utrecht-heading-6-font-weight, var(--utrecht-heading-font-weight, bold));
831
829
  letter-spacing: var(--utrecht-heading-6-letter-spacing);
832
830
  line-height: var(--utrecht-heading-6-line-height);
@@ -922,6 +920,15 @@ however browsers don't seem to have implemented great looking supixel tweening y
922
920
  .utrecht-html * ~ p {
923
921
  --utrecht-space-around: 1;
924
922
  }
923
+ .utrecht-html p:has(> small:only-child) {
924
+ color: var(--utrecht-paragraph-small-color, var(--utrecht-paragraph-color, var(--utrecht-document-color, inherit)));
925
+ font-size: var(--utrecht-paragraph-small-font-size, var(--utrecht-paragraph-font-size, inherit));
926
+ font-weight: var(--utrecht-paragraph-small-font-weight, var(--utrecht-paragraph-font-weight, inherit));
927
+ line-height: var(--utrecht-paragraph-small-line-height, var(--utrecht-paragraph-line-height, inherit));
928
+ }
929
+ .utrecht-html p > small:only-child {
930
+ font-size: inherit;
931
+ }
925
932
  .utrecht-html input[type=radio i] {
926
933
  /* reset native margin for input[type="radio" i] */
927
934
  margin-block-end: 0;
package/dist/index.css CHANGED
@@ -463,11 +463,8 @@ ol.utrecht-breadcrumb__list {
463
463
  )
464
464
  );
465
465
  --_utrecht-button-disabled-color: var(
466
- --utrecht-hint-button-disabled-color,
467
- var(
468
- --utrecht-button-appearance-button-disabled-color,
469
- var(--utrecht-button-disabled-color, var(--utrecht-button-color))
470
- )
466
+ --_utrecht-button-hint-disabled-color,
467
+ var(--_utrecht-button-appearance-disabled-color, var(--utrecht-button-disabled-color, var(--utrecht-button-color)))
471
468
  );
472
469
  --_utrecht-button-focus-background-color: var(
473
470
  --_utrecht-button-hint-focus-background-color,
@@ -593,6 +590,7 @@ ol.utrecht-breadcrumb__list {
593
590
  border-bottom-width: var(--_utrecht-button-border-bottom-width);
594
591
  box-sizing: border-box;
595
592
  color: var(--_utrecht-button-color);
593
+ cursor: var(--utrecht-action-activate-cursor);
596
594
  display: inline-flex;
597
595
  font-family: var(--utrecht-button-font-family, var(--utrecht-document-font-family));
598
596
  font-size: var(--utrecht-button-font-size, var(--utrecht-document-font-family));
@@ -1189,11 +1187,8 @@ ol.utrecht-breadcrumb__list {
1189
1187
  )
1190
1188
  );
1191
1189
  --_utrecht-button-disabled-color: var(
1192
- --utrecht-hint-button-disabled-color,
1193
- var(
1194
- --utrecht-button-appearance-button-disabled-color,
1195
- var(--utrecht-button-disabled-color, var(--utrecht-button-color))
1196
- )
1190
+ --_utrecht-button-hint-disabled-color,
1191
+ var(--_utrecht-button-appearance-disabled-color, var(--utrecht-button-disabled-color, var(--utrecht-button-color)))
1197
1192
  );
1198
1193
  --_utrecht-button-focus-background-color: var(
1199
1194
  --_utrecht-button-hint-focus-background-color,
@@ -1319,6 +1314,7 @@ ol.utrecht-breadcrumb__list {
1319
1314
  border-bottom-width: var(--_utrecht-button-border-bottom-width);
1320
1315
  box-sizing: border-box;
1321
1316
  color: var(--_utrecht-button-color);
1317
+ cursor: var(--utrecht-action-activate-cursor);
1322
1318
  display: inline-flex;
1323
1319
  font-family: var(--utrecht-button-font-family, var(--utrecht-document-font-family));
1324
1320
  font-size: var(--utrecht-button-font-size, var(--utrecht-document-font-family));
@@ -1536,6 +1532,7 @@ ol.utrecht-breadcrumb__list {
1536
1532
  border-color: var(--utrecht-custom-checkbox-border-color);
1537
1533
  border-style: solid;
1538
1534
  border-width: var(--utrecht-custom-checkbox-border-width);
1535
+ cursor: var(--utrecht-action-activate-cursor);
1539
1536
  height: var(--utrecht-custom-checkbox-size);
1540
1537
  margin-block-start: var(--utrecht-custom-checkbox-margin-block-start);
1541
1538
  -webkit-print-color-adjust: exact;
@@ -1677,6 +1674,7 @@ ol.utrecht-breadcrumb__list {
1677
1674
  border-radius: 50%;
1678
1675
  border-style: solid;
1679
1676
  border-width: var(--utrecht-custom-radio-button-border-width);
1677
+ cursor: var(--utrecht-action-activate-cursor);
1680
1678
  height: var(--utrecht-custom-radio-button-size);
1681
1679
  margin-block-start: var(--utrecht-custom-radio-button-margin-block-start);
1682
1680
  -webkit-print-color-adjust: exact;
@@ -2164,6 +2162,7 @@ ol.utrecht-breadcrumb__list {
2164
2162
  border-style: var(--utrecht-form-toggle-border-style, solid);
2165
2163
  border-width: var(--utrecht-form-toggle-border-width, 1px);
2166
2164
  color: var(--utrecht-form-toggle-color);
2165
+ cursor: var(--utrecht-action-activate-cursor);
2167
2166
  display: flex;
2168
2167
  height: var(--utrecht-form-toggle-height, 2em);
2169
2168
  padding-block-end: var(--utrecht-form-toggle-padding-block-end);
@@ -2278,7 +2277,7 @@ ol.utrecht-breadcrumb__list {
2278
2277
  page-break-inside: avoid;
2279
2278
  color: var(--utrecht-heading-1-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
2280
2279
  font-family: var(--utrecht-heading-1-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
2281
- font-size: var(--utrecht-heading-1-font-size);
2280
+ font-size: var(--utrecht-heading-1-font-size, revert);
2282
2281
  font-weight: var(--utrecht-heading-1-font-weight, var(--utrecht-heading-font-weight, bold));
2283
2282
  letter-spacing: var(--utrecht-heading-1-letter-spacing);
2284
2283
  line-height: var(--utrecht-heading-1-line-height);
@@ -2313,7 +2312,7 @@ ol.utrecht-breadcrumb__list {
2313
2312
  page-break-inside: avoid;
2314
2313
  color: var(--utrecht-heading-2-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
2315
2314
  font-family: var(--utrecht-heading-2-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
2316
- font-size: var(--utrecht-heading-2-font-size);
2315
+ font-size: var(--utrecht-heading-2-font-size, revert);
2317
2316
  font-weight: var(--utrecht-heading-2-font-weight, var(--utrecht-heading-font-weight, bold));
2318
2317
  letter-spacing: var(--utrecht-heading-2-letter-spacing);
2319
2318
  line-height: var(--utrecht-heading-2-line-height);
@@ -2348,7 +2347,7 @@ ol.utrecht-breadcrumb__list {
2348
2347
  page-break-inside: avoid;
2349
2348
  color: var(--utrecht-heading-3-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
2350
2349
  font-family: var(--utrecht-heading-3-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
2351
- font-size: var(--utrecht-heading-3-font-size);
2350
+ font-size: var(--utrecht-heading-3-font-size, revert);
2352
2351
  font-weight: var(--utrecht-heading-3-font-weight, var(--utrecht-heading-font-weight, bold));
2353
2352
  letter-spacing: var(--utrecht-heading-3-letter-spacing);
2354
2353
  line-height: var(--utrecht-heading-3-line-height);
@@ -2383,7 +2382,7 @@ ol.utrecht-breadcrumb__list {
2383
2382
  page-break-inside: avoid;
2384
2383
  color: var(--utrecht-heading-4-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
2385
2384
  font-family: var(--utrecht-heading-4-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
2386
- font-size: var(--utrecht-heading-4-font-size);
2385
+ font-size: var(--utrecht-heading-4-font-size, revert);
2387
2386
  font-weight: var(--utrecht-heading-4-font-weight, var(--utrecht-heading-font-weight, bold));
2388
2387
  letter-spacing: var(--utrecht-heading-4-letter-spacing);
2389
2388
  line-height: var(--utrecht-heading-4-line-height);
@@ -2418,7 +2417,7 @@ ol.utrecht-breadcrumb__list {
2418
2417
  page-break-inside: avoid;
2419
2418
  color: var(--utrecht-heading-5-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
2420
2419
  font-family: var(--utrecht-heading-5-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
2421
- font-size: var(--utrecht-heading-5-font-size);
2420
+ font-size: var(--utrecht-heading-5-font-size, revert);
2422
2421
  font-weight: var(--utrecht-heading-5-font-weight, var(--utrecht-heading-font-weight, bold));
2423
2422
  letter-spacing: var(--utrecht-heading-5-letter-spacing);
2424
2423
  line-height: var(--utrecht-heading-5-line-height);
@@ -2453,7 +2452,7 @@ ol.utrecht-breadcrumb__list {
2453
2452
  page-break-inside: avoid;
2454
2453
  color: var(--utrecht-heading-6-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
2455
2454
  font-family: var(--utrecht-heading-6-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
2456
- font-size: var(--utrecht-heading-6-font-size);
2455
+ font-size: var(--utrecht-heading-6-font-size, revert);
2457
2456
  font-weight: var(--utrecht-heading-6-font-weight, var(--utrecht-heading-font-weight, bold));
2458
2457
  letter-spacing: var(--utrecht-heading-6-letter-spacing);
2459
2458
  line-height: var(--utrecht-heading-6-line-height);
@@ -3741,6 +3740,17 @@ however browsers don't seem to have implemented great looking supixel tweening y
3741
3740
  line-height: var(--utrecht-paragraph-lead-line-height, var(--utrecht-paragraph-line-height, inherit));
3742
3741
  }
3743
3742
 
3743
+ .utrecht-paragraph--small {
3744
+ color: var(--utrecht-paragraph-small-color, var(--utrecht-paragraph-color, var(--utrecht-document-color, inherit)));
3745
+ font-size: var(--utrecht-paragraph-small-font-size, var(--utrecht-paragraph-font-size, inherit));
3746
+ font-weight: var(--utrecht-paragraph-small-font-weight, var(--utrecht-paragraph-font-weight, inherit));
3747
+ line-height: var(--utrecht-paragraph-small-line-height, var(--utrecht-paragraph-line-height, inherit));
3748
+ }
3749
+
3750
+ .utrecht-paragraph__small {
3751
+ font-size: inherit;
3752
+ }
3753
+
3744
3754
  .utrecht-paragraph--distanced {
3745
3755
  --utrecht-space-around: 1;
3746
3756
  }
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.0.0-alpha.350",
2
+ "version": "1.0.0-alpha.352",
3
3
  "author": "Community for NL Design System",
4
4
  "description": "Component library bundle for the Municipality of Utrecht based on the NL Design System architecture",
5
5
  "license": "EUPL-1.2",
@@ -26,5 +26,5 @@
26
26
  "clean": "rimraf dist/"
27
27
  },
28
28
  "main": "dist/index.css",
29
- "gitHead": "33315bc9f4e047218cf39d83c13ca10152e5cab5"
29
+ "gitHead": "30280922b6cc8681994c148742dc7968bbe93e18"
30
30
  }