@utrecht/component-library-css 1.0.0-alpha.295 → 1.0.0-alpha.298

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 +57 -8
  2. package/package.json +3 -3
package/dist/index.css CHANGED
@@ -1095,6 +1095,7 @@ ol.utrecht-breadcrumb__list {
1095
1095
  * Copyright (c) 2021 Robbert Broersma
1096
1096
  */
1097
1097
  /* stylelint-disable-next-line block-no-empty */
1098
+ /* stylelint-disable-next-line block-no-empty */
1098
1099
  .utrecht-custom-radio-button {
1099
1100
  -webkit-appearance: none;
1100
1101
  -moz-appearance: none;
@@ -1115,7 +1116,6 @@ ol.utrecht-breadcrumb__list {
1115
1116
  width: var(--utrecht-custom-radio-button-size);
1116
1117
  }
1117
1118
 
1118
- .utrecht-custom-radio-button:checked,
1119
1119
  .utrecht-custom-radio-button--checked {
1120
1120
  background-color: var(--utrecht-custom-radio-button-checked-background-color, var(--utrecht-custom-radio-button-background-color));
1121
1121
  background-image: url("data:image/svg+xml,%3Csvg viewBox='-4 -4 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
@@ -1124,7 +1124,6 @@ ol.utrecht-breadcrumb__list {
1124
1124
  color: var(--utrecht-custom-radio-button-checked-color, var(--utrecht-custom-radio-button-color));
1125
1125
  }
1126
1126
 
1127
- .utrecht-custom-radio-button:active,
1128
1127
  .utrecht-custom-radio-button--active {
1129
1128
  background-color: var(--utrecht-custom-radio-button-active-background-color, var(--utrecht-custom-radio-button-background-color));
1130
1129
  background-image: url("data:image/svg+xml,%3Csvg viewBox='-4 -4 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
@@ -1133,14 +1132,14 @@ ol.utrecht-breadcrumb__list {
1133
1132
  color: var(--utrecht-custom-radio-button-active-color, var(--utrecht-custom-radio-button-color));
1134
1133
  }
1135
1134
 
1136
- .utrecht-custom-radio-button--focus,
1137
- .utrecht-custom-radio-button:focus {
1135
+ .utrecht-custom-radio-button--focus {
1136
+ background-color: var(--utrecht-custom-radio-button-focus-background-color, var(--utrecht-custom-radio-button-background-color));
1137
+ background-image: url("data:image/svg+xml,%3Csvg viewBox='-4 -4 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
1138
1138
  border-color: var(--utrecht-custom-radio-button-focus-border-color, var(--utrecht-custom-radio-button-border-color));
1139
1139
  border-width: var(--utrecht-custom-radio-button-focus-border-width, var(--utrecht-custom-radio-button-border-width));
1140
1140
  color: var(--utrecht-custom-radio-button-focus-color, var(--utrecht-custom-radio-button-color));
1141
1141
  }
1142
1142
 
1143
- .utrecht-custom-radio-button:focus-visible,
1144
1143
  .utrecht-custom-radio-button--focus-visible {
1145
1144
  box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1146
1145
  outline-color: var(--utrecht-focus-outline-color, transparent);
@@ -1150,21 +1149,71 @@ ol.utrecht-breadcrumb__list {
1150
1149
  }
1151
1150
 
1152
1151
  .utrecht-custom-radio-button--disabled {
1153
- background-color: var(--utrecht-custom-radio-button-disabled-background-color, var(--utrecht-custom-radio-button-background-color));
1154
- background-image: url("data:image/svg+xml,%3Csvg viewBox='-4 -4 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
1155
1152
  border-color: var(--utrecht-custom-radio-button-disabled-border-color, var(--utrecht-custom-radio-button-border-color));
1156
1153
  border-width: var(--utrecht-custom-radio-button-disabled-border-width, var(--utrecht-custom-radio-button-border-width));
1157
1154
  color: var(--utrecht-custom-radio-button-disabled-color, var(--utrecht-custom-radio-button-color));
1158
1155
  cursor: var(--utrecht-action-disabled-cursor);
1159
1156
  }
1157
+ .utrecht-custom-radio-button--disabled:checked {
1158
+ background-color: var(--utrecht-custom-radio-button-disabled-background-color, var(--utrecht-custom-radio-button-background-color));
1159
+ border-color: var(--utrecht-custom-radio-button-disabled-border-color, var(--utrecht-custom-radio-button-border-color));
1160
+ }
1161
+ .utrecht-custom-radio-button--disabled:active {
1162
+ border-color: var(--utrecht-custom-radio-button-disabled-border-color, var(--utrecht-custom-radio-button-border-color));
1163
+ }
1160
1164
 
1161
1165
  .utrecht-custom-radio-button--invalid {
1162
- background-color: var(--utrecht-custom-radio-button-invalid-background-color, var(--utrecht-custom-radio-button-background-color));
1166
+ border-color: var(--utrecht-custom-radio-button-invalid-border-color, var(--utrecht-custom-radio-button-border-color));
1167
+ border-width: var(--utrecht-custom-radio-button-invalid-border-width, var(--utrecht-custom-radio-button-border-width));
1168
+ color: var(--utrecht-custom-radio-button-invalid-color, var(--utrecht-custom-radio-button-color));
1169
+ }
1170
+
1171
+ .utrecht-custom-radio-button--html-input:disabled {
1172
+ border-color: var(--utrecht-custom-radio-button-disabled-border-color, var(--utrecht-custom-radio-button-border-color));
1173
+ border-width: var(--utrecht-custom-radio-button-disabled-border-width, var(--utrecht-custom-radio-button-border-width));
1174
+ color: var(--utrecht-custom-radio-button-disabled-color, var(--utrecht-custom-radio-button-color));
1175
+ cursor: var(--utrecht-action-disabled-cursor);
1176
+ }
1177
+ .utrecht-custom-radio-button--html-input:disabled:checked {
1178
+ background-color: var(--utrecht-custom-radio-button-disabled-background-color, var(--utrecht-custom-radio-button-background-color));
1179
+ border-color: var(--utrecht-custom-radio-button-disabled-border-color, var(--utrecht-custom-radio-button-border-color));
1180
+ }
1181
+ .utrecht-custom-radio-button--html-input:disabled:active {
1182
+ border-color: var(--utrecht-custom-radio-button-disabled-border-color, var(--utrecht-custom-radio-button-border-color));
1183
+ }
1184
+ .utrecht-custom-radio-button--html-input:focus {
1185
+ background-color: var(--utrecht-custom-radio-button-focus-background-color, var(--utrecht-custom-radio-button-background-color));
1163
1186
  background-image: url("data:image/svg+xml,%3Csvg viewBox='-4 -4 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
1187
+ border-color: var(--utrecht-custom-radio-button-focus-border-color, var(--utrecht-custom-radio-button-border-color));
1188
+ border-width: var(--utrecht-custom-radio-button-focus-border-width, var(--utrecht-custom-radio-button-border-width));
1189
+ color: var(--utrecht-custom-radio-button-focus-color, var(--utrecht-custom-radio-button-color));
1190
+ }
1191
+ .utrecht-custom-radio-button--html-input:focus-visible {
1192
+ box-shadow: 0 0 0 var(--utrecht-focus-box-shadow-spread-radius, 0) var(--utrecht-focus-box-shadow-color, transparent);
1193
+ outline-color: var(--utrecht-focus-outline-color, transparent);
1194
+ outline-offset: var(--utrecht-focus-outline-offset, 0);
1195
+ outline-style: var(--utrecht-focus-outline-style, solid);
1196
+ outline-width: var(--utrecht-focus-outline-width, 0);
1197
+ }
1198
+ .utrecht-custom-radio-button--html-input:invalid, .utrecht-custom-radio-button--html-input[aria-invalid=true] {
1164
1199
  border-color: var(--utrecht-custom-radio-button-invalid-border-color, var(--utrecht-custom-radio-button-border-color));
1165
1200
  border-width: var(--utrecht-custom-radio-button-invalid-border-width, var(--utrecht-custom-radio-button-border-width));
1166
1201
  color: var(--utrecht-custom-radio-button-invalid-color, var(--utrecht-custom-radio-button-color));
1167
1202
  }
1203
+ .utrecht-custom-radio-button--html-input:active {
1204
+ background-color: var(--utrecht-custom-radio-button-active-background-color, var(--utrecht-custom-radio-button-background-color));
1205
+ background-image: url("data:image/svg+xml,%3Csvg viewBox='-4 -4 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
1206
+ border-color: var(--utrecht-custom-radio-button-active-border-color, var(--utrecht-custom-radio-button-border-color));
1207
+ border-width: var(--utrecht-custom-radio-button-active-border-width, var(--utrecht-custom-radio-button-border-width));
1208
+ color: var(--utrecht-custom-radio-button-active-color, var(--utrecht-custom-radio-button-color));
1209
+ }
1210
+ .utrecht-custom-radio-button--html-input:checked {
1211
+ background-color: var(--utrecht-custom-radio-button-checked-background-color, var(--utrecht-custom-radio-button-background-color));
1212
+ background-image: url("data:image/svg+xml,%3Csvg viewBox='-4 -4 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
1213
+ border-color: var(--utrecht-custom-radio-button-checked-border-color, var(--utrecht-custom-radio-button-border-color));
1214
+ border-width: var(--utrecht-custom-radio-button-checked-border-width, var(--utrecht-custom-radio-button-border-width));
1215
+ color: var(--utrecht-custom-radio-button-checked-color, var(--utrecht-custom-radio-button-color));
1216
+ }
1168
1217
 
1169
1218
  /**
1170
1219
  * @license EUPL-1.2
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.0.0-alpha.295",
2
+ "version": "1.0.0-alpha.298",
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,7 +16,7 @@
16
16
  "url": "git@github.com:nl-design-system/utrecht.git"
17
17
  },
18
18
  "devDependencies": {
19
- "@utrecht/design-tokens": "1.0.0-alpha.288",
19
+ "@utrecht/design-tokens": "1.0.0-alpha.291",
20
20
  "node-sass-package-importer": "5.3.2",
21
21
  "rimraf": "3.0.2",
22
22
  "sass": "1.54.0"
@@ -27,5 +27,5 @@
27
27
  "clean": "rimraf dist/"
28
28
  },
29
29
  "main": "dist/index.css",
30
- "gitHead": "35ccd59cbca4b416c39199ede71cdf371e03db3c"
30
+ "gitHead": "c0860140ea5b2836e09c0e9793a345124b06e9ec"
31
31
  }