@public-ui/themes 1.7.0-rc.13 → 1.7.0-rc.14

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/index.cjs CHANGED
@@ -355,8 +355,8 @@ var TagEnum = /* @__PURE__ */ ((TagEnum2) => {
355
355
  TagEnum2[TagEnum2["input-checkbox"] = 17] = "input-checkbox";
356
356
  TagEnum2[TagEnum2["input-color"] = 18] = "input-color";
357
357
  TagEnum2[TagEnum2["input-date"] = 19] = "input-date";
358
- TagEnum2[TagEnum2["input-file"] = 20] = "input-file";
359
- TagEnum2[TagEnum2["input-email"] = 21] = "input-email";
358
+ TagEnum2[TagEnum2["input-email"] = 20] = "input-email";
359
+ TagEnum2[TagEnum2["input-file"] = 21] = "input-file";
360
360
  TagEnum2[TagEnum2["input-number"] = 22] = "input-number";
361
361
  TagEnum2[TagEnum2["input-password"] = 23] = "input-password";
362
362
  TagEnum2[TagEnum2["input-radio"] = 24] = "input-radio";
@@ -374,13 +374,15 @@ var TagEnum = /* @__PURE__ */ ((TagEnum2) => {
374
374
  TagEnum2[TagEnum2["separator"] = 36] = "separator";
375
375
  TagEnum2[TagEnum2["skip-nav"] = 37] = "skip-nav";
376
376
  TagEnum2[TagEnum2["spin"] = 38] = "spin";
377
- TagEnum2[TagEnum2["symbol"] = 39] = "symbol";
378
- TagEnum2[TagEnum2["table"] = 40] = "table";
379
- TagEnum2[TagEnum2["tabs"] = 41] = "tabs";
380
- TagEnum2[TagEnum2["textarea"] = 42] = "textarea";
381
- TagEnum2[TagEnum2["toast"] = 43] = "toast";
382
- TagEnum2[TagEnum2["toolbar"] = 44] = "toolbar";
383
- TagEnum2[TagEnum2["tooltip"] = 45] = "tooltip";
377
+ TagEnum2[TagEnum2["split-button"] = 39] = "split-button";
378
+ TagEnum2[TagEnum2["symbol"] = 40] = "symbol";
379
+ TagEnum2[TagEnum2["table"] = 41] = "table";
380
+ TagEnum2[TagEnum2["tabs"] = 42] = "tabs";
381
+ TagEnum2[TagEnum2["textarea"] = 43] = "textarea";
382
+ TagEnum2[TagEnum2["toast"] = 44] = "toast";
383
+ TagEnum2[TagEnum2["toast-container"] = 45] = "toast-container";
384
+ TagEnum2[TagEnum2["toolbar"] = 46] = "toolbar";
385
+ TagEnum2[TagEnum2["tooltip"] = 47] = "tooltip";
384
386
  return TagEnum2;
385
387
  })(TagEnum || {});
386
388
 
@@ -9850,9 +9852,7 @@ const BMF = KoliBri.createTheme("bmf", {
9850
9852
  :host > span {
9851
9853
  border-radius: 0.3125rem;
9852
9854
  display: inline-flex;
9853
- font-size: 1em;
9854
9855
  font-style: normal;
9855
- line-height: 1.25rem;
9856
9856
  }
9857
9857
  :host > span.smart-button {
9858
9858
  align-items: center;
@@ -10267,7 +10267,7 @@ const BMF = KoliBri.createTheme("bmf", {
10267
10267
  :host > div.open > kol-heading-wc button kol-icon::part(icon)::before {
10268
10268
  content: "\\f078";
10269
10269
  }
10270
- :host > div.close > kol-heading-wc button kol-icon::part(icon)::before {
10270
+ :host > div:not(.open) > kol-heading-wc button kol-icon::part(icon)::before {
10271
10271
  content: "\\f054";
10272
10272
  }
10273
10273
  :host > div {
@@ -10544,13 +10544,14 @@ const BMF = KoliBri.createTheme("bmf", {
10544
10544
  justify-items: left;
10545
10545
  width: 100%;
10546
10546
  min-height: 44px;
10547
- gap: 0.4em;
10548
10547
  }
10549
10548
  :host kol-input.default {
10550
10549
  grid-template-columns: 1.5rem auto;
10550
+ gap: 0.4em;
10551
10551
  }
10552
10552
  :host kol-input.switch {
10553
10553
  grid-template-columns: 3.5rem auto;
10554
+ gap: 0.4em;
10554
10555
  }
10555
10556
  :host kol-input > div.input {
10556
10557
  display: inherit;
@@ -10732,15 +10733,9 @@ const BMF = KoliBri.createTheme("bmf", {
10732
10733
  :host .disabled {
10733
10734
  opacity: 0.33;
10734
10735
  }
10736
+
10735
10737
  :host kol-input.button {
10736
- cursor: inherit;
10737
- display: grid;
10738
- column-gap: 0;
10739
- grid-template-columns: 32px auto;
10740
- grid-template-areas:
10741
- "error error"
10742
- "input label"
10743
- "hint hint";
10738
+ row-gap: 0.5rem;
10744
10739
  }
10745
10740
 
10746
10741
  :host kol-input.button.checked > .input,
@@ -10748,12 +10743,7 @@ const BMF = KoliBri.createTheme("bmf", {
10748
10743
  background-color: var(--color-ice);
10749
10744
  }
10750
10745
 
10751
- :host kol-input.button > .error {
10752
- grid-area: error;
10753
- }
10754
-
10755
10746
  :host kol-input.button > label {
10756
- grid-area: label;
10757
10747
  background-color: var(--color-silver);
10758
10748
  border-top-right-radius: var(--border-radius);
10759
10749
  border-bottom-right-radius: var(--border-radius);
@@ -10765,7 +10755,6 @@ const BMF = KoliBri.createTheme("bmf", {
10765
10755
  }
10766
10756
 
10767
10757
  :host kol-input.button > .input {
10768
- grid-area: input;
10769
10758
  background-color: var(--color-silver);
10770
10759
  border-top-left-radius: var(--border-radius);
10771
10760
  border-bottom-left-radius: var(--border-radius);
@@ -10774,13 +10763,13 @@ const BMF = KoliBri.createTheme("bmf", {
10774
10763
  place-content: center;
10775
10764
  }
10776
10765
 
10777
- :host kol-input.button > .hint {
10778
- grid-area: hint;
10779
- }
10780
-
10781
10766
  :host kol-input.button > .input > div {
10782
10767
  display: flex;
10783
10768
  }
10769
+
10770
+ :host kol-input.button .icon {
10771
+ height: auto;
10772
+ }
10784
10773
  `,
10785
10774
  "KOL-INPUT-RADIO": `/* INPUT */
10786
10775
  kol-input {
@@ -10916,26 +10905,13 @@ const BMF = KoliBri.createTheme("bmf", {
10916
10905
  fieldset div label {
10917
10906
  padding-left: 0;
10918
10907
  }`,
10919
- "KOL-TOAST": `:host > div {
10920
- position: fixed;
10921
- top: 0;
10922
- right: 0;
10923
- width: 100%;
10924
- height: 0;
10925
- z-index: 200;
10926
- }
10927
- :host > div > kol-alert {
10928
- display: block;
10929
- margin-left: auto;
10930
- margin-right: unset;
10931
- padding: 2rem;
10932
- max-width: 440px;
10933
- }
10934
- :host > div > kol-button-wc {
10935
- top: 0;
10936
- position: relative;
10937
- display: block;
10938
- width: 1em;
10908
+ "KOL-TOAST-CONTAINER": `:host {
10909
+ top: 1rem;
10910
+ right: 1rem;
10911
+ width: 440px;
10912
+ }`,
10913
+ "KOL-TOAST": `.toast {
10914
+ margin-top: 1rem;
10939
10915
  }`,
10940
10916
  "KOL-TABS": `button:disabled {
10941
10917
  opacity: 0.5;
@@ -18500,6 +18476,9 @@ const BMF = KoliBri.createTheme("bmf", {
18500
18476
  border-color: var(--color-ocean);
18501
18477
  color: var(--color-white);
18502
18478
  cursor: pointer;
18479
+ }`,
18480
+ "KOL-SPLIT-BUTTON": `.popover {
18481
+ background: #fff;
18503
18482
  }`
18504
18483
  });
18505
18484
 
@@ -19509,12 +19488,12 @@ const DEFAULT = KoliBri.createTheme("default", {
19509
19488
  "KOL-BADGE": css`
19510
19489
  :host {
19511
19490
  display: inline-block;
19491
+ font-size: inherit;
19512
19492
  }
19513
19493
  :host > span {
19514
19494
  border-radius: var(--border-radius);
19515
19495
  display: inline-flex;
19516
19496
  font-style: normal;
19517
- line-height: 1.25rem;
19518
19497
  }
19519
19498
  :host > span.smart-button {
19520
19499
  align-items: center;
@@ -20144,6 +20123,9 @@ const DEFAULT = KoliBri.createTheme("default", {
20144
20123
  :host kol-input.switch {
20145
20124
  grid-template-columns: 3.5rem auto;
20146
20125
  }
20126
+ :host kol-input.button {
20127
+ gap: 0.4rem 0;
20128
+ }
20147
20129
  :host kol-input > div.input {
20148
20130
  display: inherit;
20149
20131
  min-height: var(--a11y-min-size);
@@ -20441,27 +20423,16 @@ const DEFAULT = KoliBri.createTheme("default", {
20441
20423
  padding-left: 0;
20442
20424
  }
20443
20425
  `,
20444
- "KOL-TOAST": css`
20445
- :host > div {
20446
- position: fixed;
20447
- top: 0;
20448
- right: 0;
20449
- width: 100%;
20450
- height: 0;
20451
- z-index: 200;
20452
- }
20453
- :host > div > kol-alert {
20454
- display: block;
20455
- margin-left: auto;
20456
- margin-right: unset;
20457
- padding: 2rem;
20458
- max-width: 750px;
20426
+ "KOL-TOAST-CONTAINER": css`
20427
+ :host {
20428
+ top: 1rem;
20429
+ right: 1rem;
20430
+ width: 440px;
20459
20431
  }
20460
- :host > div > kol-button-wc {
20461
- top: 0;
20462
- position: relative;
20463
- display: block;
20464
- width: 1rem;
20432
+ `,
20433
+ "KOL-TOAST": css`
20434
+ .toast {
20435
+ margin-top: 1rem;
20465
20436
  }
20466
20437
  `,
20467
20438
  "KOL-TABS": css`
@@ -20922,7 +20893,10 @@ const DEFAULT = KoliBri.createTheme("default", {
20922
20893
  color: var(--color-light);
20923
20894
  cursor: pointer;
20924
20895
  }
20925
- `
20896
+ `,
20897
+ "KOL-SPLIT-BUTTON": `.popover {
20898
+ background: #fff;
20899
+ }`
20926
20900
  });
20927
20901
 
20928
20902
  const ECL_EC = KoliBri.createTheme("ecl-ec", {
@@ -21080,7 +21054,7 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21080
21054
  outline: 2px solid var(--color-blue);
21081
21055
  outline-offset: -2px;
21082
21056
  }
21083
- div[part="content"] {
21057
+ .content {
21084
21058
  padding: var(--spacing-s) var(--spacing-m);
21085
21059
  }`,
21086
21060
  "KOL-INDENTED-TEXT": `:host > div {
@@ -21279,7 +21253,7 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21279
21253
  color: var(--color-blue-130);
21280
21254
  }`,
21281
21255
  "KOL-BADGE": `:host > span {
21282
- font: normal normal var(--font-weight) 0.875rem/1em var(--font-family);
21256
+ font: normal normal var(--font-weight) 1em var(--font-family);
21283
21257
  padding: calc(0.5rem - 1px) calc(0.75rem - 1px);
21284
21258
  text-transform: uppercase;
21285
21259
  }`,
@@ -21561,6 +21535,13 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21561
21535
  kol-input {
21562
21536
  gap: var(--spacing-xs);
21563
21537
  }
21538
+ .button {
21539
+ gap: var(--spacing-xs) 0;
21540
+ grid-template-areas:
21541
+ "input label"
21542
+ "hint hint"
21543
+ "error error";
21544
+ }
21564
21545
  kol-input > .input {
21565
21546
  order: 2;
21566
21547
  }
@@ -21585,7 +21566,6 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21585
21566
  select,
21586
21567
  textarea {
21587
21568
  border: none;
21588
- margin: 1px;
21589
21569
  outline: none;
21590
21570
  }
21591
21571
  input,
@@ -21613,6 +21593,7 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21613
21593
  color: var(--color-grey);
21614
21594
  order: 4;
21615
21595
  align-items: center;
21596
+ padding: 1px;
21616
21597
  }
21617
21598
  input::placeholder,
21618
21599
  textarea::placeholder {
@@ -21665,6 +21646,7 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21665
21646
  "KOL-INPUT-RADIO": `fieldset {
21666
21647
  border: 0;
21667
21648
  gap: 0.5rem;
21649
+ flex-wrap: wrap;
21668
21650
  }
21669
21651
  .input-slot {
21670
21652
  gap: 0.25rem;
@@ -21681,6 +21663,13 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21681
21663
  fieldset kol-input {
21682
21664
  order: 4;
21683
21665
  }
21666
+ .radio-input-wrapper {
21667
+ display: flex;
21668
+ align-items: center;
21669
+ }
21670
+ .radio-label {
21671
+ padding-left: 0.5rem;
21672
+ }
21684
21673
  input[type="radio"] {
21685
21674
  border: 2px solid var(--color-grey-75);
21686
21675
  }
@@ -21723,6 +21712,7 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21723
21712
  font-size: 0.875em;
21724
21713
  margin-left: calc(-1 * var(--spacing-xs));
21725
21714
  order: 1;
21715
+ width: 100%;
21726
21716
  }
21727
21717
  .hint {
21728
21718
  font-size: 0.875rem;
@@ -21814,6 +21804,7 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21814
21804
  color: var(--color-grey);
21815
21805
  order: 4;
21816
21806
  align-items: center;
21807
+ padding: 1px;
21817
21808
  }
21818
21809
  input::placeholder,
21819
21810
  textarea::placeholder {
@@ -21838,7 +21829,6 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21838
21829
  select,
21839
21830
  textarea {
21840
21831
  border: none;
21841
- margin: 1px 0.5em;
21842
21832
  outline: none;
21843
21833
  }
21844
21834
  input,
@@ -21866,6 +21856,7 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21866
21856
  color: var(--color-grey);
21867
21857
  order: 4;
21868
21858
  align-items: center;
21859
+ padding: 1px 0.5em;
21869
21860
  }
21870
21861
  input::placeholder,
21871
21862
  textarea::placeholder {
@@ -21890,7 +21881,6 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21890
21881
  select,
21891
21882
  textarea {
21892
21883
  border: none;
21893
- margin: 1px 0.5em;
21894
21884
  outline: none;
21895
21885
  }
21896
21886
  input,
@@ -21918,6 +21908,7 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21918
21908
  color: var(--color-grey);
21919
21909
  order: 4;
21920
21910
  align-items: center;
21911
+ padding: 1px 0.5em;
21921
21912
  }
21922
21913
  input::placeholder,
21923
21914
  textarea::placeholder {
@@ -21942,7 +21933,6 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21942
21933
  select,
21943
21934
  textarea {
21944
21935
  border: none;
21945
- margin: 1px 0.5em;
21946
21936
  outline: none;
21947
21937
  }
21948
21938
  input,
@@ -21970,6 +21960,7 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21970
21960
  color: var(--color-grey);
21971
21961
  order: 4;
21972
21962
  align-items: center;
21963
+ padding: 1px 0.5em;
21973
21964
  }
21974
21965
  input::placeholder,
21975
21966
  textarea::placeholder {
@@ -21994,7 +21985,6 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
21994
21985
  select,
21995
21986
  textarea {
21996
21987
  border: none;
21997
- margin: 1px 0.5em;
21998
21988
  outline: none;
21999
21989
  }
22000
21990
  input,
@@ -22022,6 +22012,7 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
22022
22012
  color: var(--color-grey);
22023
22013
  order: 4;
22024
22014
  align-items: center;
22015
+ padding: 1px 0.5em;
22025
22016
  }
22026
22017
  input::placeholder,
22027
22018
  textarea::placeholder {
@@ -22098,7 +22089,6 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
22098
22089
  select,
22099
22090
  textarea {
22100
22091
  border: none;
22101
- margin: 1px 0.5em;
22102
22092
  outline: none;
22103
22093
  }
22104
22094
  input,
@@ -22126,6 +22116,7 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
22126
22116
  color: var(--color-grey);
22127
22117
  order: 4;
22128
22118
  align-items: center;
22119
+ padding: 1px 0.5em;
22129
22120
  }
22130
22121
  input::placeholder,
22131
22122
  textarea::placeholder {
@@ -22150,7 +22141,6 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
22150
22141
  select,
22151
22142
  textarea {
22152
22143
  border: none;
22153
- margin: 1px 0.5em;
22154
22144
  outline: none;
22155
22145
  }
22156
22146
  input,
@@ -22178,6 +22168,7 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
22178
22168
  color: var(--color-grey);
22179
22169
  order: 4;
22180
22170
  align-items: center;
22171
+ padding: 1px 0.5em;
22181
22172
  }
22182
22173
  .counter {
22183
22174
  order: 5;
@@ -22362,6 +22353,24 @@ const ECL_EC = KoliBri.createTheme("ecl-ec", {
22362
22353
  border-color: var(--color-blue);
22363
22354
  color: var(--color-white);
22364
22355
  cursor: pointer;
22356
+ }`,
22357
+ "KOL-SPLIT-BUTTON": `.popover {
22358
+ background: #fff;
22359
+ }`,
22360
+ "KOL-TOAST-CONTAINER": `:host {
22361
+ top: 1rem;
22362
+ right: 1rem;
22363
+ width: 440px;
22364
+ }`,
22365
+ "KOL-TOAST": `:host {
22366
+ display: block;
22367
+ }
22368
+ .toast {
22369
+ background: #fff;
22370
+ margin-top: 1rem;
22371
+ }
22372
+ .alert {
22373
+ display: block;
22365
22374
  }`
22366
22375
  });
22367
22376
 
@@ -22411,6 +22420,7 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
22411
22420
  --color-grey-110: #222732;
22412
22421
  --color-grey-100: #262b38;
22413
22422
  --color-grey-80: #515560;
22423
+ --color-grey-75: #515560;
22414
22424
  --color-grey-60: #7d8088;
22415
22425
  --color-grey-40: #a8aaaf;
22416
22426
  --color-grey-20: #d4d5d7;
@@ -22624,7 +22634,7 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
22624
22634
  .open .headline button kol-icon::part(icon)::before {
22625
22635
  content: "\\f077";
22626
22636
  }
22627
- .close .headline button kol-icon::part(icon)::before {
22637
+ :not(.open) .headline button kol-icon::part(icon)::before {
22628
22638
  content: "\\f078";
22629
22639
  }
22630
22640
  .content,
@@ -23127,6 +23137,13 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23127
23137
  kol-input {
23128
23138
  gap: var(--spacing-xs);
23129
23139
  }
23140
+ .button {
23141
+ gap: var(--spacing-xs) 0;
23142
+ grid-template-areas:
23143
+ "input label"
23144
+ "hint hint"
23145
+ "error error";
23146
+ }
23130
23147
  kol-input > .input {
23131
23148
  order: 2;
23132
23149
  }
@@ -23151,7 +23168,6 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23151
23168
  select,
23152
23169
  textarea {
23153
23170
  border: none;
23154
- margin: 1px;
23155
23171
  outline: none;
23156
23172
  }
23157
23173
  input,
@@ -23179,6 +23195,7 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23179
23195
  color: var(--color-grey);
23180
23196
  order: 4;
23181
23197
  align-items: center;
23198
+ padding: 1px;
23182
23199
  }
23183
23200
  input::placeholder,
23184
23201
  textarea::placeholder {
@@ -23255,7 +23272,6 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23255
23272
  select,
23256
23273
  textarea {
23257
23274
  border: none;
23258
- margin: 1px 0.5em;
23259
23275
  outline: none;
23260
23276
  }
23261
23277
  input,
@@ -23283,6 +23299,7 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23283
23299
  color: var(--color-grey);
23284
23300
  order: 4;
23285
23301
  align-items: center;
23302
+ padding: 1px 0.5em;
23286
23303
  }
23287
23304
  input::placeholder,
23288
23305
  textarea::placeholder {
@@ -23307,7 +23324,6 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23307
23324
  select,
23308
23325
  textarea {
23309
23326
  border: none;
23310
- margin: 1px 0.5em;
23311
23327
  outline: none;
23312
23328
  }
23313
23329
  input,
@@ -23335,6 +23351,7 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23335
23351
  color: var(--color-grey);
23336
23352
  order: 4;
23337
23353
  align-items: center;
23354
+ padding: 1px 0.5em;
23338
23355
  }
23339
23356
  input::placeholder,
23340
23357
  textarea::placeholder {
@@ -23359,7 +23376,6 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23359
23376
  select,
23360
23377
  textarea {
23361
23378
  border: none;
23362
- margin: 1px 0.5em;
23363
23379
  outline: none;
23364
23380
  }
23365
23381
  input,
@@ -23387,6 +23403,7 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23387
23403
  color: var(--color-grey);
23388
23404
  order: 4;
23389
23405
  align-items: center;
23406
+ padding: 1px 0.5em;
23390
23407
  }
23391
23408
  input::placeholder,
23392
23409
  textarea::placeholder {
@@ -23411,7 +23428,6 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23411
23428
  select,
23412
23429
  textarea {
23413
23430
  border: none;
23414
- margin: 1px;
23415
23431
  outline: none;
23416
23432
  }
23417
23433
  input,
@@ -23439,6 +23455,7 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23439
23455
  color: var(--color-grey);
23440
23456
  order: 4;
23441
23457
  align-items: center;
23458
+ padding: 1px;
23442
23459
  }
23443
23460
  input::placeholder,
23444
23461
  textarea::placeholder {
@@ -23463,7 +23480,6 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23463
23480
  select,
23464
23481
  textarea {
23465
23482
  border: none;
23466
- margin: 1px;
23467
23483
  outline: none;
23468
23484
  }
23469
23485
  input,
@@ -23491,6 +23507,7 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23491
23507
  color: var(--color-grey);
23492
23508
  order: 4;
23493
23509
  align-items: center;
23510
+ padding: 1px;
23494
23511
  }
23495
23512
  input::placeholder,
23496
23513
  textarea::placeholder {
@@ -23515,7 +23532,6 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23515
23532
  select,
23516
23533
  textarea {
23517
23534
  border: none;
23518
- margin: 1px 0.5em;
23519
23535
  outline: none;
23520
23536
  }
23521
23537
  input,
@@ -23543,6 +23559,7 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23543
23559
  color: var(--color-grey);
23544
23560
  order: 4;
23545
23561
  align-items: center;
23562
+ padding: 1px 0.5em;
23546
23563
  }
23547
23564
  input::placeholder,
23548
23565
  textarea::placeholder {
@@ -23567,7 +23584,6 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23567
23584
  select,
23568
23585
  textarea {
23569
23586
  border: none;
23570
- margin: 1px 0.5em;
23571
23587
  outline: none;
23572
23588
  }
23573
23589
  input,
@@ -23595,6 +23611,7 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23595
23611
  color: var(--color-grey);
23596
23612
  order: 4;
23597
23613
  align-items: center;
23614
+ padding: 1px 0.5em;
23598
23615
  }
23599
23616
  kol-input .counter {
23600
23617
  order: 5;
@@ -23768,9 +23785,7 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23768
23785
  "KOL-INPUT-RADIO": `fieldset {
23769
23786
  border: 0;
23770
23787
  gap: 0.5rem;
23771
- }
23772
- .input-slot {
23773
- gap: 0.25rem;
23788
+ flex-wrap: wrap;
23774
23789
  }
23775
23790
  fieldset kol-alert {
23776
23791
  order: 1;
@@ -23784,8 +23799,16 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23784
23799
  fieldset kol-input {
23785
23800
  order: 4;
23786
23801
  }
23802
+ .radio-input-wrapper {
23803
+ display: flex;
23804
+ align-items: center;
23805
+ }
23806
+ .radio-label {
23807
+ padding-left: 0.5rem;
23808
+ }
23787
23809
  input[type="radio"] {
23788
- border: 2px solid var(--color-grey-75);
23810
+ outline: 2px solid var(--color-grey-75);
23811
+ outline-offset: 2px;
23789
23812
  }
23790
23813
  input[type="radio"]:before {
23791
23814
  display: none;
@@ -23795,8 +23818,7 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23795
23818
  border-width: 7px;
23796
23819
  }
23797
23820
  input[type="radio"]:focus {
23798
- outline: 2px solid var(--color-blue);
23799
- outline-offset: 2px;
23821
+ outline-color: var(--color-blue);
23800
23822
  }
23801
23823
  input[type="radio"]:not(:disabled):hover {
23802
23824
  border-color: var(--color-blue);
@@ -23826,11 +23848,15 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23826
23848
  font-size: 0.875em;
23827
23849
  margin-left: calc(-1 * var(--spacing-xs));
23828
23850
  order: 1;
23851
+ width: 100%;
23829
23852
  }
23830
23853
  .hint {
23831
23854
  font-size: 0.875rem;
23832
23855
  order: 4;
23833
23856
  }`,
23857
+ "KOL-INPUT-RANGE": `.inputs-wrapper {
23858
+ gap: 1rem;
23859
+ }`,
23834
23860
  "KOL-SKIP-NAV": `kol-link-wc > a > kol-span-wc {
23835
23861
  border-radius: 4px;
23836
23862
  gap: 0.5rem;
@@ -23839,6 +23865,24 @@ const ECL_EU = KoliBri.createTheme("ecl-eu", {
23839
23865
  background-color: #0e47cb;
23840
23866
  color: #fff;
23841
23867
  cursor: pointer;
23868
+ }`,
23869
+ "KOL-SPLIT-BUTTON": `.popover {
23870
+ background: #fff;
23871
+ }`,
23872
+ "KOL-TOAST-CONTAINER": `:host {
23873
+ top: 1rem;
23874
+ right: 1rem;
23875
+ width: 440px;
23876
+ }`,
23877
+ "KOL-TOAST": `:host {
23878
+ display: block;
23879
+ }
23880
+ .toast {
23881
+ background: #fff;
23882
+ margin-top: 1rem;
23883
+ }
23884
+ .alert {
23885
+ display: block;
23842
23886
  }`
23843
23887
  });
23844
23888
 
@@ -24572,6 +24616,9 @@ const ITZBund = KoliBri.createTheme("itzbund", {
24572
24616
  :host .default {
24573
24617
  border-color: var(--color-anthrazit);
24574
24618
  }
24619
+ .heading {
24620
+ gap: 0.5rem;
24621
+ }
24575
24622
  .default .heading-icon {
24576
24623
  background-color: var(--color-anthrazit);
24577
24624
  }
@@ -24645,7 +24692,6 @@ const ITZBund = KoliBri.createTheme("itzbund", {
24645
24692
  :host > span {
24646
24693
  border-radius: 0.3125rem;
24647
24694
  display: inline-flex;
24648
- line-height: 1.25rem;
24649
24695
  }
24650
24696
  :host > span kol-button-wc {
24651
24697
  border-left: 1px solid rgba(0, 0, 0, 0.25);
@@ -24958,6 +25004,9 @@ const ITZBund = KoliBri.createTheme("itzbund", {
24958
25004
  font-size: inherit;
24959
25005
  line-height: inherit;
24960
25006
  }
25007
+ .content {
25008
+ padding: 0.5rem;
25009
+ }
24961
25010
  :host > div > kol-heading-wc button kol-icon::part(close)::before {
24962
25011
  font-family: "Font Awesome 6 Free";
24963
25012
  content: "\\f077";
@@ -25167,9 +25216,16 @@ const ITZBund = KoliBri.createTheme("itzbund", {
25167
25216
  kol-input.default {
25168
25217
  grid-template-columns: calc(6 * 2 * var(--spacing)) auto;
25169
25218
  }
25170
- kol-input.switch {
25219
+ .switch {
25171
25220
  grid-template-columns: calc(13 * 2 * var(--spacing)) auto;
25172
25221
  }
25222
+ .button {
25223
+ gap: 0.5rem 0;
25224
+ grid-template-areas:
25225
+ "input label"
25226
+ "hint hint"
25227
+ "error error";
25228
+ }
25173
25229
  kol-input > div.input {
25174
25230
  display: inline-flex;
25175
25231
  order: 1;
@@ -25328,8 +25384,10 @@ const ITZBund = KoliBri.createTheme("itzbund", {
25328
25384
  border: 0px;
25329
25385
  margin: 0px;
25330
25386
  padding: 0px;
25331
- display: grid;
25332
- gap: 0.25em;
25387
+ flex-wrap: wrap;
25388
+ }
25389
+ fieldset.horizontal {
25390
+ gap: 1rem;
25333
25391
  }
25334
25392
  fieldset legend {
25335
25393
  display: block;
@@ -25370,28 +25428,22 @@ const ITZBund = KoliBri.createTheme("itzbund", {
25370
25428
  background-color: var(--color-input-bg-default);
25371
25429
  border-color: #999;
25372
25430
  cursor: not-allowed;
25373
- }`,
25374
- "KOL-TOAST": `:host > div {
25375
- position: fixed;
25376
- top: 0;
25377
- left: 0;
25378
- width: 100%;
25379
- height: 0;
25380
- z-index: 200;
25381
25431
  }
25382
- :host > div > kol-alert {
25383
- display: block;
25384
- margin: auto;
25385
- padding: 1rem;
25386
- max-width: 750px;
25387
- }
25388
- :host > div > kol-button-wc {
25389
- top: 0;
25390
- position: relative;
25391
- display: block;
25392
- margin: auto;
25393
- width: 1em;
25432
+ kol-alert {
25433
+ width: 100%:
25434
+ }`,
25435
+ "KOL-TOAST-CONTAINER": `:host {
25436
+ top: 1rem;
25437
+ width: 750px;
25438
+ left: 50%;
25439
+ transform: translateX(-50%);
25394
25440
  }`,
25441
+ "KOL-TOAST": `
25442
+ .toast {
25443
+ background: #fff;
25444
+ margin-top: 1rem;
25445
+ }
25446
+ `,
25395
25447
  "KOL-TABS": `:host > div {
25396
25448
  display: block;
25397
25449
  width: 100%;
@@ -25560,6 +25612,9 @@ const ITZBund = KoliBri.createTheme("itzbund", {
25560
25612
  border-color: var(--color-petrol);
25561
25613
  color: var(--color-weiss);
25562
25614
  cursor: pointer;
25615
+ }`,
25616
+ "KOL-SPLIT-BUTTON": `.popover {
25617
+ background: #fff;
25563
25618
  }`
25564
25619
  });
25565
25620
 
@@ -36028,6 +36083,9 @@ const MAPZ = KoliBri.createTheme("mapz", {
36028
36083
  kol-input.switch {
36029
36084
  grid-template-columns: calc(13 * var(--spacing)) auto;
36030
36085
  }
36086
+ .button {
36087
+ gap: 0.5rem 0;
36088
+ }
36031
36089
  kol-input > div.input {
36032
36090
  display: inline-flex;
36033
36091
  order: 1;
@@ -36579,6 +36637,9 @@ const MAPZ = KoliBri.createTheme("mapz", {
36579
36637
  font-weight: inherit;
36580
36638
  font-size: inherit;
36581
36639
  line-height: inherit;
36640
+ }
36641
+ .content {
36642
+ padding: 0.5rem;
36582
36643
  }`,
36583
36644
  "KOL-CARD": `:host > div {
36584
36645
  border-color: var(--kolibri-border-color);
@@ -36603,7 +36664,7 @@ const MAPZ = KoliBri.createTheme("mapz", {
36603
36664
  padding: 0.5rem;
36604
36665
  }
36605
36666
  :host div.content {
36606
- padding: 0;
36667
+ padding: 0.5rem;
36607
36668
  }
36608
36669
  :host div.content,
36609
36670
  :host div.content + div.footer {
@@ -36866,28 +36927,18 @@ const MAPZ = KoliBri.createTheme("mapz", {
36866
36927
  :host > div.tabs-align-right > div {
36867
36928
  border-radius: 0.25rem 0 0 0.25rem;
36868
36929
  }`,
36869
- "KOL-TOAST": `:host > div {
36870
- position: fixed;
36871
- top: 0;
36872
- left: 0;
36873
- width: 100%;
36874
- height: 0;
36875
- z-index: 200;
36876
- }
36877
- :host > div > kol-alert {
36878
- background-color: white;
36879
- border-radius: var(--kolibri-border-radius);
36880
- display: block;
36881
- margin: 1rem auto;
36882
- max-width: 750px;
36883
- }
36884
- :host > div > kol-button-wc {
36885
- top: 0;
36886
- position: relative;
36887
- display: block;
36888
- margin: auto;
36889
- width: 1em;
36930
+ "KOL-TOAST-CONTAINER": `:host {
36931
+ top: 1rem;
36932
+ width: 750px;
36933
+ left: 50%;
36934
+ transform: translateX(-50%);
36890
36935
  }`,
36936
+ "KOL-TOAST": `
36937
+ .toast {
36938
+ background: #fff;
36939
+ margin-top: 1rem;
36940
+ }
36941
+ `,
36891
36942
  "KOL-NAV": `:host > div {
36892
36943
  gap: var(--spacing);
36893
36944
  }
@@ -52737,6 +52788,9 @@ const MAPZ = KoliBri.createTheme("mapz", {
52737
52788
  border-color: var(--kolibri-border-color);
52738
52789
  color: white;
52739
52790
  cursor: pointer;
52791
+ }`,
52792
+ "KOL-SPLIT-BUTTON": `.popover {
52793
+ background: #fff;
52740
52794
  }`
52741
52795
  });
52742
52796
 
@@ -52839,7 +52893,6 @@ const ZOLLv2 = KoliBri.createTheme("zoll-v2", {
52839
52893
  :host > span {
52840
52894
  border-radius: 0.3125rem;
52841
52895
  display: inline-flex;
52842
- line-height: 1.25rem;
52843
52896
  }
52844
52897
  :host > span kol-span-wc {
52845
52898
  padding: 0.25rem 0.5rem;
@@ -53068,13 +53121,13 @@ const ZOLLv2 = KoliBri.createTheme("zoll-v2", {
53068
53121
  }
53069
53122
  th[data-sort="sort-NOS"] kol-button::part(icon)::before,
53070
53123
  th[data-sort="sort-undefined"] kol-button::part(icon)::before {
53071
- content: "\f0dc";
53124
+ content: "\\f0dc";
53072
53125
  }
53073
53126
  th[data-sort="sort-ASC"] kol-button::part(icon)::before {
53074
- content: "\f0de";
53127
+ content: "\\f0de";
53075
53128
  }
53076
53129
  th[data-sort="sort-DESC"] kol-button::part(icon)::before {
53077
- content: "\f0dd";
53130
+ content: "\\f0dd";
53078
53131
  }`,
53079
53132
  "KOL-ACCORDION": `:host > div {
53080
53133
  border-color: var(--border-color);
@@ -53114,7 +53167,7 @@ const ZOLLv2 = KoliBri.createTheme("zoll-v2", {
53114
53167
  :host > div.open > kol-heading-wc button kol-icon::part(icon)::before {
53115
53168
  content: "\\f077";
53116
53169
  }
53117
- :host > div.close > kol-heading-wc button kol-icon::part(icon)::before {
53170
+ :host > div:not(.open) > kol-heading-wc button kol-icon::part(icon)::before {
53118
53171
  content: "\\f078";
53119
53172
  }`,
53120
53173
  "KOL-ALERT": `kol-alert-wc {
@@ -53184,7 +53237,7 @@ const ZOLLv2 = KoliBri.createTheme("zoll-v2", {
53184
53237
  display: flex;
53185
53238
  gap: var(--spacing);
53186
53239
  flex-grow: 1;
53187
- align-items: flex-start;
53240
+ align-items: center;
53188
53241
  }
53189
53242
  .msg .heading > div {
53190
53243
  display: flex;
@@ -53264,8 +53317,11 @@ const ZOLLv2 = KoliBri.createTheme("zoll-v2", {
53264
53317
  border-radius: var(--border-radius);
53265
53318
  border-style: solid;
53266
53319
  border-width: 1px;
53320
+ background: #fff;
53267
53321
  }
53268
- :host > div .header {
53322
+ :host > div .header,
53323
+ .content,
53324
+ .footer {
53269
53325
  padding: 1.5rem;
53270
53326
  }`,
53271
53327
  "KOL-BUTTON": `:host > kol-button-wc > button > kol-span-wc,
@@ -53492,27 +53548,18 @@ const ZOLLv2 = KoliBri.createTheme("zoll-v2", {
53492
53548
  padding: 0.75rem 1rem;
53493
53549
  text-decoration: underline;
53494
53550
  }`,
53495
- "KOL-TOAST": `:host > div {
53496
- position: fixed;
53497
- top: 0;
53498
- left: 0;
53499
- width: 100%;
53500
- height: 0;
53501
- z-index: 200;
53502
- }
53503
- :host > div > kol-alert {
53504
- display: block;
53505
- margin: auto;
53506
- padding: 1rem;
53507
- max-width: 750px;
53508
- }
53509
- :host > div > kol-button-wc {
53510
- top: 0;
53511
- position: relative;
53512
- display: block;
53513
- margin: auto;
53514
- width: 1em;
53551
+ "KOL-TOAST-CONTAINER": `:host {
53552
+ top: 1rem;
53553
+ width: 750px;
53554
+ left: 50%;
53555
+ transform: translateX(-50%);
53515
53556
  }`,
53557
+ "KOL-TOAST": `
53558
+ .toast {
53559
+ background: #fff;
53560
+ margin-top: 1rem;
53561
+ }
53562
+ `,
53516
53563
  "KOL-PROGRESS": `svg line:first-child,
53517
53564
  svg circle:first-child {
53518
53565
  stroke: var(--color-neutral);
@@ -53559,6 +53606,13 @@ const ZOLLv2 = KoliBri.createTheme("zoll-v2", {
53559
53606
  kol-input.switch {
53560
53607
  grid-template-columns: calc(13 * var(--spacing)) auto;
53561
53608
  }
53609
+ .button {
53610
+ grid-template-areas:
53611
+ "input label"
53612
+ "hint hint"
53613
+ "error error";
53614
+ gap: 0.5rem 0;
53615
+ }
53562
53616
  kol-input > div.input {
53563
53617
  display: inline-flex;
53564
53618
  order: 1;
@@ -53750,6 +53804,13 @@ const ZOLLv2 = KoliBri.createTheme("zoll-v2", {
53750
53804
  fieldset kol-input {
53751
53805
  order: 2;
53752
53806
  }
53807
+ .radio-input-wrapper {
53808
+ display: flex;
53809
+ align-items: center;
53810
+ }
53811
+ .radio-label {
53812
+ padding-left: 0.5rem;
53813
+ }
53753
53814
  .disabled {
53754
53815
  opacity: 0.33;
53755
53816
  }
@@ -61365,6 +61426,9 @@ const ZOLLv2 = KoliBri.createTheme("zoll-v2", {
61365
61426
  border-color: var(--color-blau-dark);
61366
61427
  color: white;
61367
61428
  cursor: pointer;
61429
+ }`,
61430
+ "KOL-SPLIT-BUTTON": `.popover {
61431
+ background: #fff;
61368
61432
  }`
61369
61433
  });
61370
61434