@utrecht/component-library-css 1.0.0-alpha.373 → 1.0.0-alpha.375

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/dist/html.css CHANGED
@@ -289,6 +289,15 @@ however browsers don't seem to have implemented great looking supixel tweening y
289
289
  * @license EUPL-1.2
290
290
  * Copyright (c) 2021 Robbert Broersma
291
291
  */
292
+ /**
293
+ * @license EUPL-1.2
294
+ * Copyright (c) 2021 Gemeente Utrecht
295
+ * Copyright (c) 2021 Robbert Broersma
296
+ */
297
+ /**
298
+ * @license EUPL-1.2
299
+ * Copyright (c) 2021 Robbert Broersma
300
+ */
292
301
  /**
293
302
  * @license EUPL-1.2
294
303
  * Copyright (c) 2021 Robbert Broersma
@@ -762,6 +771,23 @@ however browsers don't seem to have implemented great looking supixel tweening y
762
771
  cursor: var(--utrecht-action-activate-cursor, revert);
763
772
  font-weight: var(--utrecht-form-label-radio-font-weight, var(--utrecht-form-label-font-weight));
764
773
  }
774
+ .utrecht-html mark {
775
+ background-color: var(--utrecht-mark-background-color, revert);
776
+ color: var(--utrecht-mark-color, revert);
777
+ }
778
+ @media print {
779
+ .utrecht-html mark {
780
+ outline-color: currentColor;
781
+ outline-style: dotted;
782
+ outline-width: 0.1em;
783
+ }
784
+ }
785
+ @media screen and (-ms-high-contrast: active) {
786
+ .utrecht-html mark {
787
+ background-color: Highlight;
788
+ color: HighlightText;
789
+ }
790
+ }
765
791
  .utrecht-html h1 {
766
792
  page-break-after: avoid;
767
793
  page-break-inside: avoid;
package/dist/index.css CHANGED
@@ -41,6 +41,9 @@
41
41
  */
42
42
  .utrecht-alert {
43
43
  background-color: var(--_utrecht-alert-background-color, var(--utrecht-alert-background-color));
44
+ border-color: var(--_utrecht-alert-border-color, var(--utrecht-alert-border-color));
45
+ border-style: solid;
46
+ border-width: var(--_utrecht-alert-border-width, var(--utrecht-alert-border-width, 0));
44
47
  color: var(--_utrecht-alert-color, var(--utrecht-alert-color));
45
48
  display: grid;
46
49
  gap: var(--utrecht-alert-icon-gap);
@@ -66,24 +69,32 @@
66
69
  .utrecht-alert--info {
67
70
  --_utrecht-alert-icon-color: var(--utrecht-alert-icon-info-color);
68
71
  --_utrecht-alert-background-color: var(--utrecht-alert-info-background-color);
72
+ --_utrecht-alert-border-color: var(--utrecht-alert-info-border-color);
73
+ --_utrecht-alert-border-width: var(--utrecht-alert-info-border-width);
69
74
  --_utrecht-alert-color: var(--utrecht-alert-info-color);
70
75
  }
71
76
 
72
77
  .utrecht-alert--ok {
73
78
  --_utrecht-alert-icon-color: var(--utrecht-alert-icon-ok-color);
74
79
  --_utrecht-alert-background-color: var(--utrecht-alert-ok-background-color);
80
+ --_utrecht-alert-border-color: var(--utrecht-alert-ok-border-color);
81
+ --_utrecht-alert-border-width: var(--utrecht-alert-ok-border-width);
75
82
  --_utrecht-alert-color: var(--utrecht-alert-ok-color);
76
83
  }
77
84
 
78
85
  .utrecht-alert--warning {
79
86
  --_utrecht-alert-icon-color: var(--utrecht-alert-icon-warning-color);
80
87
  --_utrecht-alert-background-color: var(--utrecht-alert-warning-background-color);
88
+ --_utrecht-alert-border-color: var(--utrecht-alert-warning-border-color);
89
+ --_utrecht-alert-border-width: var(--utrecht-alert-warning-border-width);
81
90
  --_utrecht-alert-color: var(--utrecht-alert-warning-color);
82
91
  }
83
92
 
84
93
  .utrecht-alert--error {
85
94
  --_utrecht-alert-icon-color: var(--utrecht-alert-icon-error-color);
86
95
  --_utrecht-alert-background-color: var(--utrecht-alert-error-background-color);
96
+ --_utrecht-alert-border-color: var(--utrecht-alert-error-border-color);
97
+ --_utrecht-alert-border-width: var(--utrecht-alert-error-border-width);
87
98
  --_utrecht-alert-color: var(--utrecht-alert-error-color);
88
99
  }
89
100
 
@@ -118,6 +129,9 @@ so do not apply these styles to an HTML `<dialog>` element without `open` attrib
118
129
  --utrecht-alert-dialog-margin-block-start: auto;
119
130
  --utrecht-alert-dialog-margin-block-end: auto;
120
131
  background-color: var(--_utrecht-alert-background-color, var(--utrecht-alert-background-color));
132
+ border-color: var(--_utrecht-alert-border-color, var(--utrecht-alert-border-color));
133
+ border-style: solid;
134
+ border-width: var(--_utrecht-alert-border-width, var(--utrecht-alert-border-width, 0));
121
135
  color: var(--_utrecht-alert-color, var(--utrecht-alert-color));
122
136
  display: grid;
123
137
  gap: var(--utrecht-alert-icon-gap);
@@ -182,18 +196,24 @@ so do not apply these styles to an HTML `<dialog>` element without `open` attrib
182
196
  .utrecht-alert-dialog--error {
183
197
  --_utrecht-alert-icon-color: var(--utrecht-alert-icon-error-color);
184
198
  --_utrecht-alert-background-color: var(--utrecht-alert-error-background-color);
199
+ --_utrecht-alert-border-color: var(--utrecht-alert-error-border-color);
200
+ --_utrecht-alert-border-width: var(--utrecht-alert-error-border-width);
185
201
  --_utrecht-alert-color: var(--utrecht-alert-error-color);
186
202
  }
187
203
 
188
204
  .utrecht-alert-dialog--info {
189
205
  --_utrecht-alert-icon-color: var(--utrecht-alert-icon-info-color);
190
206
  --_utrecht-alert-background-color: var(--utrecht-alert-info-background-color);
207
+ --_utrecht-alert-border-color: var(--utrecht-alert-info-border-color);
208
+ --_utrecht-alert-border-width: var(--utrecht-alert-info-border-width);
191
209
  --_utrecht-alert-color: var(--utrecht-alert-info-color);
192
210
  }
193
211
 
194
212
  .utrecht-alert-dialog--warning {
195
213
  --_utrecht-alert-icon-color: var(--utrecht-alert-icon-warning-color);
196
214
  --_utrecht-alert-background-color: var(--utrecht-alert-warning-background-color);
215
+ --_utrecht-alert-border-color: var(--utrecht-alert-warning-border-color);
216
+ --_utrecht-alert-border-width: var(--utrecht-alert-warning-border-width);
197
217
  --_utrecht-alert-color: var(--utrecht-alert-warning-color);
198
218
  }
199
219
 
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.0.0-alpha.373",
2
+ "version": "1.0.0-alpha.375",
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": "792b5cc76c9f319c504a2c9d0618ba7c3d7eef14"
29
+ "gitHead": "0e80f262bb13ccd133b063e64eb711a0fff2cac7"
30
30
  }