@utrecht/component-library-css 1.0.0-alpha.466 → 1.0.0-alpha.468

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 +5 -0
  2. package/dist/index.css +24 -0
  3. package/package.json +2 -2
package/dist/html.css CHANGED
@@ -992,12 +992,15 @@ however browsers don't seem to have implemented great looking supixel tweening y
992
992
  white-space: nowrap;
993
993
  }
994
994
  .utrecht-html ol {
995
+ /* Configure `width` and `text-align` for `--center` */
995
996
  font-family: var(--utrecht-document-font-family, inherit);
996
997
  font-size: var(--utrecht-ordered-list-font-size, var(--utrecht-unordered-list-font-size, var(--utrecht-document-font-size, inherit)));
997
998
  line-height: var(--utrecht-ordered-list-font-size, var(--utrecht-unordered-list-line-height, var(--utrecht-document-line-height, inherit)));
998
999
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-ordered-list-margin-block-end, var(--utrecht-unordered-list-margin-block-end, 0)));
999
1000
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-ordered-list-margin-block-start, var(--utrecht-unordered-list-margin-block-start, 0)));
1000
1001
  padding-inline-start: var(--utrecht-ordered-list-padding-inline-start, var(--utrecht-unordered-list-padding-inline-start, 2ch));
1002
+ text-align: start;
1003
+ width: max-content;
1001
1004
  --utrecht-space-around: 1;
1002
1005
  }
1003
1006
  .utrecht-html ol > li {
@@ -1577,6 +1580,8 @@ however browsers don't seem to have implemented great looking supixel tweening y
1577
1580
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-unordered-list-margin-block-end, var(--utrecht-paragraph-margin-block-end, 0)));
1578
1581
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-unordered-list-margin-block-start, var(--utrecht-paragraph-margin-block-start, 0)));
1579
1582
  padding-inline-start: var(--utrecht-unordered-list-padding-inline-start, 2ch);
1583
+ text-align: start;
1584
+ width: max-content;
1580
1585
  --utrecht-space-around: 1;
1581
1586
  }
1582
1587
  .utrecht-html ul > li {
package/dist/index.css CHANGED
@@ -318,18 +318,27 @@ so do not apply these styles to an HTML `<dialog>` element without `open` attrib
318
318
  * Copyright (c) 2020-2022 Frameless B.V.
319
319
  */
320
320
  .utrecht-badge-counter {
321
+ /* Limit size to `max-content`, so the badge will not be stretched out of proportion inside a flexbox */
321
322
  background-color: var(--utrecht-badge-counter-background-color, var(--utrecht-badge-background-color, hsl(0deg, 0%, 0%)));
322
323
  border-radius: var(--utrecht-badge-counter-border-radius, var(--utrecht-badge-border-radius, 0.5ch));
323
324
  color: var(--utrecht-badge-counter-color, var(--utrecht-badge-color, hsl(0deg, 0%, 100%)));
324
325
  display: inline-block;
325
326
  font-family: var(--utrecht-document-font-family, sans-serif);
327
+ font-size: var(--utrecht-badge-counter-font-size);
326
328
  font-style: var(--utrecht-badge-counter-font-style, normal); /* no inheritance */
327
329
  font-weight: var(--utrecht-badge-counter-font-weight, var(--utrecht-badge-font-weight, bold)); /* no inheritance */
330
+ line-height: 1;
331
+ max-block-size: max-content;
332
+ max-inline-size: max-content;
333
+ min-block-size: var(--utrecht-badge-counter-min-size, 1em);
334
+ min-inline-size: var(--utrecht-badge-counter-min-size, 1em);
328
335
  padding-block-end: var(--utrecht-badge-counter-padding-block, var(--utrecht-badge-padding-block, 0.5ex));
329
336
  padding-block-start: var(--utrecht-badge-counter-padding-block, var(--utrecht-badge-padding-block, 0.5ex));
330
337
  padding-inline-end: var(--utrecht-badge-counter-padding-inline, var(--utrecht-badge-padding-inline, 0.5ch));
331
338
  padding-inline-start: var(--utrecht-badge-counter-padding-inline, var(--utrecht-badge-padding-inline, 0.5ch));
339
+ text-align: center;
332
340
  text-decoration: none; /* no inheritance */
341
+ white-space: nowrap;
333
342
  }
334
343
 
335
344
  /**
@@ -3963,12 +3972,20 @@ however browsers don't seem to have implemented great looking supixel tweening y
3963
3972
  */
3964
3973
  .utrecht-ordered-list,
3965
3974
  .utrecht-ordered-list--html-content ol {
3975
+ /* Configure `width` and `text-align` for `--center` */
3966
3976
  font-family: var(--utrecht-document-font-family, inherit);
3967
3977
  font-size: var(--utrecht-ordered-list-font-size, var(--utrecht-unordered-list-font-size, var(--utrecht-document-font-size, inherit)));
3968
3978
  line-height: var(--utrecht-ordered-list-font-size, var(--utrecht-unordered-list-line-height, var(--utrecht-document-line-height, inherit)));
3969
3979
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-ordered-list-margin-block-end, var(--utrecht-unordered-list-margin-block-end, 0)));
3970
3980
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-ordered-list-margin-block-start, var(--utrecht-unordered-list-margin-block-start, 0)));
3971
3981
  padding-inline-start: var(--utrecht-ordered-list-padding-inline-start, var(--utrecht-unordered-list-padding-inline-start, 2ch));
3982
+ text-align: start;
3983
+ width: max-content;
3984
+ }
3985
+
3986
+ .utrecht-ordered-list--center {
3987
+ margin-inline-end: auto;
3988
+ margin-inline-start: auto;
3972
3989
  }
3973
3990
 
3974
3991
  .utrecht-ordered-list--distanced {
@@ -5228,6 +5245,13 @@ however browsers don't seem to have implemented great looking supixel tweening y
5228
5245
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-unordered-list-margin-block-end, var(--utrecht-paragraph-margin-block-end, 0)));
5229
5246
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-unordered-list-margin-block-start, var(--utrecht-paragraph-margin-block-start, 0)));
5230
5247
  padding-inline-start: var(--utrecht-unordered-list-padding-inline-start, 2ch);
5248
+ text-align: start;
5249
+ width: max-content;
5250
+ }
5251
+
5252
+ .utrecht-unordered-list--center {
5253
+ margin-inline-end: auto;
5254
+ margin-inline-start: auto;
5231
5255
  }
5232
5256
 
5233
5257
  .utrecht-unordered-list--distanced {
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.0.0-alpha.466",
2
+ "version": "1.0.0-alpha.468",
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": "3ba7e6fe6858344645b7ffac37eb32b083575765"
29
+ "gitHead": "ab1198e77704372e93f7caaba6a675aefc3327a8"
30
30
  }