@utrecht/component-library-css 1.0.0-alpha.189 → 1.0.0-alpha.191

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 (4) hide show
  1. package/dist/bem.css +17 -17
  2. package/dist/index.css +18 -18
  3. package/dist/root-theme.css +1 -1
  4. package/package.json +4 -4
package/dist/bem.css CHANGED
@@ -37,9 +37,9 @@
37
37
  * Copyright (c) 2021 Robbert Broersma
38
38
  */
39
39
  .utrecht-badge, .utrecht-badge-status, .utrecht-badge-data {
40
- background-color: var(--utrecht-badge-background-color, black);
40
+ background-color: var(--utrecht-badge-background-color, hsl(0deg, 0%, 0%));
41
41
  border-radius: var(--utrecht-badge-border-radius, 0.5ch);
42
- color: var(--utrecht-badge-color, white);
42
+ color: var(--utrecht-badge-color, hsl(0deg, 0%, 100%));
43
43
  display: inline-block;
44
44
  font-family: var(--utrecht-document-font-family, sans-serif);
45
45
  font-size: var(--utrecht-badge-font-size, inherit);
@@ -57,9 +57,9 @@
57
57
  }
58
58
 
59
59
  .utrecht-badge-counter {
60
- background-color: var(--utrecht-badge-counter-background-color, var(--utrecht-badge-background-color, black));
60
+ background-color: var(--utrecht-badge-counter-background-color, var(--utrecht-badge-background-color, hsl(0deg, 0%, 0%)));
61
61
  border-radius: var(--utrecht-badge-counter-border-radius, var(--utrecht-badge-border-radius, 0.5ch));
62
- color: var(--utrecht-badge-counter-color, var(--utrecht-badge-color, white));
62
+ color: var(--utrecht-badge-counter-color, var(--utrecht-badge-color, hsl(0deg, 0%, 100%)));
63
63
  display: inline-block;
64
64
  font-family: var(--utrecht-document-font-family, sans-serif);
65
65
  font-style: var(--utrecht-badge-counter-font-style, normal);
@@ -83,9 +83,9 @@
83
83
  * Copyright (c) 2021 Robbert Broersma
84
84
  */
85
85
  .utrecht-badge, .utrecht-badge-status, .utrecht-badge-data {
86
- background-color: var(--utrecht-badge-background-color, black);
86
+ background-color: var(--utrecht-badge-background-color, hsl(0deg, 0%, 0%));
87
87
  border-radius: var(--utrecht-badge-border-radius, 0.5ch);
88
- color: var(--utrecht-badge-color, white);
88
+ color: var(--utrecht-badge-color, hsl(0deg, 0%, 100%));
89
89
  display: inline-block;
90
90
  font-family: var(--utrecht-document-font-family, sans-serif);
91
91
  font-size: var(--utrecht-badge-font-size, inherit);
@@ -116,9 +116,9 @@
116
116
  * Copyright (c) 2021 Robbert Broersma
117
117
  */
118
118
  .utrecht-badge, .utrecht-badge-status, .utrecht-badge-data {
119
- background-color: var(--utrecht-badge-background-color, black);
119
+ background-color: var(--utrecht-badge-background-color, hsl(0deg, 0%, 0%));
120
120
  border-radius: var(--utrecht-badge-border-radius, 0.5ch);
121
- color: var(--utrecht-badge-color, white);
121
+ color: var(--utrecht-badge-color, hsl(0deg, 0%, 100%));
122
122
  display: inline-block;
123
123
  font-family: var(--utrecht-document-font-family, sans-serif);
124
124
  font-size: var(--utrecht-badge-font-size, inherit);
@@ -141,17 +141,17 @@
141
141
  }
142
142
 
143
143
  .utrecht-badge-status--danger {
144
- background-color: var(--utrecht-feedback-danger-fill-background-color, red);
144
+ background-color: var(--utrecht-feedback-danger-fill-background-color, hsl(0deg, 100%, 50%));
145
145
  color: var(--utrecht-feedback-danger-fill-color, white);
146
146
  }
147
147
 
148
148
  .utrecht-badge-status--warning {
149
- background-color: var(--utrecht-feedback-warning-fill-background-color, #ffa600);
149
+ background-color: var(--utrecht-feedback-warning-fill-background-color, hsl(39deg, 100%, 50%));
150
150
  color: var(--utrecht-feedback-warning-fill-color, white);
151
151
  }
152
152
 
153
153
  .utrecht-badge-status--safe {
154
- background-color: var(--utrecht-feedback-safe-fill-background-color, green);
154
+ background-color: var(--utrecht-feedback-safe-fill-background-color, hsl(120deg, 100%, 25%));
155
155
  color: var(--utrecht-feedback-safe-fill-color, white);
156
156
  }
157
157
 
@@ -161,32 +161,32 @@
161
161
  }
162
162
 
163
163
  .utrecht-badge-status--valid {
164
- background-color: var(--utrecht-feedback-valid-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, red));
164
+ background-color: var(--utrecht-feedback-valid-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, hsl(0deg, 100%, 50%)));
165
165
  color: var(--utrecht-feedback-valid-fill-color, var(--utrecht-feedback-safe-fill-color, white));
166
166
  }
167
167
 
168
168
  .utrecht-badge-status--invalid {
169
- background-color: var(--utrecht-feedback-invalid-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, #ffa600));
169
+ background-color: var(--utrecht-feedback-invalid-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, hsl(39deg, 100%, 50%)));
170
170
  color: var(--utrecht-feedback-invalid-fill-color, var(--utrecht-feedback-danger-fill-color, white));
171
171
  }
172
172
 
173
173
  .utrecht-badge-status--error {
174
- background-color: var(--utrecht-feedback-error-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, #ffa600));
174
+ background-color: var(--utrecht-feedback-error-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, hsl(39deg, 100%, 50%)));
175
175
  color: var(--utrecht-feedback-error-fill-color, var(--utrecht-feedback-danger-fill-color, white));
176
176
  }
177
177
 
178
178
  .utrecht-badge-status--success {
179
- background-color: var(--utrecht-feedback-success-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, #ffa600));
179
+ background-color: var(--utrecht-feedback-success-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, hsl(39deg, 100%, 50%)));
180
180
  color: var(--utrecht-feedback-success-fill-color, var(--utrecht-feedback-safe-fill-color, white));
181
181
  }
182
182
 
183
183
  .utrecht-badge-status--active {
184
- background-color: var(--utrecht-feedback-active-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, #ffa600));
184
+ background-color: var(--utrecht-feedback-active-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, hsl(39deg, 100%, 50%)));
185
185
  color: var(--utrecht-feedback-active-fill-color, var(--utrecht-feedback-safe-fill-color, white));
186
186
  }
187
187
 
188
188
  .utrecht-badge-status--inactive {
189
- background-color: var(--utrecht-feedback-inactive-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, #ffa600));
189
+ background-color: var(--utrecht-feedback-inactive-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, hsl(39deg, 100%, 50%)));
190
190
  color: var(--utrecht-feedback-inactive-fill-color, var(--utrecht-feedback-danger-fill-color, white));
191
191
  }
192
192
 
package/dist/index.css CHANGED
@@ -46,9 +46,9 @@
46
46
  * Copyright (c) 2021 Robbert Broersma
47
47
  */
48
48
  .utrecht-badge, .utrecht-badge-status, .utrecht-badge-data {
49
- background-color: var(--utrecht-badge-background-color, black);
49
+ background-color: var(--utrecht-badge-background-color, hsl(0deg, 0%, 0%));
50
50
  border-radius: var(--utrecht-badge-border-radius, 0.5ch);
51
- color: var(--utrecht-badge-color, white);
51
+ color: var(--utrecht-badge-color, hsl(0deg, 0%, 100%));
52
52
  display: inline-block;
53
53
  font-family: var(--utrecht-document-font-family, sans-serif);
54
54
  font-size: var(--utrecht-badge-font-size, inherit);
@@ -66,9 +66,9 @@
66
66
  }
67
67
 
68
68
  .utrecht-badge-counter {
69
- background-color: var(--utrecht-badge-counter-background-color, var(--utrecht-badge-background-color, black));
69
+ background-color: var(--utrecht-badge-counter-background-color, var(--utrecht-badge-background-color, hsl(0deg, 0%, 0%)));
70
70
  border-radius: var(--utrecht-badge-counter-border-radius, var(--utrecht-badge-border-radius, 0.5ch));
71
- color: var(--utrecht-badge-counter-color, var(--utrecht-badge-color, white));
71
+ color: var(--utrecht-badge-counter-color, var(--utrecht-badge-color, hsl(0deg, 0%, 100%)));
72
72
  display: inline-block;
73
73
  font-family: var(--utrecht-document-font-family, sans-serif);
74
74
  font-style: var(--utrecht-badge-counter-font-style, normal);
@@ -92,9 +92,9 @@
92
92
  * Copyright (c) 2021 Robbert Broersma
93
93
  */
94
94
  .utrecht-badge, .utrecht-badge-status, .utrecht-badge-data {
95
- background-color: var(--utrecht-badge-background-color, black);
95
+ background-color: var(--utrecht-badge-background-color, hsl(0deg, 0%, 0%));
96
96
  border-radius: var(--utrecht-badge-border-radius, 0.5ch);
97
- color: var(--utrecht-badge-color, white);
97
+ color: var(--utrecht-badge-color, hsl(0deg, 0%, 100%));
98
98
  display: inline-block;
99
99
  font-family: var(--utrecht-document-font-family, sans-serif);
100
100
  font-size: var(--utrecht-badge-font-size, inherit);
@@ -125,9 +125,9 @@
125
125
  * Copyright (c) 2021 Robbert Broersma
126
126
  */
127
127
  .utrecht-badge, .utrecht-badge-status, .utrecht-badge-data {
128
- background-color: var(--utrecht-badge-background-color, black);
128
+ background-color: var(--utrecht-badge-background-color, hsl(0deg, 0%, 0%));
129
129
  border-radius: var(--utrecht-badge-border-radius, 0.5ch);
130
- color: var(--utrecht-badge-color, white);
130
+ color: var(--utrecht-badge-color, hsl(0deg, 0%, 100%));
131
131
  display: inline-block;
132
132
  font-family: var(--utrecht-document-font-family, sans-serif);
133
133
  font-size: var(--utrecht-badge-font-size, inherit);
@@ -150,17 +150,17 @@
150
150
  }
151
151
 
152
152
  .utrecht-badge-status--danger {
153
- background-color: var(--utrecht-feedback-danger-fill-background-color, red);
153
+ background-color: var(--utrecht-feedback-danger-fill-background-color, hsl(0deg, 100%, 50%));
154
154
  color: var(--utrecht-feedback-danger-fill-color, white);
155
155
  }
156
156
 
157
157
  .utrecht-badge-status--warning {
158
- background-color: var(--utrecht-feedback-warning-fill-background-color, #ffa600);
158
+ background-color: var(--utrecht-feedback-warning-fill-background-color, hsl(39deg, 100%, 50%));
159
159
  color: var(--utrecht-feedback-warning-fill-color, white);
160
160
  }
161
161
 
162
162
  .utrecht-badge-status--safe {
163
- background-color: var(--utrecht-feedback-safe-fill-background-color, green);
163
+ background-color: var(--utrecht-feedback-safe-fill-background-color, hsl(120deg, 100%, 25%));
164
164
  color: var(--utrecht-feedback-safe-fill-color, white);
165
165
  }
166
166
 
@@ -170,32 +170,32 @@
170
170
  }
171
171
 
172
172
  .utrecht-badge-status--valid {
173
- background-color: var(--utrecht-feedback-valid-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, red));
173
+ background-color: var(--utrecht-feedback-valid-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, hsl(0deg, 100%, 50%)));
174
174
  color: var(--utrecht-feedback-valid-fill-color, var(--utrecht-feedback-safe-fill-color, white));
175
175
  }
176
176
 
177
177
  .utrecht-badge-status--invalid {
178
- background-color: var(--utrecht-feedback-invalid-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, #ffa600));
178
+ background-color: var(--utrecht-feedback-invalid-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, hsl(39deg, 100%, 50%)));
179
179
  color: var(--utrecht-feedback-invalid-fill-color, var(--utrecht-feedback-danger-fill-color, white));
180
180
  }
181
181
 
182
182
  .utrecht-badge-status--error {
183
- background-color: var(--utrecht-feedback-error-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, #ffa600));
183
+ background-color: var(--utrecht-feedback-error-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, hsl(39deg, 100%, 50%)));
184
184
  color: var(--utrecht-feedback-error-fill-color, var(--utrecht-feedback-danger-fill-color, white));
185
185
  }
186
186
 
187
187
  .utrecht-badge-status--success {
188
- background-color: var(--utrecht-feedback-success-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, #ffa600));
188
+ background-color: var(--utrecht-feedback-success-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, hsl(39deg, 100%, 50%)));
189
189
  color: var(--utrecht-feedback-success-fill-color, var(--utrecht-feedback-safe-fill-color, white));
190
190
  }
191
191
 
192
192
  .utrecht-badge-status--active {
193
- background-color: var(--utrecht-feedback-active-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, #ffa600));
193
+ background-color: var(--utrecht-feedback-active-fill-background-color, var(--utrecht-feedback-safe-fill-background-color, hsl(39deg, 100%, 50%)));
194
194
  color: var(--utrecht-feedback-active-fill-color, var(--utrecht-feedback-safe-fill-color, white));
195
195
  }
196
196
 
197
197
  .utrecht-badge-status--inactive {
198
- background-color: var(--utrecht-feedback-inactive-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, #ffa600));
198
+ background-color: var(--utrecht-feedback-inactive-fill-background-color, var(--utrecht-feedback-danger-fill-background-color, hsl(39deg, 100%, 50%)));
199
199
  color: var(--utrecht-feedback-inactive-fill-color, var(--utrecht-feedback-danger-fill-color, white));
200
200
  }
201
201
 
@@ -5264,7 +5264,7 @@ however browsers don't seem to have implemented great looking supixel tweening y
5264
5264
  /* Collection of CSS variables for Utrecht theme applied to `:root` */
5265
5265
  /**
5266
5266
  * Do not edit directly
5267
- * Generated on Fri, 25 Mar 2022 11:06:24 GMT
5267
+ * Generated on Fri, 08 Apr 2022 09:15:43 GMT
5268
5268
  */
5269
5269
  :root {
5270
5270
  --utrecht-toptask-nav-link-grid-max-inline-size: 240px;
package/dist/root-theme.css CHANGED
@@ -5,7 +5,7 @@
5
5
  /* Collection of CSS variables for Utrecht theme applied to `:root` */
6
6
  /**
7
7
  * Do not edit directly
8
- * Generated on Fri, 25 Mar 2022 11:06:24 GMT
8
+ * Generated on Fri, 08 Apr 2022 09:15:43 GMT
9
9
  */
10
10
  :root {
11
11
  --utrecht-toptask-nav-link-grid-max-inline-size: 240px;
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.0.0-alpha.189",
2
+ "version": "1.0.0-alpha.191",
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",
@@ -16,15 +16,15 @@
16
16
  "url": "git@github.com:nl-design-system/utrecht.git"
17
17
  },
18
18
  "devDependencies": {
19
- "@utrecht/design-tokens": "1.0.0-alpha.182",
19
+ "@utrecht/design-tokens": "1.0.0-alpha.184",
20
20
  "node-sass-package-importer": "5.3.2",
21
21
  "rimraf": "3.0.2",
22
- "sass": "1.49.9"
22
+ "sass": "1.50.0"
23
23
  },
24
24
  "scripts": {
25
25
  "prebuild": "npm run clean",
26
26
  "build": "sass src/:dist/ --load-path=../../node_modules/ --no-source-map",
27
27
  "clean": "rimraf dist/"
28
28
  },
29
- "gitHead": "d275388239ad67f8b00f9d66b93813a10356511b"
29
+ "gitHead": "3c8587fad897ea0dc46e8229dbcde28bca995827"
30
30
  }