@utrecht/component-library-css 1.0.0-alpha.311 → 1.0.0-alpha.314

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 +14 -1
  2. package/dist/index.css +31 -14
  3. package/package.json +3 -3
package/dist/html.css CHANGED
@@ -253,6 +253,11 @@
253
253
  /* stylelint-disable-next-line block-no-empty */
254
254
  /* stylelint-disable-next-line block-no-empty */
255
255
  /* stylelint-disable-next-line block-no-empty */
256
+ /**
257
+ * Link for elements such as `<img>` or `<article>`, that are not inline elements or plain text.
258
+ *
259
+ * Changing `display: inline` to `inline-block` ensures the focus outline is rendered around the entire box.
260
+ */
256
261
  /**
257
262
  * @license EUPL-1.2
258
263
  * Copyright (c) 2021 Robbert Broersma
@@ -320,7 +325,6 @@
320
325
  * Copyright (c) 2021 Robbert Broersma
321
326
  */
322
327
  /* stylelint-disable-next-line block-no-empty */
323
- /* stylelint-disable-next-line block-no-empty */
324
328
  /* stylelint-disable selector-class-pattern */
325
329
  /**
326
330
  * @license EUPL-1.2
@@ -584,6 +588,7 @@
584
588
  line-height: var(--utrecht-heading-1-line-height);
585
589
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-1-margin-block-end, 0));
586
590
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-1-margin-block-start, 0));
591
+ page-break-after: avoid;
587
592
  text-transform: var(--utrecht-heading-1-text-transform, inherit);
588
593
  --utrecht-space-around: 1;
589
594
  }
@@ -598,6 +603,7 @@
598
603
  line-height: var(--utrecht-heading-2-line-height);
599
604
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-2-margin-block-end, 0));
600
605
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-2-margin-block-start, 0));
606
+ page-break-after: avoid;
601
607
  text-transform: var(--utrecht-heading-2-text-transform, inherit);
602
608
  --utrecht-space-around: 1;
603
609
  }
@@ -612,6 +618,7 @@
612
618
  line-height: var(--utrecht-heading-3-line-height);
613
619
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-3-margin-block-end, 0));
614
620
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-3-margin-block-start, 0));
621
+ page-break-after: avoid;
615
622
  text-transform: var(--utrecht-heading-3-text-transform, inherit);
616
623
  --utrecht-space-around: 1;
617
624
  }
@@ -626,6 +633,7 @@
626
633
  line-height: var(--utrecht-heading-4-line-height);
627
634
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-4-margin-block-end, 0));
628
635
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-4-margin-block-start, 0));
636
+ page-break-after: avoid;
629
637
  text-transform: var(--utrecht-heading-4-text-transform, inherit);
630
638
  --utrecht-space-around: 1;
631
639
  }
@@ -640,6 +648,7 @@
640
648
  line-height: var(--utrecht-heading-5-line-height);
641
649
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-5-margin-block-end, 0));
642
650
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-5-margin-block-start, 0));
651
+ page-break-after: avoid;
643
652
  text-transform: var(--utrecht-heading-5-text-transform, inherit);
644
653
  --utrecht-space-around: 1;
645
654
  }
@@ -654,10 +663,12 @@
654
663
  line-height: var(--utrecht-heading-6-line-height);
655
664
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-6-margin-block-end, 0));
656
665
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-6-margin-block-start, 0));
666
+ page-break-after: avoid;
657
667
  text-transform: var(--utrecht-heading-6-text-transform, inherit);
658
668
  --utrecht-space-around: 1;
659
669
  }
660
670
  .utrecht-html a:link {
671
+ --utrecht-icon-size: var(--utrecht-link-icon-size, 1em);
661
672
  color: var(--utrecht-link-color, blue);
662
673
  text-decoration: var(--utrecht-link-text-decoration, underline);
663
674
  text-decoration-skip-ink: all;
@@ -833,12 +844,14 @@
833
844
  font-weight: var(--utrecht-table-caption-font-weight);
834
845
  line-height: var(--utrecht-table-caption-line-height);
835
846
  margin-block-end: var(--utrecht-table-caption-margin-block-end);
847
+ page-break-after: avoid;
836
848
  text-align: var(--utrecht-table-caption-text-align, center);
837
849
  }
838
850
  .utrecht-html thead {
839
851
  background-color: var(--utrecht-table-header-background-color);
840
852
  color: var(--utrecht-table-header-color);
841
853
  font-weight: var(--utrecht-table-header-font-weight);
854
+ page-break-inside: avoid;
842
855
  text-transform: var(--utrecht-table-header-text-transform);
843
856
  vertical-align: bottom;
844
857
  }
package/dist/index.css CHANGED
@@ -1299,7 +1299,6 @@ ol.utrecht-breadcrumb__list {
1299
1299
  * Copyright (c) 2021-2022 Gemeente Utrecht
1300
1300
  * Copyright (c) 2021-2022 Frameless B.V.
1301
1301
  */
1302
- /* stylelint-disable-next-line block-no-empty */
1303
1302
  .utrecht-data-list {
1304
1303
  /* also set `margin-block` to reset browser styling of <dl> */
1305
1304
  display: block;
@@ -1365,14 +1364,6 @@ ol.utrecht-breadcrumb__list {
1365
1364
  gap: var(--utrecht-space-inline-sm);
1366
1365
  }
1367
1366
 
1368
- .utrecht-digid-button__logo {
1369
- order: 1;
1370
- }
1371
-
1372
- .utrecht-digid-button__button {
1373
- order: 2;
1374
- }
1375
-
1376
1367
  /**
1377
1368
  * @license EUPL-1.2
1378
1369
  * Copyright (c) 2021 Robbert Broersma
@@ -1458,6 +1449,7 @@ ol.utrecht-breadcrumb__list {
1458
1449
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-form-field-margin-block-end, 0));
1459
1450
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-form-field-margin-block-start, 0));
1460
1451
  max-inline-size: var(--utrecht-form-field-max-inline-size);
1452
+ page-break-inside: avoid;
1461
1453
  }
1462
1454
 
1463
1455
  .utrecht-form-field--distanced {
@@ -1561,6 +1553,7 @@ ol.utrecht-breadcrumb__list {
1561
1553
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-form-field-margin-block-end, 0));
1562
1554
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-form-field-margin-block-start, 0));
1563
1555
  max-inline-size: var(--utrecht-form-field-max-inline-size);
1556
+ page-break-inside: avoid;
1564
1557
  }
1565
1558
 
1566
1559
  .utrecht-form-field--distanced {
@@ -1781,6 +1774,7 @@ ol.utrecht-breadcrumb__list {
1781
1774
  line-height: var(--utrecht-heading-1-line-height);
1782
1775
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-1-margin-block-end, 0));
1783
1776
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-1-margin-block-start, 0));
1777
+ page-break-after: avoid;
1784
1778
  text-transform: var(--utrecht-heading-1-text-transform, inherit);
1785
1779
  }
1786
1780
 
@@ -1815,6 +1809,7 @@ ol.utrecht-breadcrumb__list {
1815
1809
  line-height: var(--utrecht-heading-2-line-height);
1816
1810
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-2-margin-block-end, 0));
1817
1811
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-2-margin-block-start, 0));
1812
+ page-break-after: avoid;
1818
1813
  text-transform: var(--utrecht-heading-2-text-transform, inherit);
1819
1814
  }
1820
1815
 
@@ -1849,6 +1844,7 @@ ol.utrecht-breadcrumb__list {
1849
1844
  line-height: var(--utrecht-heading-3-line-height);
1850
1845
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-3-margin-block-end, 0));
1851
1846
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-3-margin-block-start, 0));
1847
+ page-break-after: avoid;
1852
1848
  text-transform: var(--utrecht-heading-3-text-transform, inherit);
1853
1849
  }
1854
1850
 
@@ -1883,6 +1879,7 @@ ol.utrecht-breadcrumb__list {
1883
1879
  line-height: var(--utrecht-heading-4-line-height);
1884
1880
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-4-margin-block-end, 0));
1885
1881
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-4-margin-block-start, 0));
1882
+ page-break-after: avoid;
1886
1883
  text-transform: var(--utrecht-heading-4-text-transform, inherit);
1887
1884
  }
1888
1885
 
@@ -1917,6 +1914,7 @@ ol.utrecht-breadcrumb__list {
1917
1914
  line-height: var(--utrecht-heading-5-line-height);
1918
1915
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-5-margin-block-end, 0));
1919
1916
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-5-margin-block-start, 0));
1917
+ page-break-after: avoid;
1920
1918
  text-transform: var(--utrecht-heading-5-text-transform, inherit);
1921
1919
  }
1922
1920
 
@@ -1951,6 +1949,7 @@ ol.utrecht-breadcrumb__list {
1951
1949
  line-height: var(--utrecht-heading-6-line-height);
1952
1950
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-6-margin-block-end, 0));
1953
1951
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-heading-6-margin-block-start, 0));
1952
+ page-break-after: avoid;
1954
1953
  text-transform: var(--utrecht-heading-6-text-transform, inherit);
1955
1954
  }
1956
1955
 
@@ -2141,6 +2140,11 @@ however browsers don't seem to have implemented great looking supixel tweening y
2141
2140
  /* stylelint-disable-next-line block-no-empty */
2142
2141
  /* stylelint-disable-next-line block-no-empty */
2143
2142
  /* stylelint-disable-next-line block-no-empty */
2143
+ /**
2144
+ * Link for elements such as `<img>` or `<article>`, that are not inline elements or plain text.
2145
+ *
2146
+ * Changing `display: inline` to `inline-block` ensures the focus outline is rendered around the entire box.
2147
+ */
2144
2148
  /**
2145
2149
  * @license EUPL-1.2
2146
2150
  * Copyright (c) 2021 Gemeente Utrecht
@@ -2148,6 +2152,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
2148
2152
  */
2149
2153
  /* stylelint-disable-next-line block-no-empty */
2150
2154
  .utrecht-link-button {
2155
+ --utrecht-icon-size: var(--utrecht-link-icon-size, 1em);
2151
2156
  color: var(--utrecht-link-color, blue);
2152
2157
  text-decoration: var(--utrecht-link-text-decoration, underline);
2153
2158
  text-decoration-skip-ink: all;
@@ -2326,7 +2331,13 @@ however browsers don't seem to have implemented great looking supixel tweening y
2326
2331
  /* stylelint-disable-next-line block-no-empty */
2327
2332
  /* stylelint-disable-next-line block-no-empty */
2328
2333
  /* stylelint-disable-next-line block-no-empty */
2334
+ /**
2335
+ * Link for elements such as `<img>` or `<article>`, that are not inline elements or plain text.
2336
+ *
2337
+ * Changing `display: inline` to `inline-block` ensures the focus outline is rendered around the entire box.
2338
+ */
2329
2339
  .utrecht-link {
2340
+ --utrecht-icon-size: var(--utrecht-link-icon-size, 1em);
2330
2341
  color: var(--utrecht-link-color, blue);
2331
2342
  text-decoration: var(--utrecht-link-text-decoration, underline);
2332
2343
  text-decoration-skip-ink: all;
@@ -2400,14 +2411,19 @@ however browsers don't seem to have implemented great looking supixel tweening y
2400
2411
  outline-style: none;
2401
2412
  }
2402
2413
 
2403
- /* stylelint-disable-next-line block-no-empty */
2404
- /* stylelint-disable-next-line block-no-empty */
2405
2414
  .utrecht-link--telephone {
2406
2415
  white-space: nowrap;
2407
2416
  }
2408
2417
 
2409
- /* stylelint-disable-next-line block-no-empty */
2410
- /* stylelint-disable-next-line block-no-empty */
2418
+ .utrecht-link--box-content {
2419
+ color: unset;
2420
+ display: inline-block;
2421
+ text-decoration: unset;
2422
+ text-decoration-skip-ink: unset;
2423
+ text-decoration-thickness: unset;
2424
+ text-underline-offset: unset;
2425
+ }
2426
+
2411
2427
  /**
2412
2428
  * @license EUPL-1.2
2413
2429
  * Copyright (c) 2021 Robbert Broersma
@@ -3415,7 +3431,6 @@ however browsers don't seem to have implemented great looking supixel tweening y
3415
3431
  * Copyright (c) 2021 Robbert Broersma
3416
3432
  */
3417
3433
  /* stylelint-disable-next-line block-no-empty */
3418
- /* stylelint-disable-next-line block-no-empty */
3419
3434
  .utrecht-table {
3420
3435
  border-collapse: collapse;
3421
3436
  border-color: var(--utrecht-table-border-color, 0);
@@ -3439,6 +3454,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
3439
3454
  font-weight: var(--utrecht-table-caption-font-weight);
3440
3455
  line-height: var(--utrecht-table-caption-line-height);
3441
3456
  margin-block-end: var(--utrecht-table-caption-margin-block-end);
3457
+ page-break-after: avoid;
3442
3458
  text-align: var(--utrecht-table-caption-text-align, center);
3443
3459
  }
3444
3460
 
@@ -3446,6 +3462,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
3446
3462
  background-color: var(--utrecht-table-header-background-color);
3447
3463
  color: var(--utrecht-table-header-color);
3448
3464
  font-weight: var(--utrecht-table-header-font-weight);
3465
+ page-break-inside: avoid;
3449
3466
  text-transform: var(--utrecht-table-header-text-transform);
3450
3467
  vertical-align: bottom;
3451
3468
  }
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.0.0-alpha.311",
2
+ "version": "1.0.0-alpha.314",
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",
@@ -16,7 +16,7 @@
16
16
  "url": "git@github.com:nl-design-system/utrecht.git"
17
17
  },
18
18
  "devDependencies": {
19
- "@utrecht/design-tokens": "1.0.0-alpha.304",
19
+ "@utrecht/design-tokens": "1.0.0-alpha.307",
20
20
  "node-sass-package-importer": "5.3.2",
21
21
  "rimraf": "3.0.2",
22
22
  "sass": "1.54.0"
@@ -27,5 +27,5 @@
27
27
  "clean": "rimraf dist/"
28
28
  },
29
29
  "main": "dist/index.css",
30
- "gitHead": "a9108e95be0b4798d04a3256711cbe1b91a5f33c"
30
+ "gitHead": "e40a8bfda3393a7bf1322997d42486e122d6db01"
31
31
  }