@utrecht/component-library-css 1.0.0-alpha.361 → 1.0.0-alpha.362

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 +59 -0
  2. package/package.json +2 -2
package/dist/index.css CHANGED
@@ -174,6 +174,25 @@ so do not apply these styles to an HTML `<dialog>` element without `open` attrib
174
174
  --_utrecht-alert-color: var(--utrecht-alert-warning-color);
175
175
  }
176
176
 
177
+ /**
178
+ * @license EUPL-1.2
179
+ * Copyright (c) 2020-2022 Gemeente Utrecht
180
+ * Copyright (c) 2020-2022 Frameless B.V.
181
+ */
182
+ /**
183
+ * @license EUPL-1.2
184
+ * Copyright (c) 2020-2022 Gemeente Utrecht
185
+ * Copyright (c) 2020-2022 Frameless B.V.
186
+ */
187
+ /* stylelint-disable-next-line block-no-empty */
188
+ .utrecht-alternate-lang-nav__heading {
189
+ /*
190
+ - Hide the heading from Headings navigation
191
+ - use `aria-labelledby` for a `navigation` or `region` landmark instead
192
+ */
193
+ display: none;
194
+ }
195
+
177
196
  /**
178
197
  * @license EUPL-1.2
179
198
  * Copyright (c) 2020-2022 Gemeente Utrecht
@@ -771,6 +790,18 @@ ol.utrecht-breadcrumb__list {
771
790
  cursor: var(--utrecht-action-busy-cursor);
772
791
  }
773
792
 
793
+ .utrecht-button--pressed {
794
+ /* Copy `active` styles for now.
795
+ Later we can decide to:
796
+ - merge `active` and `pressed` and name the state `pressed`, or:
797
+ - merge `active` and `pressed` and name the state `active`, or:
798
+ - add `pressed` design tokens
799
+ */
800
+ background-color: var(--_utrecht-button-active-background-color);
801
+ border-color: var(--_utrecht-button-active-border-color);
802
+ color: var(--_utrecht-button-active-color);
803
+ }
804
+
774
805
  .utrecht-button:disabled,
775
806
  .utrecht-button--disabled {
776
807
  background-color: var(--_utrecht-button-disabled-background-color);
@@ -1491,6 +1522,12 @@ ol.utrecht-breadcrumb__list {
1491
1522
  text-decoration: none;
1492
1523
  }
1493
1524
 
1525
+ .utrecht-button-link--active {
1526
+ background-color: var(--_utrecht-button-active-background-color);
1527
+ border-color: var(--_utrecht-button-active-border-color);
1528
+ color: var(--_utrecht-button-active-color);
1529
+ }
1530
+
1494
1531
  .utrecht-button-link--hover {
1495
1532
  background-color: var(--_utrecht-button-hover-background-color);
1496
1533
  border-color: var(--_utrecht-button-hover-border-color);
@@ -1520,6 +1557,11 @@ ol.utrecht-breadcrumb__list {
1520
1557
  cursor: var(--utrecht-action-disabled-cursor);
1521
1558
  }
1522
1559
 
1560
+ .utrecht-button-link--html-a:active {
1561
+ background-color: var(--_utrecht-button-active-background-color);
1562
+ border-color: var(--_utrecht-button-active-border-color);
1563
+ color: var(--_utrecht-button-active-color);
1564
+ }
1523
1565
  .utrecht-button-link--html-a:focus {
1524
1566
  background-color: var(--_utrecht-button-focus-background-color);
1525
1567
  border-color: var(--_utrecht-button-focus-border-color);
@@ -2879,6 +2921,12 @@ however browsers don't seem to have implemented great looking supixel tweening y
2879
2921
  color: var(--utrecht-link-active-color, var(--utrecht-link-color));
2880
2922
  }
2881
2923
 
2924
+ .utrecht-link-button--disabled {
2925
+ color: var(--utrecht-link-placeholder-color, var(--utrecht-link-color));
2926
+ cursor: var(--utrecht-action-disabled-cursor);
2927
+ text-decoration: none;
2928
+ }
2929
+
2882
2930
  .utrecht-link-button--focus, .utrecht-link-button--html-button:focus {
2883
2931
  background-color: var(--utrecht-link-focus-background-color, transparent);
2884
2932
  color: var(--utrecht-link-focus-color, var(--utrecht-link-color));
@@ -2906,6 +2954,17 @@ however browsers don't seem to have implemented great looking supixel tweening y
2906
2954
  padding-inline-start: 0;
2907
2955
  }
2908
2956
 
2957
+ .utrecht-link-button--pressed {
2958
+ /* Copy `active` styles for now.
2959
+ Later we can decide to:
2960
+ - merge `active` and `pressed` and name the state `pressed`, or:
2961
+ - merge `active` and `pressed` and name the state `active`, or:
2962
+ - style `pressed` like the link state `current`, or:
2963
+ - add `pressed` design tokens
2964
+ */
2965
+ color: var(--utrecht-link-active-color, var(--utrecht-link-color));
2966
+ }
2967
+
2909
2968
  .utrecht-link-button--html-button {
2910
2969
  background-color: transparent;
2911
2970
  /* reset <button> styling */
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.0.0-alpha.361",
2
+ "version": "1.0.0-alpha.362",
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": "98a3c283b8723c7e007b0975932664f2364dc691"
29
+ "gitHead": "dd8bbb5fb92469aa1f1214b7d6eddb8ceff54ab0"
30
30
  }