@i-cell/ids-styles 0.0.70 → 0.0.71

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 (19) hide show
  1. package/dist/checkbox/checkbox-group.css +40 -12
  2. package/dist/checkbox/checkbox-group.min.css +1 -1
  3. package/dist/checkbox/checkbox-group.plugin.js +40 -12
  4. package/dist/checkbox/checkbox.css +6 -0
  5. package/dist/checkbox/checkbox.min.css +1 -1
  6. package/dist/checkbox/checkbox.plugin.js +9 -1
  7. package/dist/components.css +73 -24
  8. package/dist/components.min.css +1 -1
  9. package/dist/components.plugin.js +70 -22
  10. package/dist/dialog/dialog.css +8 -6
  11. package/dist/dialog/dialog.min.css +1 -1
  12. package/dist/dialog/dialog.plugin.js +2 -2
  13. package/dist/radio/radio.css +18 -5
  14. package/dist/radio/radio.min.css +1 -1
  15. package/dist/radio/radio.plugin.js +11 -6
  16. package/dist/side-sheet/side-sheet.css +1 -1
  17. package/dist/side-sheet/side-sheet.min.css +1 -1
  18. package/dist/side-sheet/side-sheet.plugin.js +8 -1
  19. package/package.json +1 -1
package/dist/checkbox/checkbox-group.css CHANGED
@@ -4,7 +4,7 @@
4
4
  justify-content: center;
5
5
  align-items: flex-start;
6
6
  }
7
- .ids-checkbox-group > .ids-checkbox-group__legend > .ids-checkbox-group__legend-label {
7
+ .ids-checkbox-group > .ids-checkbox-group__legend-wrapper > .ids-checkbox-group__legend-label {
8
8
  font-style: normal;
9
9
  }
10
10
  .ids-checkbox-group > .ids-checkbox-group__list {
@@ -22,10 +22,17 @@
22
22
  padding: var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-compact) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-compact);
23
23
  gap: var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-compact);
24
24
  }
25
- .ids-checkbox-group.ids-checkbox-group-compact > .ids-checkbox-group__legend {
25
+ .ids-checkbox-group.ids-checkbox-group-compact > .ids-checkbox-group__legend-wrapper {
26
+ display: flex;
27
+ flex-direction: column;
26
28
  gap: var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-compact);
27
29
  }
28
- .ids-checkbox-group.ids-checkbox-group-compact > .ids-checkbox-group__legend > .ids-checkbox-group__legend-label {
30
+ .ids-checkbox-group.ids-checkbox-group-compact > .ids-checkbox-group__legend-wrapper > .ids-checkbox-group__legend-container {
31
+ display: flex;
32
+ flex-direction: row;
33
+ gap: var(--ids-comp-checkbox-label-size-gap-compact);
34
+ }
35
+ .ids-checkbox-group.ids-checkbox-group-compact > .ids-checkbox-group__legend-wrapper > .ids-checkbox-group__legend-label {
29
36
  font-family: var(--ids-comp-checkbox-group-label-typography-font-family-compact);
30
37
  font-size: var(--ids-comp-checkbox-group-label-typography-font-size-compact);
31
38
  font-weight: var(--ids-comp-checkbox-group-label-typography-font-weight-compact);
@@ -52,10 +59,17 @@
52
59
  padding: var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-comfortable) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-comfortable);
53
60
  gap: var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-comfortable);
54
61
  }
55
- .ids-checkbox-group.ids-checkbox-group-comfortable > .ids-checkbox-group__legend {
62
+ .ids-checkbox-group.ids-checkbox-group-comfortable > .ids-checkbox-group__legend-wrapper {
63
+ display: flex;
64
+ flex-direction: column;
56
65
  gap: var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-comfortable);
57
66
  }
58
- .ids-checkbox-group.ids-checkbox-group-comfortable > .ids-checkbox-group__legend > .ids-checkbox-group__legend-label {
67
+ .ids-checkbox-group.ids-checkbox-group-comfortable > .ids-checkbox-group__legend-wrapper > .ids-checkbox-group__legend-container {
68
+ display: flex;
69
+ flex-direction: row;
70
+ gap: var(--ids-comp-checkbox-label-size-gap-comfortable);
71
+ }
72
+ .ids-checkbox-group.ids-checkbox-group-comfortable > .ids-checkbox-group__legend-wrapper > .ids-checkbox-group__legend-label {
59
73
  font-family: var(--ids-comp-checkbox-group-label-typography-font-family-comfortable);
60
74
  font-size: var(--ids-comp-checkbox-group-label-typography-font-size-comfortable);
61
75
  font-weight: var(--ids-comp-checkbox-group-label-typography-font-weight-comfortable);
@@ -82,10 +96,17 @@
82
96
  padding: var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-spacious) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-spacious);
83
97
  gap: var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-spacious);
84
98
  }
85
- .ids-checkbox-group.ids-checkbox-group-spacious > .ids-checkbox-group__legend {
99
+ .ids-checkbox-group.ids-checkbox-group-spacious > .ids-checkbox-group__legend-wrapper {
100
+ display: flex;
101
+ flex-direction: column;
86
102
  gap: var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-spacious);
87
103
  }
88
- .ids-checkbox-group.ids-checkbox-group-spacious > .ids-checkbox-group__legend > .ids-checkbox-group__legend-label {
104
+ .ids-checkbox-group.ids-checkbox-group-spacious > .ids-checkbox-group__legend-wrapper > .ids-checkbox-group__legend-container {
105
+ display: flex;
106
+ flex-direction: row;
107
+ gap: var(--ids-comp-checkbox-label-size-gap-spacious);
108
+ }
109
+ .ids-checkbox-group.ids-checkbox-group-spacious > .ids-checkbox-group__legend-wrapper > .ids-checkbox-group__legend-label {
89
110
  font-family: var(--ids-comp-checkbox-group-label-typography-font-family-spacious);
90
111
  font-size: var(--ids-comp-checkbox-group-label-typography-font-size-spacious);
91
112
  font-weight: var(--ids-comp-checkbox-group-label-typography-font-weight-spacious);
@@ -112,10 +133,17 @@
112
133
  padding: var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-dense) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-dense);
113
134
  gap: var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-dense);
114
135
  }
115
- .ids-checkbox-group.ids-checkbox-group-dense > .ids-checkbox-group__legend {
136
+ .ids-checkbox-group.ids-checkbox-group-dense > .ids-checkbox-group__legend-wrapper {
137
+ display: flex;
138
+ flex-direction: column;
116
139
  gap: var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-dense);
117
140
  }
118
- .ids-checkbox-group.ids-checkbox-group-dense > .ids-checkbox-group__legend > .ids-checkbox-group__legend-label {
141
+ .ids-checkbox-group.ids-checkbox-group-dense > .ids-checkbox-group__legend-wrapper > .ids-checkbox-group__legend-container {
142
+ display: flex;
143
+ flex-direction: row;
144
+ gap: var(--ids-comp-checkbox-label-size-gap-dense);
145
+ }
146
+ .ids-checkbox-group.ids-checkbox-group-dense > .ids-checkbox-group__legend-wrapper > .ids-checkbox-group__legend-label {
119
147
  font-family: var(--ids-comp-checkbox-group-label-typography-font-family-dense);
120
148
  font-size: var(--ids-comp-checkbox-group-label-typography-font-size-dense);
121
149
  font-weight: var(--ids-comp-checkbox-group-label-typography-font-weight-dense);
@@ -138,12 +166,12 @@
138
166
  padding: var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-y-dense) var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-x-dense);
139
167
  gap: var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-dense);
140
168
  }
141
- .ids-checkbox-group.ids-checkbox-group-light > .ids-checkbox-group__legend > .ids-checkbox-group__legend-label {
169
+ .ids-checkbox-group.ids-checkbox-group-light > .ids-checkbox-group__legend-wrapper > .ids-checkbox-group__legend-label {
142
170
  color: var(--ids-comp-checkbox-label-color-fg-light-default);
143
171
  }
144
- .ids-checkbox-group.ids-checkbox-group-dark > .ids-checkbox-group__legend > .ids-checkbox-group__legend-label {
172
+ .ids-checkbox-group.ids-checkbox-group-dark > .ids-checkbox-group__legend-wrapper > .ids-checkbox-group__legend-label {
145
173
  color: var(--ids-comp-checkbox-label-color-fg-dark-default);
146
174
  }
147
- .ids-checkbox-group.ids-checkbox-group-surface > .ids-checkbox-group__legend > .ids-checkbox-group__legend-label {
175
+ .ids-checkbox-group.ids-checkbox-group-surface > .ids-checkbox-group__legend-wrapper > .ids-checkbox-group__legend-label {
148
176
  color: var(--ids-comp-checkbox-label-color-fg-surface-default);
149
177
  }
package/dist/checkbox/checkbox-group.min.css CHANGED
@@ -1 +1 @@
1
- .ids-checkbox-group{display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.ids-checkbox-group>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label{font-style:normal}.ids-checkbox-group>.ids-checkbox-group__list{display:flex}.ids-checkbox-group.ids-checkbox-group-horizontal>.ids-checkbox-group__list{flex-direction:row;align-items:center}.ids-checkbox-group.ids-checkbox-group-vertical>.ids-checkbox-group__list{flex-direction:column;align-items:flex-start}.ids-checkbox-group.ids-checkbox-group-compact{padding:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-compact) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-compact);gap:var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-compact)}.ids-checkbox-group.ids-checkbox-group-compact>.ids-checkbox-group__legend{gap:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-compact)}.ids-checkbox-group.ids-checkbox-group-compact>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label{font-family:var(--ids-comp-checkbox-group-label-typography-font-family-compact);font-size:var(--ids-comp-checkbox-group-label-typography-font-size-compact);font-weight:var(--ids-comp-checkbox-group-label-typography-font-weight-compact);line-height:var(--ids-comp-checkbox-group-label-typography-line-height-compact);letter-spacing:var(--ids-comp-checkbox-group-label-typography-letter-spacing-compact)}.ids-checkbox-group.ids-checkbox-group-compact.ids-checkbox-group-horizontal.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-y-compact) var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-x-compact);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-compact) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-compact)}.ids-checkbox-group.ids-checkbox-group-compact.ids-checkbox-group-horizontal:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-y-compact) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-x-compact);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-compact) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-compact)}.ids-checkbox-group.ids-checkbox-group-compact.ids-checkbox-group-vertical.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-y-compact) var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-x-compact);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-compact)}.ids-checkbox-group.ids-checkbox-group-compact.ids-checkbox-group-vertical:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-y-compact) var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-x-compact);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-compact)}.ids-checkbox-group.ids-checkbox-group-comfortable{padding:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-comfortable) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-comfortable);gap:var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-comfortable)}.ids-checkbox-group.ids-checkbox-group-comfortable>.ids-checkbox-group__legend{gap:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-comfortable)}.ids-checkbox-group.ids-checkbox-group-comfortable>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label{font-family:var(--ids-comp-checkbox-group-label-typography-font-family-comfortable);font-size:var(--ids-comp-checkbox-group-label-typography-font-size-comfortable);font-weight:var(--ids-comp-checkbox-group-label-typography-font-weight-comfortable);line-height:var(--ids-comp-checkbox-group-label-typography-line-height-comfortable);letter-spacing:var(--ids-comp-checkbox-group-label-typography-letter-spacing-comfortable)}.ids-checkbox-group.ids-checkbox-group-comfortable.ids-checkbox-group-horizontal.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-y-comfortable) var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-x-comfortable);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-comfortable) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-comfortable)}.ids-checkbox-group.ids-checkbox-group-comfortable.ids-checkbox-group-horizontal:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-y-comfortable) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-x-comfortable);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-comfortable) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-comfortable)}.ids-checkbox-group.ids-checkbox-group-comfortable.ids-checkbox-group-vertical.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-y-comfortable) var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-x-comfortable);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-comfortable)}.ids-checkbox-group.ids-checkbox-group-comfortable.ids-checkbox-group-vertical:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-y-comfortable) var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-x-comfortable);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-comfortable)}.ids-checkbox-group.ids-checkbox-group-spacious{padding:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-spacious) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-spacious);gap:var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-spacious)}.ids-checkbox-group.ids-checkbox-group-spacious>.ids-checkbox-group__legend{gap:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-spacious)}.ids-checkbox-group.ids-checkbox-group-spacious>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label{font-family:var(--ids-comp-checkbox-group-label-typography-font-family-spacious);font-size:var(--ids-comp-checkbox-group-label-typography-font-size-spacious);font-weight:var(--ids-comp-checkbox-group-label-typography-font-weight-spacious);line-height:var(--ids-comp-checkbox-group-label-typography-line-height-spacious);letter-spacing:var(--ids-comp-checkbox-group-label-typography-letter-spacing-spacious)}.ids-checkbox-group.ids-checkbox-group-spacious.ids-checkbox-group-horizontal.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-y-spacious) var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-x-spacious);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-spacious) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-spacious)}.ids-checkbox-group.ids-checkbox-group-spacious.ids-checkbox-group-horizontal:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-y-spacious) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-x-spacious);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-spacious) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-spacious)}.ids-checkbox-group.ids-checkbox-group-spacious.ids-checkbox-group-vertical.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-y-spacious) var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-x-spacious);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-spacious)}.ids-checkbox-group.ids-checkbox-group-spacious.ids-checkbox-group-vertical:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-y-spacious) var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-x-spacious);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-spacious)}.ids-checkbox-group.ids-checkbox-group-dense{padding:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-dense) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-dense);gap:var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-dense)}.ids-checkbox-group.ids-checkbox-group-dense>.ids-checkbox-group__legend{gap:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-dense)}.ids-checkbox-group.ids-checkbox-group-dense>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label{font-family:var(--ids-comp-checkbox-group-label-typography-font-family-dense);font-size:var(--ids-comp-checkbox-group-label-typography-font-size-dense);font-weight:var(--ids-comp-checkbox-group-label-typography-font-weight-dense);line-height:var(--ids-comp-checkbox-group-label-typography-line-height-dense);letter-spacing:var(--ids-comp-checkbox-group-label-typography-letter-spacing-dense)}.ids-checkbox-group.ids-checkbox-group-dense.ids-checkbox-group-horizontal.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-y-dense) var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-x-dense);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-dense) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-dense)}.ids-checkbox-group.ids-checkbox-group-dense.ids-checkbox-group-horizontal:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-y-dense) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-x-dense);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-dense) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-dense)}.ids-checkbox-group.ids-checkbox-group-dense.ids-checkbox-group-vertical.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-y-dense) var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-x-dense);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-dense)}.ids-checkbox-group.ids-checkbox-group-dense.ids-checkbox-group-vertical:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-y-dense) var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-x-dense);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-dense)}.ids-checkbox-group.ids-checkbox-group-light>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label{color:var(--ids-comp-checkbox-label-color-fg-light-default)}.ids-checkbox-group.ids-checkbox-group-dark>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label{color:var(--ids-comp-checkbox-label-color-fg-dark-default)}.ids-checkbox-group.ids-checkbox-group-surface>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label{color:var(--ids-comp-checkbox-label-color-fg-surface-default)}
1
+ .ids-checkbox-group{display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.ids-checkbox-group>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label{font-style:normal}.ids-checkbox-group>.ids-checkbox-group__list{display:flex}.ids-checkbox-group.ids-checkbox-group-horizontal>.ids-checkbox-group__list{flex-direction:row;align-items:center}.ids-checkbox-group.ids-checkbox-group-vertical>.ids-checkbox-group__list{flex-direction:column;align-items:flex-start}.ids-checkbox-group.ids-checkbox-group-compact{padding:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-compact) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-compact);gap:var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-compact)}.ids-checkbox-group.ids-checkbox-group-compact>.ids-checkbox-group__legend-wrapper{display:flex;flex-direction:column;gap:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-compact)}.ids-checkbox-group.ids-checkbox-group-compact>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-container{display:flex;flex-direction:row;gap:var(--ids-comp-checkbox-label-size-gap-compact)}.ids-checkbox-group.ids-checkbox-group-compact>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label{font-family:var(--ids-comp-checkbox-group-label-typography-font-family-compact);font-size:var(--ids-comp-checkbox-group-label-typography-font-size-compact);font-weight:var(--ids-comp-checkbox-group-label-typography-font-weight-compact);line-height:var(--ids-comp-checkbox-group-label-typography-line-height-compact);letter-spacing:var(--ids-comp-checkbox-group-label-typography-letter-spacing-compact)}.ids-checkbox-group.ids-checkbox-group-compact.ids-checkbox-group-horizontal.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-y-compact) var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-x-compact);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-compact) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-compact)}.ids-checkbox-group.ids-checkbox-group-compact.ids-checkbox-group-horizontal:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-y-compact) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-x-compact);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-compact) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-compact)}.ids-checkbox-group.ids-checkbox-group-compact.ids-checkbox-group-vertical.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-y-compact) var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-x-compact);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-compact)}.ids-checkbox-group.ids-checkbox-group-compact.ids-checkbox-group-vertical:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-y-compact) var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-x-compact);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-compact)}.ids-checkbox-group.ids-checkbox-group-comfortable{padding:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-comfortable) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-comfortable);gap:var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-comfortable)}.ids-checkbox-group.ids-checkbox-group-comfortable>.ids-checkbox-group__legend-wrapper{display:flex;flex-direction:column;gap:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-comfortable)}.ids-checkbox-group.ids-checkbox-group-comfortable>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-container{display:flex;flex-direction:row;gap:var(--ids-comp-checkbox-label-size-gap-comfortable)}.ids-checkbox-group.ids-checkbox-group-comfortable>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label{font-family:var(--ids-comp-checkbox-group-label-typography-font-family-comfortable);font-size:var(--ids-comp-checkbox-group-label-typography-font-size-comfortable);font-weight:var(--ids-comp-checkbox-group-label-typography-font-weight-comfortable);line-height:var(--ids-comp-checkbox-group-label-typography-line-height-comfortable);letter-spacing:var(--ids-comp-checkbox-group-label-typography-letter-spacing-comfortable)}.ids-checkbox-group.ids-checkbox-group-comfortable.ids-checkbox-group-horizontal.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-y-comfortable) var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-x-comfortable);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-comfortable) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-comfortable)}.ids-checkbox-group.ids-checkbox-group-comfortable.ids-checkbox-group-horizontal:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-y-comfortable) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-x-comfortable);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-comfortable) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-comfortable)}.ids-checkbox-group.ids-checkbox-group-comfortable.ids-checkbox-group-vertical.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-y-comfortable) var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-x-comfortable);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-comfortable)}.ids-checkbox-group.ids-checkbox-group-comfortable.ids-checkbox-group-vertical:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-y-comfortable) var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-x-comfortable);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-comfortable)}.ids-checkbox-group.ids-checkbox-group-spacious{padding:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-spacious) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-spacious);gap:var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-spacious)}.ids-checkbox-group.ids-checkbox-group-spacious>.ids-checkbox-group__legend-wrapper{display:flex;flex-direction:column;gap:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-spacious)}.ids-checkbox-group.ids-checkbox-group-spacious>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-container{display:flex;flex-direction:row;gap:var(--ids-comp-checkbox-label-size-gap-spacious)}.ids-checkbox-group.ids-checkbox-group-spacious>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label{font-family:var(--ids-comp-checkbox-group-label-typography-font-family-spacious);font-size:var(--ids-comp-checkbox-group-label-typography-font-size-spacious);font-weight:var(--ids-comp-checkbox-group-label-typography-font-weight-spacious);line-height:var(--ids-comp-checkbox-group-label-typography-line-height-spacious);letter-spacing:var(--ids-comp-checkbox-group-label-typography-letter-spacing-spacious)}.ids-checkbox-group.ids-checkbox-group-spacious.ids-checkbox-group-horizontal.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-y-spacious) var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-x-spacious);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-spacious) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-spacious)}.ids-checkbox-group.ids-checkbox-group-spacious.ids-checkbox-group-horizontal:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-y-spacious) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-x-spacious);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-spacious) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-spacious)}.ids-checkbox-group.ids-checkbox-group-spacious.ids-checkbox-group-vertical.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-y-spacious) var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-x-spacious);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-spacious)}.ids-checkbox-group.ids-checkbox-group-spacious.ids-checkbox-group-vertical:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-y-spacious) var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-x-spacious);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-spacious)}.ids-checkbox-group.ids-checkbox-group-dense{padding:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-dense) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-dense);gap:var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-dense)}.ids-checkbox-group.ids-checkbox-group-dense>.ids-checkbox-group__legend-wrapper{display:flex;flex-direction:column;gap:var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-dense)}.ids-checkbox-group.ids-checkbox-group-dense>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-container{display:flex;flex-direction:row;gap:var(--ids-comp-checkbox-label-size-gap-dense)}.ids-checkbox-group.ids-checkbox-group-dense>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label{font-family:var(--ids-comp-checkbox-group-label-typography-font-family-dense);font-size:var(--ids-comp-checkbox-group-label-typography-font-size-dense);font-weight:var(--ids-comp-checkbox-group-label-typography-font-weight-dense);line-height:var(--ids-comp-checkbox-group-label-typography-line-height-dense);letter-spacing:var(--ids-comp-checkbox-group-label-typography-letter-spacing-dense)}.ids-checkbox-group.ids-checkbox-group-dense.ids-checkbox-group-horizontal.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-y-dense) var(--ids-comp-checkbox-group-horizontal-fieldset-list-indeterminated-size-padding-x-dense);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-dense) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-dense)}.ids-checkbox-group.ids-checkbox-group-dense.ids-checkbox-group-horizontal:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-y-dense) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-padding-x-dense);gap:var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-y-dense) var(--ids-comp-checkbox-group-horizontal-fieldset-list-size-gap-x-dense)}.ids-checkbox-group.ids-checkbox-group-dense.ids-checkbox-group-vertical.ids-checkbox-group-indeterminated .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-y-dense) var(--ids-comp-checkbox-group-vertical-fieldset-list-indeterminated-size-padding-x-dense);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-dense)}.ids-checkbox-group.ids-checkbox-group-dense.ids-checkbox-group-vertical:not(.ids-checkbox-group-indeterminated) .ids-checkbox-group__list{padding:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-y-dense) var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-x-dense);gap:var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-dense)}.ids-checkbox-group.ids-checkbox-group-light>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label{color:var(--ids-comp-checkbox-label-color-fg-light-default)}.ids-checkbox-group.ids-checkbox-group-dark>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label{color:var(--ids-comp-checkbox-label-color-fg-dark-default)}.ids-checkbox-group.ids-checkbox-group-surface>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label{color:var(--ids-comp-checkbox-label-color-fg-surface-default)}
package/dist/checkbox/checkbox-group.plugin.js CHANGED
@@ -3,7 +3,7 @@ module.exports = function CheckboxGroupPlugin() {
3
3
  return function ({ addComponents }) {
4
4
  const cssObj = {
5
5
  '.ids-checkbox-group': { display: 'flex', flexDirection: 'column', justifyContent: 'center', alignItems: 'flex-start' },
6
- '.ids-checkbox-group>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label': { fontStyle: 'normal' },
6
+ '.ids-checkbox-group>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label': { fontStyle: 'normal' },
7
7
  '.ids-checkbox-group>.ids-checkbox-group__list': { display: 'flex' },
8
8
  '.ids-checkbox-group.ids-checkbox-group-horizontal>.ids-checkbox-group__list': { flexDirection: 'row', alignItems: 'center' },
9
9
  '.ids-checkbox-group.ids-checkbox-group-vertical>.ids-checkbox-group__list': { flexDirection: 'column', alignItems: 'flex-start' },
@@ -12,10 +12,17 @@ module.exports = function CheckboxGroupPlugin() {
12
12
  'var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-compact) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-compact)',
13
13
  gap: 'var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-compact)',
14
14
  },
15
- '.ids-checkbox-group.ids-checkbox-group-compact>.ids-checkbox-group__legend': {
15
+ '.ids-checkbox-group.ids-checkbox-group-compact>.ids-checkbox-group__legend-wrapper': {
16
+ display: 'flex',
17
+ flexDirection: 'column',
16
18
  gap: 'var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-compact)',
17
19
  },
18
- '.ids-checkbox-group.ids-checkbox-group-compact>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label': {
20
+ '.ids-checkbox-group.ids-checkbox-group-compact>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-container': {
21
+ display: 'flex',
22
+ flexDirection: 'row',
23
+ gap: 'var(--ids-comp-checkbox-label-size-gap-compact)',
24
+ },
25
+ '.ids-checkbox-group.ids-checkbox-group-compact>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label': {
19
26
  fontFamily: 'var(--ids-comp-checkbox-group-label-typography-font-family-compact)',
20
27
  fontSize: 'var(--ids-comp-checkbox-group-label-typography-font-size-compact)',
21
28
  fontWeight: 'var(--ids-comp-checkbox-group-label-typography-font-weight-compact)',
@@ -51,10 +58,17 @@ module.exports = function CheckboxGroupPlugin() {
51
58
  'var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-comfortable) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-comfortable)',
52
59
  gap: 'var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-comfortable)',
53
60
  },
54
- '.ids-checkbox-group.ids-checkbox-group-comfortable>.ids-checkbox-group__legend': {
61
+ '.ids-checkbox-group.ids-checkbox-group-comfortable>.ids-checkbox-group__legend-wrapper': {
62
+ display: 'flex',
63
+ flexDirection: 'column',
55
64
  gap: 'var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-comfortable)',
56
65
  },
57
- '.ids-checkbox-group.ids-checkbox-group-comfortable>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label': {
66
+ '.ids-checkbox-group.ids-checkbox-group-comfortable>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-container': {
67
+ display: 'flex',
68
+ flexDirection: 'row',
69
+ gap: 'var(--ids-comp-checkbox-label-size-gap-comfortable)',
70
+ },
71
+ '.ids-checkbox-group.ids-checkbox-group-comfortable>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label': {
58
72
  fontFamily: 'var(--ids-comp-checkbox-group-label-typography-font-family-comfortable)',
59
73
  fontSize: 'var(--ids-comp-checkbox-group-label-typography-font-size-comfortable)',
60
74
  fontWeight: 'var(--ids-comp-checkbox-group-label-typography-font-weight-comfortable)',
@@ -90,10 +104,17 @@ module.exports = function CheckboxGroupPlugin() {
90
104
  'var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-spacious) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-spacious)',
91
105
  gap: 'var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-spacious)',
92
106
  },
93
- '.ids-checkbox-group.ids-checkbox-group-spacious>.ids-checkbox-group__legend': {
107
+ '.ids-checkbox-group.ids-checkbox-group-spacious>.ids-checkbox-group__legend-wrapper': {
108
+ display: 'flex',
109
+ flexDirection: 'column',
94
110
  gap: 'var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-spacious)',
95
111
  },
96
- '.ids-checkbox-group.ids-checkbox-group-spacious>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label': {
112
+ '.ids-checkbox-group.ids-checkbox-group-spacious>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-container': {
113
+ display: 'flex',
114
+ flexDirection: 'row',
115
+ gap: 'var(--ids-comp-checkbox-label-size-gap-spacious)',
116
+ },
117
+ '.ids-checkbox-group.ids-checkbox-group-spacious>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label': {
97
118
  fontFamily: 'var(--ids-comp-checkbox-group-label-typography-font-family-spacious)',
98
119
  fontSize: 'var(--ids-comp-checkbox-group-label-typography-font-size-spacious)',
99
120
  fontWeight: 'var(--ids-comp-checkbox-group-label-typography-font-weight-spacious)',
@@ -129,10 +150,17 @@ module.exports = function CheckboxGroupPlugin() {
129
150
  'var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-y-dense) var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-padding-x-dense)',
130
151
  gap: 'var(--ids-comp-checkbox-group-vertical-fieldset-size-gap-dense)',
131
152
  },
132
- '.ids-checkbox-group.ids-checkbox-group-dense>.ids-checkbox-group__legend': {
153
+ '.ids-checkbox-group.ids-checkbox-group-dense>.ids-checkbox-group__legend-wrapper': {
154
+ display: 'flex',
155
+ flexDirection: 'column',
133
156
  gap: 'var(--ids-comp-checkbox-group-vertical-fieldset-legend-size-gap-dense)',
134
157
  },
135
- '.ids-checkbox-group.ids-checkbox-group-dense>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label': {
158
+ '.ids-checkbox-group.ids-checkbox-group-dense>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-container': {
159
+ display: 'flex',
160
+ flexDirection: 'row',
161
+ gap: 'var(--ids-comp-checkbox-label-size-gap-dense)',
162
+ },
163
+ '.ids-checkbox-group.ids-checkbox-group-dense>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label': {
136
164
  fontFamily: 'var(--ids-comp-checkbox-group-label-typography-font-family-dense)',
137
165
  fontSize: 'var(--ids-comp-checkbox-group-label-typography-font-size-dense)',
138
166
  fontWeight: 'var(--ids-comp-checkbox-group-label-typography-font-weight-dense)',
@@ -163,13 +191,13 @@ module.exports = function CheckboxGroupPlugin() {
163
191
  'var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-y-dense) var(--ids-comp-checkbox-group-vertical-fieldset-list-size-padding-x-dense)',
164
192
  gap: 'var(--ids-comp-checkbox-group-vertical-fieldset-list-size-gap-dense)',
165
193
  },
166
- '.ids-checkbox-group.ids-checkbox-group-light>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label': {
194
+ '.ids-checkbox-group.ids-checkbox-group-light>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label': {
167
195
  color: 'var(--ids-comp-checkbox-label-color-fg-light-default)',
168
196
  },
169
- '.ids-checkbox-group.ids-checkbox-group-dark>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label': {
197
+ '.ids-checkbox-group.ids-checkbox-group-dark>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label': {
170
198
  color: 'var(--ids-comp-checkbox-label-color-fg-dark-default)',
171
199
  },
172
- '.ids-checkbox-group.ids-checkbox-group-surface>.ids-checkbox-group__legend>.ids-checkbox-group__legend-label': {
200
+ '.ids-checkbox-group.ids-checkbox-group-surface>.ids-checkbox-group__legend-wrapper>.ids-checkbox-group__legend-label': {
173
201
  color: 'var(--ids-comp-checkbox-label-color-fg-surface-default)',
174
202
  },
175
203
  };
package/dist/checkbox/checkbox.css CHANGED
@@ -49,6 +49,8 @@
49
49
  }
50
50
  .ids-checkbox .ids-checkbox__label-wrapper .ids-checkbox__label-container {
51
51
  text-align: start;
52
+ display: flex;
53
+ flex-direction: row;
52
54
  }
53
55
  .ids-checkbox .ids-checkbox__label-wrapper .ids-checkbox__label-container .ids-checkbox__label {
54
56
  font-style: normal;
@@ -97,6 +99,7 @@
97
99
  letter-spacing: var(--ids-comp-checkbox-label-typography-letter-spacing-compact);
98
100
  font-size: var(--ids-comp-checkbox-label-typography-font-size-compact);
99
101
  line-height: var(--ids-comp-checkbox-label-typography-line-height-compact);
102
+ gap: var(--ids-comp-checkbox-label-size-gap-compact);
100
103
  }
101
104
  .ids-checkbox.ids-checkbox-comfortable {
102
105
  padding: var(--ids-comp-checkbox-container-size-padding-y-comfortable) var(--ids-comp-checkbox-container-size-padding-x-comfortable);
@@ -139,6 +142,7 @@
139
142
  letter-spacing: var(--ids-comp-checkbox-label-typography-letter-spacing-comfortable);
140
143
  font-size: var(--ids-comp-checkbox-label-typography-font-size-comfortable);
141
144
  line-height: var(--ids-comp-checkbox-label-typography-line-height-comfortable);
145
+ gap: var(--ids-comp-checkbox-label-size-gap-comfortable);
142
146
  }
143
147
  .ids-checkbox.ids-checkbox-spacious {
144
148
  padding: var(--ids-comp-checkbox-container-size-padding-y-spacious) var(--ids-comp-checkbox-container-size-padding-x-spacious);
@@ -181,6 +185,7 @@
181
185
  letter-spacing: var(--ids-comp-checkbox-label-typography-letter-spacing-spacious);
182
186
  font-size: var(--ids-comp-checkbox-label-typography-font-size-spacious);
183
187
  line-height: var(--ids-comp-checkbox-label-typography-line-height-spacious);
188
+ gap: var(--ids-comp-checkbox-label-size-gap-spacious);
184
189
  }
185
190
  .ids-checkbox.ids-checkbox-dense {
186
191
  padding: var(--ids-comp-checkbox-container-size-padding-y-dense) var(--ids-comp-checkbox-container-size-padding-x-dense);
@@ -223,6 +228,7 @@
223
228
  letter-spacing: var(--ids-comp-checkbox-label-typography-letter-spacing-dense);
224
229
  font-size: var(--ids-comp-checkbox-label-typography-font-size-dense);
225
230
  line-height: var(--ids-comp-checkbox-label-typography-line-height-dense);
231
+ gap: var(--ids-comp-checkbox-label-size-gap-dense);
226
232
  }
227
233
  .ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):not(:checked):not(:indeterminate):not([aria-readonly=true]) {
228
234
  border-color: var(--ids-comp-checkbox-input-unselected-color-border-light-hovered);