@utrecht/component-library-css 9.0.11 → 9.0.13

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/html.css +39 -32
  2. package/dist/index.css +229 -46
  3. package/dist/prince-xml.css +265 -77
  4. package/package.json +107 -105
package/dist/html.css CHANGED
@@ -240,12 +240,12 @@
240
240
  align-items: center;
241
241
  background-color: var(--_utrecht-button-background-color);
242
242
  block-size: fit-content;
243
- border-block-end-color: var(--_utrecht-button-border-bottom-color);
244
- border-block-end-width: var(--_utrecht-button-border-block-end-width);
245
243
  border-color: var(--_utrecht-button-border-color);
246
244
  border-radius: var(--utrecht-button-border-radius);
247
245
  border-style: solid;
248
246
  border-width: var(--_utrecht-button-border-width);
247
+ border-block-end-color: var(--_utrecht-button-border-bottom-color);
248
+ border-block-end-width: var(--_utrecht-button-border-block-end-width);
249
249
  box-sizing: border-box;
250
250
  color: var(--_utrecht-button-color);
251
251
  column-gap: var(--utrecht-button-column-gap);
@@ -376,7 +376,7 @@
376
376
  margin-block-end: calc(var(--utrecht-space-around, 0) * var(--utrecht-form-fieldset-margin-block-end, 0));
377
377
  margin-block-start: calc(var(--utrecht-space-around, 0) * var(--utrecht-form-fieldset-margin-block-start, 0));
378
378
  all: revert;
379
- border: 0;
379
+ border-width: 0;
380
380
  margin-inline-end: 0;
381
381
  margin-inline-start: 0;
382
382
  min-inline-size: 0;
@@ -463,7 +463,6 @@
463
463
  break-after: avoid;
464
464
  break-inside: avoid-column;
465
465
  break-inside: avoid;
466
- break-after: avoid-page;
467
466
  color: var(--utrecht-heading-1-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
468
467
  font-family: var(--utrecht-heading-1-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
469
468
  font-size: var(--utrecht-heading-1-font-size, revert);
@@ -477,7 +476,6 @@
477
476
  break-after: avoid;
478
477
  break-inside: avoid-column;
479
478
  break-inside: avoid;
480
- break-after: avoid-page;
481
479
  color: var(--utrecht-heading-2-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
482
480
  font-family: var(--utrecht-heading-2-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
483
481
  font-size: var(--utrecht-heading-2-font-size, revert);
@@ -491,7 +489,6 @@
491
489
  break-after: avoid;
492
490
  break-inside: avoid-column;
493
491
  break-inside: avoid;
494
- break-after: avoid-page;
495
492
  color: var(--utrecht-heading-3-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
496
493
  font-family: var(--utrecht-heading-3-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
497
494
  font-size: var(--utrecht-heading-3-font-size, revert);
@@ -505,7 +502,6 @@
505
502
  break-after: avoid;
506
503
  break-inside: avoid-column;
507
504
  break-inside: avoid;
508
- break-after: avoid-page;
509
505
  color: var(--utrecht-heading-4-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
510
506
  font-family: var(--utrecht-heading-4-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
511
507
  font-size: var(--utrecht-heading-4-font-size, revert);
@@ -519,7 +515,6 @@
519
515
  break-after: avoid;
520
516
  break-inside: avoid-column;
521
517
  break-inside: avoid;
522
- break-after: avoid-page;
523
518
  color: var(--utrecht-heading-5-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
524
519
  font-family: var(--utrecht-heading-5-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
525
520
  font-size: var(--utrecht-heading-5-font-size, revert);
@@ -533,7 +528,6 @@
533
528
  break-after: avoid;
534
529
  break-inside: avoid-column;
535
530
  break-inside: avoid;
536
- break-after: avoid-page;
537
531
  color: var(--utrecht-heading-6-color, var(--utrecht-heading-color, var(--utrecht-document-color, inherit)));
538
532
  font-family: var(--utrecht-heading-6-font-family, var(--utrecht-heading-font-family, var(--utrecht-document-font-family)));
539
533
  font-size: var(--utrecht-heading-6-font-size, revert);
@@ -829,14 +823,14 @@
829
823
  );
830
824
  }
831
825
  .utrecht-html select {
832
- background-color: var(--utrecht-select-background-color, var(--utrecht-form-control-background-color));
826
+ border-color: var(--utrecht-select-border-color, var(--utrecht-form-control-border-color));
827
+ border-radius: var(--utrecht-select-border-radius, var(--utrecht-form-control-border-radius, 0));
828
+ border-style: solid;
833
829
  border-block-end-width: var(--utrecht-select-border-block-end-width, var(--utrecht-select-border-width, var(--utrecht-form-control-border-width)));
834
830
  border-block-start-width: var(--utrecht-select-border-width, var(--utrecht-form-control-border-width));
835
- border-color: var(--utrecht-select-border-color, var(--utrecht-form-control-border-color));
836
831
  border-inline-end-width: var(--utrecht-select-border-width, var(--utrecht-form-control-border-width));
837
832
  border-inline-start-width: var(--utrecht-select-border-width, var(--utrecht-form-control-border-width));
838
- border-radius: var(--utrecht-select-border-radius, var(--utrecht-form-control-border-radius, 0));
839
- border-style: solid;
833
+ background-color: var(--utrecht-select-background-color, var(--utrecht-form-control-background-color));
840
834
  color: var(--utrecht-select-color, var(--utrecht-form-control-color));
841
835
  font-family: var(--utrecht-select-font-family, var(--utrecht-form-control-font-family));
842
836
  font-size: var(--utrecht-select-font-size, var(--utrecht-form-control-font-size));
@@ -885,10 +879,10 @@
885
879
  var(--utrecht-select-border-width, var(--utrecht-form-control-border-width))
886
880
  )
887
881
  );
888
- background-color: var(--utrecht-select-invalid-background-color, var(--utrecht-form-control-invalid-background-color, var(--utrecht-select-background-color, var(--utrecht-form-control-background-color))));
882
+ border-color: var(--utrecht-select-invalid-border-color, var(--utrecht-form-control-invalid-border-color, var(--utrecht-select-border-color, var(--utrecht-form-control-border-color))));
889
883
  border-width: var(--_utrecht-select-border-width);
890
884
  border-block-end-width: var(--utrecht-select-invalid-border-block-end-width, var(--utrecht-form-control-invalid-border-block-end-width, var(--utrecht-select-border-block-end-width, var(--utrecht-form-control-border-block-end-width, var(--_utrecht-select-border-width)))));
891
- border-color: var(--utrecht-select-invalid-border-color, var(--utrecht-form-control-invalid-border-color, var(--utrecht-select-border-color, var(--utrecht-form-control-border-color))));
885
+ background-color: var(--utrecht-select-invalid-background-color, var(--utrecht-form-control-invalid-background-color, var(--utrecht-select-background-color, var(--utrecht-form-control-background-color))));
892
886
  }
893
887
  .utrecht-html hr {
894
888
  border-color: var(--utrecht-separator-color);
@@ -1007,13 +1001,13 @@
1007
1001
  color: var(--utrecht-table-row-alternate-odd-color);
1008
1002
  }
1009
1003
  .utrecht-html textarea {
1010
- background-color: var(--utrecht-textarea-background-color, var(--utrecht-form-control-background-color));
1011
- block-size: initial;
1012
- border-width: var(--utrecht-textarea-border-width, var(--utrecht-form-control-border-width));
1013
- border-block-end-width: var(--utrecht-textarea-border-block-end-width, var(--utrecht-textarea-border-width, var(--utrecht-form-control-border-width)));
1014
1004
  border-color: var(--utrecht-textarea-border-color, var(--utrecht-form-control-border-color));
1015
1005
  border-radius: var(--utrecht-textarea-border-radius, var(--utrecht-form-control-border-radius, 0));
1016
1006
  border-style: solid;
1007
+ border-width: var(--utrecht-textarea-border-width, var(--utrecht-form-control-border-width));
1008
+ border-block-end-width: var(--utrecht-textarea-border-block-end-width, var(--utrecht-textarea-border-width, var(--utrecht-form-control-border-width)));
1009
+ background-color: var(--utrecht-textarea-background-color, var(--utrecht-form-control-background-color));
1010
+ block-size: initial;
1017
1011
  box-sizing: border-box;
1018
1012
  color: var(--utrecht-textarea-color, var(--utrecht-form-control-color));
1019
1013
  font-family: var(--utrecht-textarea-font-family, var(--utrecht-form-control-font-family));
@@ -1054,10 +1048,10 @@
1054
1048
  var(--utrecht-textarea-border-width, var(--utrecht-form-control-border-width))
1055
1049
  )
1056
1050
  );
1057
- background-color: var(--utrecht-textarea-invalid-background-color, var(--utrecht-form-control-invalid-background-color, var(--utrecht-textarea-background-color, var(--utrecht-form-control-background-color))));
1051
+ border-color: var(--utrecht-textarea-invalid-border-color, var(--utrecht-form-control-invalid-border-color, var(--utrecht-textarea-border-color, var(--utrecht-form-control-border-color))));
1058
1052
  border-width: var(--_utrecht-textarea-border-width);
1059
1053
  border-block-end-width: var(--utrecht-textarea-invalid-border-block-end-width, var(--utrecht-form-control-invalid-border-block-end-width, var(--utrecht-textarea-border-block-end-width, var(--utrecht-form-control-border-block-end-width, var(--_utrecht-textarea-border-width)))));
1060
- border-color: var(--utrecht-textarea-invalid-border-color, var(--utrecht-form-control-invalid-border-color, var(--utrecht-textarea-border-color, var(--utrecht-form-control-border-color))));
1054
+ background-color: var(--utrecht-textarea-invalid-background-color, var(--utrecht-form-control-invalid-background-color, var(--utrecht-textarea-background-color, var(--utrecht-form-control-background-color))));
1061
1055
  color: var(--utrecht-textarea-invalid-color, var(--utrecht-form-control-invalid-color, var(--utrecht-textarea-color, var(--utrecht-form-control-color))));
1062
1056
  }
1063
1057
  .utrecht-html textarea:read-only {
@@ -1097,27 +1091,40 @@
1097
1091
  var(--utrecht-textbox-border-width, var(--utrecht-form-control-border-width, 0)) +
1098
1092
  var(--utrecht-textbox-autocomplete-ui-size, 44px)
1099
1093
  );
1100
- background-color: var(--utrecht-textbox-background-color, var(--utrecht-form-control-background-color));
1101
- block-size: initial;
1102
- border-width: var(--utrecht-textbox-border-width, var(--utrecht-form-control-border-width));
1103
- border-block-end-width: var(--utrecht-textbox-border-bottom-width, var(--utrecht-textbox-border-width, var(--utrecht-form-control-border-width)));
1094
+ max-inline-size: min(var(--_utrecht-textbox-max-inline-size, 100%), var(--utrecht-textbox-max-inline-size, var(--utrecht-form-control-max-inline-size)));
1095
+ min-block-size: var(--utrecht-pointer-target-min-size, var(--basis-pointer-target-min-block-size, 44px));
1096
+ min-inline-size: var(--utrecht-pointer-target-min-size, var(--basis-pointer-target-min-inline-size, 44px));
1097
+ --_utrecht-textbox-border-width: var(--utrecht-textbox-border-width, var(--utrecht-form-control-border-width));
1098
+ --_utrecht-textbox-border-block-end-width: var(
1099
+ --utrecht-textbox-border-bottom-width,
1100
+ var(--utrecht-textbox-border-width, var(--utrecht-form-control-border-width))
1101
+ );
1104
1102
  border-color: var(--utrecht-textbox-border-color, var(--utrecht-form-control-border-color));
1105
1103
  border-radius: var(--utrecht-textbox-border-radius, var(--utrecht-form-control-border-radius, 0));
1106
1104
  border-style: solid;
1105
+ border-width: var(--_utrecht-textbox-border-width);
1106
+ border-block-end-width: var(--_utrecht-textbox-border-block-end-width);
1107
1107
  box-sizing: border-box;
1108
+ background-color: var(--utrecht-textbox-background-color, var(--utrecht-form-control-background-color));
1108
1109
  color: var(--utrecht-textbox-color, var(--utrecht-form-control-color));
1110
+ --_utrecht-textbox-padding-block-end: var(
1111
+ --utrecht-textbox-padding-block-end,
1112
+ var(--utrecht-form-control-padding-block-end, 0)
1113
+ );
1114
+ --_utrecht-textbox-padding-block-start: var(
1115
+ --utrecht-textbox-padding-block-start,
1116
+ var(--utrecht-form-control-padding-block-start, 0)
1117
+ );
1118
+ block-size: initial;
1109
1119
  display: block;
1110
1120
  font-family: var(--utrecht-textbox-font-family, var(--utrecht-form-control-font-family));
1111
1121
  font-size: var(--utrecht-textbox-font-size, var(--utrecht-form-control-font-size, inherit));
1112
1122
  font-weight: var(--utrecht-textbox-font-weight, var(--utrecht-form-control-font-weight, initial));
1113
1123
  inline-size: 100%;
1114
1124
  line-height: var(--utrecht-textbox-line-height, var(--utrecht-form-control-line-height, initial));
1115
- min-block-size: var(--utrecht-pointer-target-min-size, 44px);
1116
- min-inline-size: var(--utrecht-pointer-target-min-size, 44px);
1117
- max-inline-size: min(var(--_utrecht-textbox-max-inline-size, 100%), var(--utrecht-textbox-max-inline-size, var(--utrecht-form-control-max-inline-size)));
1118
1125
  overflow: hidden;
1119
- padding-block-end: var(--utrecht-textbox-padding-block-end, var(--utrecht-form-control-padding-block-end, 0));
1120
- padding-block-start: var(--utrecht-textbox-padding-block-start, var(--utrecht-form-control-padding-block-start, 0));
1126
+ padding-block-end: var(--_utrecht-textbox-padding-block-end);
1127
+ padding-block-start: var(--_utrecht-textbox-padding-block-start);
1121
1128
  padding-inline-end: var(--utrecht-textbox-padding-inline-end, var(--utrecht-form-control-padding-inline-end, initial));
1122
1129
  padding-inline-start: var(--utrecht-textbox-padding-inline-start, var(--utrecht-form-control-padding-inline-start, initial));
1123
1130
  white-space: nowrap;
@@ -1193,10 +1200,10 @@
1193
1200
  var(--utrecht-textbox-border-width, var(--utrecht-form-control-border-width))
1194
1201
  )
1195
1202
  );
1196
- background-color: var(--utrecht-textbox-invalid-background-color, var(--utrecht-form-control-invalid-background-color, var(--utrecht-textbox-background-color, var(--utrecht-form-control-background-color))));
1203
+ border-color: var(--utrecht-textbox-invalid-border-color, var(--utrecht-form-control-invalid-border-color, var(--utrecht-textbox-border-color, var(--utrecht-form-control-border-color))));
1197
1204
  border-width: var(--_utrecht-textbox-border-width);
1198
1205
  border-block-end-width: var(--utrecht-textbox-invalid-border-bottom-width, var(--utrecht-form-control-invalid-border-bottom-width, var(--utrecht-textbox-border-bottom-width, var(--utrecht-form-control-border-bottom-width, var(--_utrecht-textbox-border-width)))));
1199
- border-color: var(--utrecht-textbox-invalid-border-color, var(--utrecht-form-control-invalid-border-color, var(--utrecht-textbox-border-color, var(--utrecht-form-control-border-color))));
1206
+ background-color: var(--utrecht-textbox-invalid-background-color, var(--utrecht-form-control-invalid-background-color, var(--utrecht-textbox-background-color, var(--utrecht-form-control-background-color))));
1200
1207
  color: var(--utrecht-textbox-invalid-color, var(--utrecht-form-control-invalid-color, var(--utrecht-textbox-color, var(--utrecht-form-control-color))));
1201
1208
  }
1202
1209
  .utrecht-html input:not([type]):read-only,