@utrecht/component-library-css 1.0.0-alpha.330 → 1.0.0-alpha.332

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 (2) hide show
  1. package/dist/index.css +84 -195
  2. package/package.json +2 -2
package/dist/index.css CHANGED
@@ -1365,126 +1365,6 @@ ol.utrecht-breadcrumb__list {
1365
1365
  * @license EUPL-1.2
1366
1366
  * Copyright (c) 2021 Robbert Broersma
1367
1367
  */
1368
- /**
1369
- * @license EUPL-1.2
1370
- * Copyright (c) 2021 Gemeente Utrecht
1371
- * Copyright (c) 2021 Robbert Broersma
1372
- */
1373
- /* stylelint-disable-next-line block-no-empty */
1374
- /**
1375
- * @license EUPL-1.2
1376
- * Copyright (c) 2021 Robbert Broersma
1377
- */
1378
- /**
1379
- * @license EUPL-1.2
1380
- * Copyright (c) 2021 Gemeente Utrecht
1381
- * Copyright (c) 2021 Robbert Broersma
1382
- */
1383
- /* stylelint-disable-next-line block-no-empty */
1384
- /* stylelint-disable-next-line block-no-empty */
1385
- .utrecht-checkbox {
1386
- margin-block-end: 0; /* reset native margin for input[type="checkbox"] */
1387
- margin-block-start: 0;
1388
- margin-inline-end: 0;
1389
- margin-inline-start: 0;
1390
- }
1391
-
1392
- /* stylelint-disable-next-line block-no-empty */
1393
- .utrecht-checkbox--disabled {
1394
- cursor: var(--utrecht-action-disabled-cursor);
1395
- }
1396
-
1397
- .utrecht-checkbox--focus-visible {
1398
- box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1399
- outline-color: var(--utrecht-focus-outline-color, transparent);
1400
- outline-offset: var(--utrecht-focus-outline-offset, 0);
1401
- outline-style: var(--utrecht-focus-outline-style, solid);
1402
- outline-width: var(--utrecht-focus-outline-width, 0);
1403
- }
1404
-
1405
- .utrecht-checkbox--html-input:disabled {
1406
- cursor: var(--utrecht-action-disabled-cursor);
1407
- }
1408
- .utrecht-checkbox--html-input:focus {
1409
- box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1410
- outline-color: var(--utrecht-focus-outline-color, transparent);
1411
- outline-offset: var(--utrecht-focus-outline-offset, 0);
1412
- outline-style: var(--utrecht-focus-outline-style, solid);
1413
- outline-width: var(--utrecht-focus-outline-width, 0);
1414
- }
1415
- .utrecht-checkbox--html-input:focus:not(:focus-visible) {
1416
- /* undo focus ring */
1417
- box-shadow: none;
1418
- outline-style: none;
1419
- }
1420
-
1421
- /**
1422
- * @license EUPL-1.2
1423
- * Copyright (c) 2021 Gemeente Utrecht
1424
- * Copyright (c) 2021 Robbert Broersma
1425
- */
1426
- /* stylelint-disable-next-line block-no-empty */
1427
- /**
1428
- * @license EUPL-1.2
1429
- * Copyright (c) 2021 Robbert Broersma
1430
- */
1431
- /**
1432
- * @license EUPL-1.2
1433
- * Copyright (c) 2021 Robbert Broersma
1434
- */
1435
- /**
1436
- * @license EUPL-1.2
1437
- * Copyright (c) 2021 Gemeente Utrecht
1438
- * Copyright (c) 2021 Robbert Broersma
1439
- */
1440
- /* stylelint-disable-next-line block-no-empty */
1441
- /**
1442
- * @license EUPL-1.2
1443
- * Copyright (c) 2021 Robbert Broersma
1444
- */
1445
- /**
1446
- * @license EUPL-1.2
1447
- * Copyright (c) 2021 Gemeente Utrecht
1448
- * Copyright (c) 2021 Robbert Broersma
1449
- */
1450
- /* stylelint-disable-next-line block-no-empty */
1451
- /* stylelint-disable-next-line block-no-empty */
1452
- .utrecht-checkbox {
1453
- margin-block-end: 0; /* reset native margin for input[type="checkbox"] */
1454
- margin-block-start: 0;
1455
- margin-inline-end: 0;
1456
- margin-inline-start: 0;
1457
- }
1458
-
1459
- /* stylelint-disable-next-line block-no-empty */
1460
- .utrecht-checkbox--disabled {
1461
- cursor: var(--utrecht-action-disabled-cursor);
1462
- }
1463
-
1464
- .utrecht-checkbox--focus-visible {
1465
- box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1466
- outline-color: var(--utrecht-focus-outline-color, transparent);
1467
- outline-offset: var(--utrecht-focus-outline-offset, 0);
1468
- outline-style: var(--utrecht-focus-outline-style, solid);
1469
- outline-width: var(--utrecht-focus-outline-width, 0);
1470
- }
1471
-
1472
- .utrecht-checkbox--html-input:disabled {
1473
- cursor: var(--utrecht-action-disabled-cursor);
1474
- }
1475
- .utrecht-checkbox--html-input:focus {
1476
- box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1477
- outline-color: var(--utrecht-focus-outline-color, transparent);
1478
- outline-offset: var(--utrecht-focus-outline-offset, 0);
1479
- outline-style: var(--utrecht-focus-outline-style, solid);
1480
- outline-width: var(--utrecht-focus-outline-width, 0);
1481
- }
1482
- .utrecht-checkbox--html-input:focus:not(:focus-visible) {
1483
- /* undo focus ring */
1484
- box-shadow: none;
1485
- outline-style: none;
1486
- }
1487
-
1488
1368
  /**
1489
1369
  * @license EUPL-1.2
1490
1370
  * Copyright (c) 2021 Gemeente Utrecht
@@ -1492,88 +1372,72 @@ ol.utrecht-breadcrumb__list {
1492
1372
  */
1493
1373
  /* stylelint-disable-next-line block-no-empty */
1494
1374
  .utrecht-custom-checkbox {
1495
- --utrecht-icon-size: var(--utrecht-custom-checkbox-icon-size, calc(0.75 * var(--utrecht-custom-checkbox-size)));
1496
- display: inline-block;
1497
- height: var(--utrecht-custom-checkbox-size);
1498
- position: relative;
1499
- width: var(--utrecht-custom-checkbox-size);
1500
- }
1501
-
1502
- .utrecht-custom-checkbox__input {
1503
- margin-block-end: 0; /* reset native margin for input[type="checkbox"] */
1504
- margin-block-start: 0;
1505
- margin-inline-end: 0;
1506
- margin-inline-start: 0;
1507
- height: var(--utrecht-custom-checkbox-size);
1508
- left: 0;
1509
- opacity: 0%;
1510
- position: absolute;
1511
- top: 0;
1512
- width: var(--utrecht-custom-checkbox-size);
1513
- z-index: 10;
1514
- }
1515
-
1516
- .utrecht-custom-checkbox__box {
1517
- align-items: center;
1518
- background-color: var(--utrecht-custom-checkbox-background-color);
1519
- border-color: var(--utrecht-custom-checkbox-border-color, var(--utrecht-form-input-border-color));
1520
- border-radius: var(--utrecht-custom-checkbox-border-radius, var(--utrecht-form-input-border-radius));
1375
+ -webkit-appearance: none;
1376
+ -moz-appearance: none;
1377
+ appearance: none;
1378
+ background-position: center;
1379
+ background-repeat: no-repeat;
1380
+ background-size: contain;
1381
+ border-color: var(--utrecht-custom-checkbox-border-color);
1521
1382
  border-style: solid;
1522
- border-width: var(--utrecht-custom-checkbox-border-width, var(--utrecht-form-input-border-width));
1523
- box-sizing: border-box;
1524
- color: var(--utrecht-custom-checkbox-color);
1525
- display: flex;
1383
+ border-width: var(--utrecht-custom-checkbox-border-width);
1526
1384
  height: var(--utrecht-custom-checkbox-size);
1527
- justify-content: center;
1528
- left: 0;
1529
- pointer-events: none;
1530
- position: absolute;
1531
- top: 0;
1385
+ margin-block-start: var(--utrecht-custom-checkbox-margin-block-start);
1386
+ -webkit-print-color-adjust: exact;
1387
+ print-color-adjust: exact;
1388
+ vertical-align: top;
1532
1389
  width: var(--utrecht-custom-checkbox-size);
1533
- z-index: 1000;
1534
1390
  }
1535
1391
 
1536
- .utrecht-custom-checkbox__box--checked {
1392
+ .utrecht-custom-checkbox--checked {
1537
1393
  background-color: var(--utrecht-custom-checkbox-checked-background-color, var(--utrecht-custom-checkbox-background-color));
1394
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
1538
1395
  border-color: var(--utrecht-custom-checkbox-checked-border-color, var(--utrecht-custom-checkbox-border-color));
1539
1396
  border-width: var(--utrecht-custom-checkbox-checked-border-width, var(--utrecht-custom-checkbox-border-width));
1540
- color: var(--utrecht-custom-checkbox-checked-color, var(--utrecht-custom-checkbox-color));
1541
1397
  }
1542
1398
 
1543
- .utrecht-custom-checkbox__box--disabled {
1544
- background-color: var(--utrecht-custom-checkbox-disabled-background-color, var(--utrecht-custom-checkbox-background-color));
1399
+ .utrecht-custom-checkbox--disabled {
1545
1400
  border-color: var(--utrecht-custom-checkbox-disabled-border-color, var(--utrecht-custom-checkbox-border-color));
1546
1401
  border-width: var(--utrecht-custom-checkbox-disabled-border-width, var(--utrecht-custom-checkbox-border-width));
1547
- color: var(--utrecht-custom-checkbox-disabled-color, var(--utrecht-custom-checkbox-color));
1548
1402
  cursor: var(--utrecht-action-disabled-cursor);
1549
1403
  }
1404
+ .utrecht-custom-checkbox--disabled:checked {
1405
+ background-color: var(--utrecht-custom-checkbox-disabled-background-color, var(--utrecht-custom-checkbox-background-color));
1406
+ border-color: var(--utrecht-custom-checkbox-disabled-border-color, var(--utrecht-custom-checkbox-border-color));
1407
+ }
1408
+ .utrecht-custom-checkbox--disabled:active {
1409
+ border-color: var(--utrecht-custom-checkbox-disabled-border-color, var(--utrecht-custom-checkbox-border-color));
1410
+ }
1550
1411
 
1551
- .utrecht-custom-checkbox__box--indeterminate {
1412
+ .utrecht-custom-checkbox--indeterminate {
1413
+ background-color: var(--utrecht-custom-checkbox-indeterminate-background-color, var(--utrecht-custom-checkbox-background-color));
1414
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
1415
+ border-color: var(--utrecht-custom-checkbox-indeterminate-border-color, var(--utrecht-custom-checkbox-border-color));
1416
+ border-width: var(--utrecht-custom-checkbox-indeterminate-border-width, var(--utrecht-custom-checkbox-border-width));
1552
1417
  color: var(--utrecht-custom-checkbox-indeterminate-color, var(--utrecht-custom-checkbox-color));
1553
1418
  }
1554
1419
 
1555
- .utrecht-custom-checkbox__box--invalid {
1556
- background-color: var(--utrecht-custom-checkbox-invalid-background-color, var(--utrecht-custom-checkbox-background-color));
1420
+ .utrecht-custom-checkbox--invalid {
1557
1421
  border-color: var(--utrecht-custom-checkbox-invalid-border-color, var(--utrecht-custom-checkbox-border-color));
1558
1422
  border-width: var(--utrecht-custom-checkbox-invalid-border-width, var(--utrecht-custom-checkbox-border-width));
1559
- color: var(--utrecht-custom-checkbox-invalid-color, var(--utrecht-custom-checkbox-color));
1560
1423
  }
1561
1424
 
1562
- .utrecht-custom-checkbox__box--active {
1425
+ .utrecht-custom-checkbox--active {
1563
1426
  background-color: var(--utrecht-custom-checkbox-active-background-color, var(--utrecht-custom-checkbox-background-color));
1427
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
1564
1428
  border-color: var(--utrecht-custom-checkbox-active-border-color, var(--utrecht-custom-checkbox-border-color));
1565
1429
  border-width: var(--utrecht-custom-checkbox-active-border-width, var(--utrecht-custom-checkbox-border-width));
1566
1430
  color: var(--utrecht-custom-checkbox-active-color, var(--utrecht-custom-checkbox-color));
1567
1431
  }
1568
1432
 
1569
- .utrecht-custom-checkbox__box--focus {
1433
+ .utrecht-custom-checkbox--focus {
1570
1434
  background-color: var(--utrecht-custom-checkbox-focus-background-color, var(--utrecht-custom-checkbox-background-color));
1435
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
1571
1436
  border-color: var(--utrecht-custom-checkbox-focus-border-color, var(--utrecht-custom-checkbox-border-color));
1572
1437
  border-width: var(--utrecht-custom-checkbox-focus-border-width, var(--utrecht-custom-checkbox-border-width));
1573
- color: var(--utrecht-custom-checkbox-focus-color, var(--utrecht-custom-checkbox-color));
1574
1438
  }
1575
1439
 
1576
- .utrecht-custom-checkbox__box--focus-visible {
1440
+ .utrecht-custom-checkbox--focus-visible {
1577
1441
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1578
1442
  outline-color: var(--utrecht-focus-outline-color, transparent);
1579
1443
  outline-offset: var(--utrecht-focus-outline-offset, 0);
@@ -1581,39 +1445,54 @@ ol.utrecht-breadcrumb__list {
1581
1445
  outline-width: var(--utrecht-focus-outline-width, 0);
1582
1446
  }
1583
1447
 
1584
- .utrecht-custom-checkbox__input:indeterminate ~ .utrecht-custom-checkbox__box {
1585
- color: var(--utrecht-custom-checkbox-indeterminate-color, var(--utrecht-custom-checkbox-color));
1448
+ .utrecht-custom-checkbox--html-input:disabled {
1449
+ border-color: var(--utrecht-custom-checkbox-disabled-border-color, var(--utrecht-custom-checkbox-border-color));
1450
+ border-width: var(--utrecht-custom-checkbox-disabled-border-width, var(--utrecht-custom-checkbox-border-width));
1451
+ cursor: var(--utrecht-action-disabled-cursor);
1586
1452
  }
1587
-
1588
- .utrecht-custom-checkbox__input:focus ~ .utrecht-custom-checkbox__box {
1453
+ .utrecht-custom-checkbox--html-input:disabled:checked {
1454
+ background-color: var(--utrecht-custom-checkbox-disabled-background-color, var(--utrecht-custom-checkbox-background-color));
1455
+ border-color: var(--utrecht-custom-checkbox-disabled-border-color, var(--utrecht-custom-checkbox-border-color));
1456
+ }
1457
+ .utrecht-custom-checkbox--html-input:disabled:active {
1458
+ border-color: var(--utrecht-custom-checkbox-disabled-border-color, var(--utrecht-custom-checkbox-border-color));
1459
+ }
1460
+ .utrecht-custom-checkbox--html-input:focus {
1589
1461
  background-color: var(--utrecht-custom-checkbox-focus-background-color, var(--utrecht-custom-checkbox-background-color));
1462
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
1590
1463
  border-color: var(--utrecht-custom-checkbox-focus-border-color, var(--utrecht-custom-checkbox-border-color));
1591
1464
  border-width: var(--utrecht-custom-checkbox-focus-border-width, var(--utrecht-custom-checkbox-border-width));
1592
- color: var(--utrecht-custom-checkbox-focus-color, var(--utrecht-custom-checkbox-color));
1465
+ }
1466
+ .utrecht-custom-checkbox--html-input:focus-visible {
1593
1467
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1594
1468
  outline-color: var(--utrecht-focus-outline-color, transparent);
1595
1469
  outline-offset: var(--utrecht-focus-outline-offset, 0);
1596
1470
  outline-style: var(--utrecht-focus-outline-style, solid);
1597
1471
  outline-width: var(--utrecht-focus-outline-width, 0);
1598
1472
  }
1599
-
1600
- .utrecht-custom-checkbox__input:focus:not(:focus-visible) ~ .utrecht-custom-checkbox__box {
1601
- /* undo focus ring */
1602
- box-shadow: none;
1603
- outline-style: none;
1473
+ .utrecht-custom-checkbox--html-input:invalid, .utrecht-custom-checkbox--html-input[aria-invalid=true] {
1474
+ border-color: var(--utrecht-custom-checkbox-invalid-border-color, var(--utrecht-custom-checkbox-border-color));
1475
+ border-width: var(--utrecht-custom-checkbox-invalid-border-width, var(--utrecht-custom-checkbox-border-width));
1604
1476
  }
1605
-
1606
- .utrecht-custom-checkbox__icon--checked,
1607
- .utrecht-custom-checkbox__icon--indeterminate {
1608
- display: none;
1477
+ .utrecht-custom-checkbox--html-input:active {
1478
+ background-color: var(--utrecht-custom-checkbox-active-background-color, var(--utrecht-custom-checkbox-background-color));
1479
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
1480
+ border-color: var(--utrecht-custom-checkbox-active-border-color, var(--utrecht-custom-checkbox-border-color));
1481
+ border-width: var(--utrecht-custom-checkbox-active-border-width, var(--utrecht-custom-checkbox-border-width));
1482
+ color: var(--utrecht-custom-checkbox-active-color, var(--utrecht-custom-checkbox-color));
1609
1483
  }
1610
-
1611
- .utrecht-custom-checkbox__box--checked .utrecht-custom-checkbox__icon--checked {
1612
- display: block;
1484
+ .utrecht-custom-checkbox--html-input:checked {
1485
+ background-color: var(--utrecht-custom-checkbox-checked-background-color, var(--utrecht-custom-checkbox-background-color));
1486
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
1487
+ border-color: var(--utrecht-custom-checkbox-checked-border-color, var(--utrecht-custom-checkbox-border-color));
1488
+ border-width: var(--utrecht-custom-checkbox-checked-border-width, var(--utrecht-custom-checkbox-border-width));
1613
1489
  }
1614
-
1615
- .utrecht-custom-checkbox__box--indeterminate .utrecht-custom-checkbox__icon--indeterminate {
1616
- display: block;
1490
+ .utrecht-custom-checkbox--html-input:indeterminate {
1491
+ background-color: var(--utrecht-custom-checkbox-indeterminate-background-color, var(--utrecht-custom-checkbox-background-color));
1492
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
1493
+ border-color: var(--utrecht-custom-checkbox-indeterminate-border-color, var(--utrecht-custom-checkbox-border-color));
1494
+ border-width: var(--utrecht-custom-checkbox-indeterminate-border-width, var(--utrecht-custom-checkbox-border-width));
1495
+ color: var(--utrecht-custom-checkbox-indeterminate-color, var(--utrecht-custom-checkbox-color));
1617
1496
  }
1618
1497
 
1619
1498
  /**
@@ -1771,7 +1650,6 @@ ol.utrecht-breadcrumb__list {
1771
1650
  color: var(--utrecht-data-list-item-key-color);
1772
1651
  font-size: var(--utrecht-data-list-item-key-font-size);
1773
1652
  font-weight: var(--utrecht-data-list-item-key-font-weight);
1774
- grid-area: label;
1775
1653
  line-height: var(--utrecht-data-list-item-key-line-height);
1776
1654
  }
1777
1655
 
@@ -1780,9 +1658,8 @@ ol.utrecht-breadcrumb__list {
1780
1658
  color: var(--utrecht-data-list-item-value-color);
1781
1659
  font-size: var(--utrecht-data-list-item-value-font-size);
1782
1660
  font-weight: var(--utrecht-data-list-item-value-font-weight);
1783
- grid-area: value;
1784
- line-height: var(--utrecht-data-list-label-line-height);
1785
- min-block-size: var(--utrecht-data-list-label-line-height);
1661
+ line-height: var(--utrecht-data-list-item-value-line-height);
1662
+ min-block-size: calc(var(--utrecht-data-list-item-value-line-height) * 1rem);
1786
1663
  }
1787
1664
 
1788
1665
  .utrecht-data-list__actions--html-dd,
@@ -1796,13 +1673,25 @@ ol.utrecht-breadcrumb__list {
1796
1673
  }
1797
1674
 
1798
1675
  .utrecht-data-list--rows .utrecht-data-list__actions {
1799
- align-items: last baseline;
1676
+ align-items: baseline;
1800
1677
  display: flex;
1678
+ grid-column: -1;
1679
+ grid-row: 1;
1801
1680
  justify-content: flex-end;
1802
1681
  }
1803
1682
  .utrecht-data-list--rows .utrecht-data-list__item {
1683
+ --_utrecht-minmax: max(
1684
+ var(--utrecht-data-list-rows-column-min-inline-size, 25ch),
1685
+ var(--utrecht-data-list-rows-column-inline-size, 80%)
1686
+ );
1687
+ --_utrecht-auto-col: minmax(var(--_utrecht-minmax), max-content);
1688
+ border-bottom-color: var(--utrecht-data-list-rows-border-bottom-color, transparent);
1689
+ border-bottom-style: solid;
1690
+ border-bottom-width: var(--utrecht-data-list-rows-border-bottom-width, 0);
1804
1691
  display: grid;
1805
- grid-template-areas: "label actions" "value value";
1692
+ gap: 0 var(--utrecht-data-list-rows-gap);
1693
+ grid-auto-columns: 1fr;
1694
+ grid-template-columns: repeat(auto-fit, var(--_utrecht-auto-col));
1806
1695
  margin-block-start: var(--utrecht-data-list-rows-item-margin-block-start);
1807
1696
  }
1808
1697
  .utrecht-data-list--rows .utrecht-data-list__item:first-of-type {
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.0.0-alpha.330",
2
+ "version": "1.0.0-alpha.332",
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": "66932a564f0a0763a360f836054cb062052eef1f"
29
+ "gitHead": "f4b233616da6c7fcf43a46a9908f6b56141c3424"
30
30
  }