@utrecht/component-library-css 1.0.1 → 2.0.0

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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,15 @@
1
1
  # @utrecht/component-library-css
2
2
 
3
+ ## 2.0.0
4
+
5
+ ### Major Changes
6
+
7
+ - af24025682: rename `utrecht-button-group--vertical` mixin and class name to `utrecht-button-group--column`'
8
+
9
+ ### Patch Changes
10
+
11
+ - af24025682: inline button link component no longer automatically stretches to match size of button group
12
+
3
13
  ## 1.0.1
4
14
 
5
15
  ### Patch Changes
package/dist/html.css CHANGED
@@ -677,6 +677,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
677
677
  --utrecht-icon-size: var(--utrecht-button-icon-size, 1em);
678
678
  align-items: center;
679
679
  background-color: var(--_utrecht-button-background-color);
680
+ block-size: fit-content;
680
681
  border-block-end-color: var(--_utrecht-button-border-bottom-color);
681
682
  border-block-end-width: var(--_utrecht-button-border-block-end-width);
682
683
  border-color: var(--_utrecht-button-border-color);
@@ -694,6 +695,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
694
695
  inline-size: var(--utrecht-button-inline-size, auto);
695
696
  justify-content: center;
696
697
  line-height: var(--utrecht-button-line-height);
698
+ max-inline-size: var(--utrecht-button-max-inline-size, fit-content);
697
699
  min-block-size: var(--utrecht-button-min-block-size, 44px);
698
700
  min-inline-size: var(--utrecht-button-min-inline-size, 44px);
699
701
  padding-block-end: var(--utrecht-button-padding-block-end);
package/dist/index.css CHANGED
@@ -1082,6 +1082,7 @@ so do not apply these styles to an HTML `<dialog>` element without `open` attrib
1082
1082
  --utrecht-icon-size: var(--utrecht-button-icon-size, 1em);
1083
1083
  align-items: center;
1084
1084
  background-color: var(--_utrecht-button-background-color);
1085
+ block-size: fit-content;
1085
1086
  border-block-end-color: var(--_utrecht-button-border-bottom-color);
1086
1087
  border-block-end-width: var(--_utrecht-button-border-block-end-width);
1087
1088
  border-color: var(--_utrecht-button-border-color);
@@ -1099,6 +1100,7 @@ so do not apply these styles to an HTML `<dialog>` element without `open` attrib
1099
1100
  inline-size: var(--utrecht-button-inline-size, auto);
1100
1101
  justify-content: center;
1101
1102
  line-height: var(--utrecht-button-line-height);
1103
+ max-inline-size: var(--utrecht-button-max-inline-size, fit-content);
1102
1104
  min-block-size: var(--utrecht-button-min-block-size, 44px);
1103
1105
  min-inline-size: var(--utrecht-button-min-inline-size, 44px);
1104
1106
  padding-block-end: var(--utrecht-button-padding-block-end);
@@ -1546,6 +1548,7 @@ so do not apply these styles to an HTML `<dialog>` element without `open` attrib
1546
1548
  * Copyright (c) 2022 Frameless B.V.
1547
1549
  */
1548
1550
  .utrecht-button-group {
1551
+ align-items: baseline;
1549
1552
  background-color: var(--utrecht-button-group-background-color);
1550
1553
  display: flex;
1551
1554
  flex-wrap: wrap;
@@ -1561,14 +1564,14 @@ so do not apply these styles to an HTML `<dialog>` element without `open` attrib
1561
1564
  --utrecht-space-around: 1;
1562
1565
  }
1563
1566
 
1564
- .utrecht-button-group__link-button--horizontal,
1565
- .utrecht-button-group--horizontal .utrecht-link-button,
1566
- .utrecht-button-group:not(.utrecht-button-group--vertical) .utrecht-link-button {
1567
+ .utrecht-button-group__link-button--row,
1568
+ .utrecht-button-group--row .utrecht-link-button,
1569
+ .utrecht-button-group:not(.utrecht-button-group--column) .utrecht-link-button {
1567
1570
  --utrecht-button-padding-inline-end: 0;
1568
1571
  --utrecht-button-padding-inline-start: 0;
1569
1572
  }
1570
1573
 
1571
- .utrecht-button-group--vertical {
1574
+ .utrecht-button-group--column {
1572
1575
  flex-direction: column;
1573
1576
  gap: var(--utrecht-button-group-block-gap, 1em);
1574
1577
  }
@@ -2054,6 +2057,7 @@ so do not apply these styles to an HTML `<dialog>` element without `open` attrib
2054
2057
  --utrecht-icon-size: var(--utrecht-button-icon-size, 1em);
2055
2058
  align-items: center;
2056
2059
  background-color: var(--_utrecht-button-background-color);
2060
+ block-size: fit-content;
2057
2061
  border-block-end-color: var(--_utrecht-button-border-bottom-color);
2058
2062
  border-block-end-width: var(--_utrecht-button-border-block-end-width);
2059
2063
  border-color: var(--_utrecht-button-border-color);
@@ -2071,6 +2075,7 @@ so do not apply these styles to an HTML `<dialog>` element without `open` attrib
2071
2075
  inline-size: var(--utrecht-button-inline-size, auto);
2072
2076
  justify-content: center;
2073
2077
  line-height: var(--utrecht-button-line-height);
2078
+ max-inline-size: var(--utrecht-button-max-inline-size, fit-content);
2074
2079
  min-block-size: var(--utrecht-button-min-block-size, 44px);
2075
2080
  min-inline-size: var(--utrecht-button-min-inline-size, 44px);
2076
2081
  padding-block-end: var(--utrecht-button-padding-block-end);
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.0.1",
2
+ "version": "2.0.0",
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": "7b2241dec1bc0413d5db6a05b573e8e3aa0a3d80"
29
+ "gitHead": "137bf2bf8430a1fac51e2061e2d5a040254a60b3"
30
30
  }