@utrecht/component-library-css 1.0.0-alpha.347 → 1.0.0-alpha.349

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 -1
  2. package/dist/index.css +28 -9
  3. package/package.json +2 -2
package/dist/html.css CHANGED
@@ -97,6 +97,14 @@
97
97
  * @license EUPL-1.2
98
98
  * Copyright (c) 2021 Robbert Broersma
99
99
  */
100
+ /**
101
+ * @license EUPL-1.2
102
+ * Copyright (c) 2021 Robbert Broersma
103
+ */
104
+ /**
105
+ * @license EUPL-1.2
106
+ * Copyright (c) 2021 Robbert Broersma
107
+ */
100
108
  /**
101
109
  * @license EUPL-1.2
102
110
  * Copyright (c) 2021 Gemeente Utrecht
@@ -585,7 +593,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
585
593
  display: inline-flex;
586
594
  font-family: var(--utrecht-button-font-family, var(--utrecht-document-font-family));
587
595
  font-size: var(--utrecht-button-font-size, var(--utrecht-document-font-family));
588
- font-weight: var(--utrecht-button-font-weight);
596
+ font-weight: var(--_utrecht-button-appearance-font-weight, var(--utrecht-button-font-weight));
589
597
  gap: var(--utrecht-button-icon-gap);
590
598
  inline-size: var(--utrecht-button-inline-size, auto);
591
599
  justify-content: center;
@@ -698,6 +706,15 @@ however browsers don't seem to have implemented great looking supixel tweening y
698
706
  padding-inline-start: 0;
699
707
  --utrecht-space-around: 1;
700
708
  }
709
+ .utrecht-html figure {
710
+ margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-figure-margin-block-end, 0));
711
+ margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-figure-margin-block-start, 0));
712
+ }
713
+ .utrecht-html figcaption {
714
+ color: var(--utrecht-figure-caption-color);
715
+ font-size: var(--utrecht-figure-caption-font-size);
716
+ line-height: var(--utrecht-figure-caption-line-height);
717
+ }
701
718
  .utrecht-html legend {
702
719
  color: var(--utrecht-form-fieldset-legend-color, var(--utrecht-document-color, inherit));
703
720
  font-family: var(--utrecht-form-fieldset-legend-font-family, var(--utrecht-document-font-family));
package/dist/index.css CHANGED
@@ -596,7 +596,7 @@ ol.utrecht-breadcrumb__list {
596
596
  display: inline-flex;
597
597
  font-family: var(--utrecht-button-font-family, var(--utrecht-document-font-family));
598
598
  font-size: var(--utrecht-button-font-size, var(--utrecht-document-font-family));
599
- font-weight: var(--utrecht-button-font-weight);
599
+ font-weight: var(--_utrecht-button-appearance-font-weight, var(--utrecht-button-font-weight));
600
600
  gap: var(--utrecht-button-icon-gap);
601
601
  inline-size: var(--utrecht-button-inline-size, auto);
602
602
  justify-content: center;
@@ -694,6 +694,7 @@ ol.utrecht-breadcrumb__list {
694
694
  --_utrecht-button-appearance-border-color: var(--utrecht-button-primary-action-border-color);
695
695
  --_utrecht-button-appearance-border-width: var(--utrecht-button-primary-action-border-width);
696
696
  --_utrecht-button-appearance-color: var(--utrecht-button-primary-action-color);
697
+ --_utrecht-button-appearance-font-weight: var(--utrecht-button-primary-action-font-weight);
697
698
  --_utrecht-button-appearance-disabled-background-color: var(
698
699
  --utrecht-button-primary-action-disabled-background-color
699
700
  );
@@ -715,6 +716,7 @@ ol.utrecht-breadcrumb__list {
715
716
  --_utrecht-button-appearance-border-color: var(--utrecht-button-secondary-action-border-color);
716
717
  --_utrecht-button-appearance-border-width: var(--utrecht-button-secondary-action-border-width);
717
718
  --_utrecht-button-appearance-color: var(--utrecht-button-secondary-action-color);
719
+ --_utrecht-button-appearance-font-weight: var(--utrecht-button-secondary-action-font-weight);
718
720
  --_utrecht-button-appearance-disabled-background-color: var(
719
721
  --utrecht-button-secondary-action-disabled-background-color
720
722
  );
@@ -736,6 +738,7 @@ ol.utrecht-breadcrumb__list {
736
738
  --_utrecht-button-appearance-border-color: var(--utrecht-button-subtle-border-color);
737
739
  --_utrecht-button-appearance-border-width: var(--utrecht-button-subtle-border-width);
738
740
  --_utrecht-button-appearance-color: var(--utrecht-button-subtle-color);
741
+ --_utrecht-button-appearance-font-weight: var(--utrecht-button-subtle-font-weight);
739
742
  --_utrecht-button-appearance-disabled-background-color: var(
740
743
  --utrecht-button-subtle-disabled-background-color
741
744
  );
@@ -1319,7 +1322,7 @@ ol.utrecht-breadcrumb__list {
1319
1322
  display: inline-flex;
1320
1323
  font-family: var(--utrecht-button-font-family, var(--utrecht-document-font-family));
1321
1324
  font-size: var(--utrecht-button-font-size, var(--utrecht-document-font-family));
1322
- font-weight: var(--utrecht-button-font-weight);
1325
+ font-weight: var(--_utrecht-button-appearance-font-weight, var(--utrecht-button-font-weight));
1323
1326
  gap: var(--utrecht-button-icon-gap);
1324
1327
  inline-size: var(--utrecht-button-inline-size, auto);
1325
1328
  justify-content: center;
@@ -1359,12 +1362,13 @@ ol.utrecht-breadcrumb__list {
1359
1362
  outline-width: var(--utrecht-focus-outline-width, 0);
1360
1363
  }
1361
1364
 
1362
- .utrecht-button-link--html-a:hover {
1363
- background-color: var(--_utrecht-button-hover-background-color);
1364
- border-color: var(--_utrecht-button-hover-border-color);
1365
- color: var(--_utrecht-button-hover-color);
1366
- transform: scale(var(--utrecht-button-focus-transform-scale, 1));
1365
+ .utrecht-button-link--placeholder {
1366
+ background-color: var(--_utrecht-button-disabled-background-color);
1367
+ border-color: var(--_utrecht-button-disabled-border-color);
1368
+ color: var(--_utrecht-button-disabled-color);
1369
+ cursor: var(--utrecht-action-disabled-cursor);
1367
1370
  }
1371
+
1368
1372
  .utrecht-button-link--html-a:focus {
1369
1373
  background-color: var(--_utrecht-button-focus-background-color);
1370
1374
  border-color: var(--_utrecht-button-focus-border-color);
@@ -1378,6 +1382,12 @@ ol.utrecht-breadcrumb__list {
1378
1382
  outline-style: var(--utrecht-focus-outline-style, solid);
1379
1383
  outline-width: var(--utrecht-focus-outline-width, 0);
1380
1384
  }
1385
+ .utrecht-button-link--html-a:link:hover {
1386
+ background-color: var(--_utrecht-button-hover-background-color);
1387
+ border-color: var(--_utrecht-button-hover-border-color);
1388
+ color: var(--_utrecht-button-hover-color);
1389
+ transform: scale(var(--utrecht-button-focus-transform-scale, 1));
1390
+ }
1381
1391
 
1382
1392
  .utrecht-button-link--primary-action {
1383
1393
  --_utrecht-button-appearance-active-background-color: var(--utrecht-button-primary-action-active-background-color);
@@ -1387,6 +1397,7 @@ ol.utrecht-breadcrumb__list {
1387
1397
  --_utrecht-button-appearance-border-color: var(--utrecht-button-primary-action-border-color);
1388
1398
  --_utrecht-button-appearance-border-width: var(--utrecht-button-primary-action-border-width);
1389
1399
  --_utrecht-button-appearance-color: var(--utrecht-button-primary-action-color);
1400
+ --_utrecht-button-appearance-font-weight: var(--utrecht-button-primary-action-font-weight);
1390
1401
  --_utrecht-button-appearance-disabled-background-color: var(
1391
1402
  --utrecht-button-primary-action-disabled-background-color
1392
1403
  );
@@ -1408,6 +1419,7 @@ ol.utrecht-breadcrumb__list {
1408
1419
  --_utrecht-button-appearance-border-color: var(--utrecht-button-secondary-action-border-color);
1409
1420
  --_utrecht-button-appearance-border-width: var(--utrecht-button-secondary-action-border-width);
1410
1421
  --_utrecht-button-appearance-color: var(--utrecht-button-secondary-action-color);
1422
+ --_utrecht-button-appearance-font-weight: var(--utrecht-button-secondary-action-font-weight);
1411
1423
  --_utrecht-button-appearance-disabled-background-color: var(
1412
1424
  --utrecht-button-secondary-action-disabled-background-color
1413
1425
  );
@@ -1429,6 +1441,7 @@ ol.utrecht-breadcrumb__list {
1429
1441
  --_utrecht-button-appearance-border-color: var(--utrecht-button-subtle-border-color);
1430
1442
  --_utrecht-button-appearance-border-width: var(--utrecht-button-subtle-border-width);
1431
1443
  --_utrecht-button-appearance-color: var(--utrecht-button-subtle-color);
1444
+ --_utrecht-button-appearance-font-weight: var(--utrecht-button-subtle-font-weight);
1432
1445
  --_utrecht-button-appearance-disabled-background-color: var(
1433
1446
  --utrecht-button-subtle-disabled-background-color
1434
1447
  );
@@ -2914,7 +2927,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
2914
2927
  color: var(--utrecht-link-visited-color, var(--utrecht-link-color));
2915
2928
  }
2916
2929
 
2917
- .utrecht-link:hover,
2930
+ .utrecht-link:link:hover,
2918
2931
  .utrecht-link--hover {
2919
2932
  color: var(--utrecht-link-hover-color, var(--utrecht-link-color));
2920
2933
  text-decoration: var(--utrecht-link-hover-text-decoration, var(--utrecht-link-text-decoration, underline));
@@ -2923,7 +2936,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
2923
2936
  text-decoration-thickness: max(var(--utrecht-link-hover-text-decoration-thickness, var(--utrecht-link-text-decoration-thickness)), 1px);
2924
2937
  }
2925
2938
 
2926
- .utrecht-link:active,
2939
+ .utrecht-link:link:active,
2927
2940
  .utrecht-link--active {
2928
2941
  color: var(--utrecht-link-active-color, var(--utrecht-link-color));
2929
2942
  }
@@ -2978,6 +2991,12 @@ however browsers don't seem to have implemented great looking supixel tweening y
2978
2991
  text-underline-offset: unset;
2979
2992
  }
2980
2993
 
2994
+ .utrecht-link--placeholder {
2995
+ color: var(--utrecht-link-placeholder-color, var(--utrecht-link-color));
2996
+ cursor: var(--utrecht-action-disabled-cursor);
2997
+ text-decoration: none;
2998
+ }
2999
+
2981
3000
  /**
2982
3001
  * @license EUPL-1.2
2983
3002
  * Copyright (c) 2021 Robbert Broersma
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.0.0-alpha.347",
2
+ "version": "1.0.0-alpha.349",
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": "e625263b2a8b3af26ebd38c843a1073af769c943"
29
+ "gitHead": "74bda3f0e7fcaf2dc4fd79da7a4494ccb06f060f"
30
30
  }