@govbr-ds/webcomponents 2.0.0-next.14 → 2.0.0-next.15

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 (161) hide show
  1. package/dist/cjs/br-avatar.cjs.entry.js +1 -1
  2. package/dist/cjs/br-avatar.cjs.entry.js.map +1 -1
  3. package/dist/cjs/br-button_2.cjs.entry.js +2 -2
  4. package/dist/cjs/br-button_2.cjs.entry.js.map +1 -1
  5. package/dist/cjs/br-checkbox.cjs.entry.js +1 -1
  6. package/dist/cjs/br-checkbox.cjs.entry.js.map +1 -1
  7. package/dist/cjs/br-dropdown.cjs.entry.js +1 -1
  8. package/dist/cjs/br-dropdown.cjs.entry.js.map +1 -1
  9. package/dist/cjs/br-input.cjs.entry.js +1 -1
  10. package/dist/cjs/br-input.cjs.entry.js.map +1 -1
  11. package/dist/cjs/br-item.cjs.entry.js +2 -2
  12. package/dist/cjs/br-item.cjs.entry.js.map +1 -1
  13. package/dist/cjs/br-list.cjs.entry.js +1 -1
  14. package/dist/cjs/br-list.cjs.entry.js.map +1 -1
  15. package/dist/cjs/br-loading.cjs.entry.js +2 -2
  16. package/dist/cjs/br-loading.cjs.entry.js.map +1 -1
  17. package/dist/cjs/br-message.cjs.entry.js +2 -2
  18. package/dist/cjs/br-message.cjs.entry.js.map +1 -1
  19. package/dist/cjs/br-radio.cjs.entry.js +1 -1
  20. package/dist/cjs/br-radio.cjs.entry.js.map +1 -1
  21. package/dist/cjs/br-switch.cjs.entry.js +2 -2
  22. package/dist/cjs/br-switch.cjs.entry.js.map +1 -1
  23. package/dist/cjs/br-textarea.cjs.entry.js +158 -0
  24. package/dist/cjs/br-textarea.cjs.entry.js.map +1 -0
  25. package/dist/cjs/index-fb4e9eaf.js +4 -0
  26. package/dist/cjs/loader.cjs.js +1 -1
  27. package/dist/cjs/webcomponents.cjs.js +1 -1
  28. package/dist/collection/collection-manifest.json +2 -1
  29. package/dist/collection/components/avatar/avatar.css +54 -1
  30. package/dist/collection/components/button/button.css +61 -1
  31. package/dist/collection/components/checkbox/checkbox.css +54 -1
  32. package/dist/collection/components/dropdown/dropdown.css +54 -1
  33. package/dist/collection/components/icon/icon.css +54 -1
  34. package/dist/collection/components/input/input.css +54 -1
  35. package/dist/collection/components/item/item.css +54 -1
  36. package/dist/collection/components/item/item.js +1 -1
  37. package/dist/collection/components/item/item.js.map +1 -1
  38. package/dist/collection/components/list/list.css +54 -1
  39. package/dist/collection/components/loading/loading.css +61 -1
  40. package/dist/collection/components/loading/loading.js +1 -1
  41. package/dist/collection/components/loading/loading.js.map +1 -1
  42. package/dist/collection/components/message/message.css +54 -1
  43. package/dist/collection/components/message/message.js +1 -1
  44. package/dist/collection/components/message/message.js.map +1 -1
  45. package/dist/collection/components/radio/radio.css +54 -1
  46. package/dist/collection/components/switch/switch.css +54 -1
  47. package/dist/collection/components/switch/switch.js +1 -1
  48. package/dist/collection/components/switch/switch.js.map +1 -1
  49. package/dist/collection/components/textarea/textarea.css +522 -0
  50. package/dist/collection/components/textarea/textarea.js +566 -0
  51. package/dist/collection/components/textarea/textarea.js.map +1 -0
  52. package/dist/collection/pages/textarea/textarea.js +19 -0
  53. package/dist/collection/scripts/menu.js +21 -17
  54. package/dist/components/br-avatar.js +2 -2
  55. package/dist/components/br-avatar.js.map +1 -1
  56. package/dist/components/br-button.js +1 -1
  57. package/dist/components/br-checkbox.js +1 -1
  58. package/dist/components/br-checkbox.js.map +1 -1
  59. package/dist/components/br-dropdown.js +1 -1
  60. package/dist/components/br-dropdown.js.map +1 -1
  61. package/dist/components/br-icon.js +1 -1
  62. package/dist/components/br-input.js +3 -3
  63. package/dist/components/br-input.js.map +1 -1
  64. package/dist/components/br-item.js +2 -2
  65. package/dist/components/br-item.js.map +1 -1
  66. package/dist/components/br-list.js +1 -1
  67. package/dist/components/br-list.js.map +1 -1
  68. package/dist/components/br-loading.js +2 -2
  69. package/dist/components/br-loading.js.map +1 -1
  70. package/dist/components/br-message.js +4 -4
  71. package/dist/components/br-message.js.map +1 -1
  72. package/dist/components/br-radio.js +1 -1
  73. package/dist/components/br-radio.js.map +1 -1
  74. package/dist/components/br-switch.js +2 -2
  75. package/dist/components/br-switch.js.map +1 -1
  76. package/dist/components/br-textarea.d.ts +11 -0
  77. package/dist/components/br-textarea.js +181 -0
  78. package/dist/components/br-textarea.js.map +1 -0
  79. package/dist/components/index.d.ts +2 -0
  80. package/dist/components/index.js +1 -0
  81. package/dist/components/index.js.map +1 -1
  82. package/dist/components/{p-87afe26f.js → p-af0dfebc.js} +2 -2
  83. package/dist/components/{p-87afe26f.js.map → p-af0dfebc.js.map} +1 -1
  84. package/dist/components/p-baa2948a.js +138 -0
  85. package/dist/components/{p-5769e796.js.map → p-baa2948a.js.map} +1 -1
  86. package/dist/esm/br-avatar.entry.js +1 -1
  87. package/dist/esm/br-avatar.entry.js.map +1 -1
  88. package/dist/esm/br-button_2.entry.js +2 -2
  89. package/dist/esm/br-button_2.entry.js.map +1 -1
  90. package/dist/esm/br-checkbox.entry.js +1 -1
  91. package/dist/esm/br-checkbox.entry.js.map +1 -1
  92. package/dist/esm/br-dropdown.entry.js +1 -1
  93. package/dist/esm/br-dropdown.entry.js.map +1 -1
  94. package/dist/esm/br-input.entry.js +1 -1
  95. package/dist/esm/br-input.entry.js.map +1 -1
  96. package/dist/esm/br-item.entry.js +2 -2
  97. package/dist/esm/br-item.entry.js.map +1 -1
  98. package/dist/esm/br-list.entry.js +1 -1
  99. package/dist/esm/br-list.entry.js.map +1 -1
  100. package/dist/esm/br-loading.entry.js +2 -2
  101. package/dist/esm/br-loading.entry.js.map +1 -1
  102. package/dist/esm/br-message.entry.js +2 -2
  103. package/dist/esm/br-message.entry.js.map +1 -1
  104. package/dist/esm/br-radio.entry.js +1 -1
  105. package/dist/esm/br-radio.entry.js.map +1 -1
  106. package/dist/esm/br-switch.entry.js +2 -2
  107. package/dist/esm/br-switch.entry.js.map +1 -1
  108. package/dist/esm/br-textarea.entry.js +154 -0
  109. package/dist/esm/br-textarea.entry.js.map +1 -0
  110. package/dist/esm/index-c7037515.js +4 -0
  111. package/dist/esm/loader.js +1 -1
  112. package/dist/esm/webcomponents.js +1 -1
  113. package/dist/types/components/textarea/textarea.d.ts +157 -0
  114. package/dist/types/components.d.ts +189 -0
  115. package/dist/webcomponents/p-0f8df882.entry.js +2 -0
  116. package/dist/webcomponents/{p-14f1c8e6.entry.js.map → p-0f8df882.entry.js.map} +1 -1
  117. package/dist/webcomponents/p-128b4b58.entry.js +2 -0
  118. package/dist/webcomponents/{p-9dbe247e.entry.js.map → p-128b4b58.entry.js.map} +1 -1
  119. package/dist/webcomponents/p-2bc17aba.entry.js +2 -0
  120. package/dist/webcomponents/p-2bc17aba.entry.js.map +1 -0
  121. package/dist/webcomponents/p-2ff6ee7a.entry.js +13 -0
  122. package/dist/webcomponents/{p-dde91d20.entry.js.map → p-2ff6ee7a.entry.js.map} +1 -1
  123. package/dist/webcomponents/p-4645bc22.entry.js +2 -0
  124. package/dist/webcomponents/p-4645bc22.entry.js.map +1 -0
  125. package/dist/webcomponents/p-4e1a6b1e.entry.js +2 -0
  126. package/dist/webcomponents/{p-8efc22a3.entry.js.map → p-4e1a6b1e.entry.js.map} +1 -1
  127. package/dist/webcomponents/p-53a18892.entry.js +2 -0
  128. package/dist/webcomponents/{p-c36696c6.entry.js.map → p-53a18892.entry.js.map} +1 -1
  129. package/dist/webcomponents/p-6783eb4f.entry.js +2 -0
  130. package/dist/webcomponents/{p-ac16ee58.entry.js.map → p-6783eb4f.entry.js.map} +1 -1
  131. package/dist/webcomponents/p-e1d4a515.entry.js +2 -0
  132. package/dist/webcomponents/p-e1d4a515.entry.js.map +1 -0
  133. package/dist/webcomponents/p-e74737f9.entry.js +2 -0
  134. package/dist/webcomponents/p-e74737f9.entry.js.map +1 -0
  135. package/dist/webcomponents/p-f66d6a1e.entry.js +2 -0
  136. package/dist/webcomponents/p-f66d6a1e.entry.js.map +1 -0
  137. package/dist/webcomponents/p-ffbd85fd.entry.js +2 -0
  138. package/dist/webcomponents/p-ffbd85fd.entry.js.map +1 -0
  139. package/dist/webcomponents/webcomponents.esm.js +1 -1
  140. package/dist/webcomponents/webcomponents.esm.js.map +1 -1
  141. package/hydrate/index.js +196 -22
  142. package/hydrate/index.mjs +196 -22
  143. package/package.json +1 -1
  144. package/vscode-data.json +49 -0
  145. package/dist/components/p-5769e796.js +0 -138
  146. package/dist/webcomponents/p-0f6e2ddc.entry.js +0 -2
  147. package/dist/webcomponents/p-0f6e2ddc.entry.js.map +0 -1
  148. package/dist/webcomponents/p-14f1c8e6.entry.js +0 -2
  149. package/dist/webcomponents/p-198082b6.entry.js +0 -2
  150. package/dist/webcomponents/p-198082b6.entry.js.map +0 -1
  151. package/dist/webcomponents/p-867bba23.entry.js +0 -2
  152. package/dist/webcomponents/p-867bba23.entry.js.map +0 -1
  153. package/dist/webcomponents/p-8efc22a3.entry.js +0 -2
  154. package/dist/webcomponents/p-9dbe247e.entry.js +0 -2
  155. package/dist/webcomponents/p-a5a079d8.entry.js +0 -2
  156. package/dist/webcomponents/p-a5a079d8.entry.js.map +0 -1
  157. package/dist/webcomponents/p-ac16ee58.entry.js +0 -2
  158. package/dist/webcomponents/p-c36696c6.entry.js +0 -2
  159. package/dist/webcomponents/p-dde91d20.entry.js +0 -13
  160. package/dist/webcomponents/p-f01f1e6b.entry.js +0 -2
  161. package/dist/webcomponents/p-f01f1e6b.entry.js.map +0 -1
package/dist/collection/components/avatar/avatar.css CHANGED
@@ -38,7 +38,8 @@ img {
38
38
  }
39
39
 
40
40
  button,
41
- input {
41
+ input,
42
+ textarea {
42
43
  font-family: inherit;
43
44
  font-size: 100%;
44
45
  line-height: var(--font-line-height-medium);
@@ -82,6 +83,10 @@ progress {
82
83
  vertical-align: baseline;
83
84
  }
84
85
 
86
+ textarea {
87
+ overflow: auto;
88
+ }
89
+
85
90
  [type=checkbox],
86
91
  [type=radio] {
87
92
  box-sizing: border-box;
@@ -139,6 +144,17 @@ progress {
139
144
  width: auto;
140
145
  }
141
146
 
147
+ .container {
148
+ --grid-margin: var(--grid-portrait-margin);
149
+ --grid-maxwidth: var(--grid-portrait-maxwidth);
150
+ margin-left: auto;
151
+ margin-right: auto;
152
+ max-width: var(--grid-maxwidth);
153
+ padding-left: var(--grid-margin);
154
+ padding-right: var(--grid-margin);
155
+ width: 100%;
156
+ }
157
+
142
158
  .row {
143
159
  --grid-gutter: var(--grid-portrait-gutter);
144
160
  display: flex;
@@ -148,24 +164,52 @@ progress {
148
164
  }
149
165
 
150
166
  @media (min-width: 576px) {
167
+ .container {
168
+ --grid-margin: var(--grid-tablet-margin);
169
+ }
151
170
  .row {
152
171
  --grid-gutter: var(--grid-tablet-gutter);
153
172
  }
173
+ .container {
174
+ --grid-maxwidth: calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin));
175
+ }
154
176
  }
155
177
  @media (min-width: 992px) {
178
+ .container {
179
+ --grid-margin: var(--grid-tablet-margin);
180
+ }
156
181
  .row {
157
182
  --grid-gutter: var(--grid-tablet-gutter);
158
183
  }
184
+ .container {
185
+ --grid-maxwidth: calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin));
186
+ }
159
187
  }
160
188
  @media (min-width: 1280px) {
189
+ .container {
190
+ --grid-margin: var(--grid-desktop-margin);
191
+ }
161
192
  .row {
162
193
  --grid-gutter: var(--grid-desktop-gutter);
163
194
  }
195
+ .container {
196
+ --grid-maxwidth: calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin));
197
+ }
164
198
  }
165
199
  @media (min-width: 1600px) {
200
+ .container {
201
+ --grid-margin: var(--grid-tv-margin);
202
+ }
166
203
  .row {
167
204
  --grid-gutter: var(--grid-tv-gutter);
168
205
  }
206
+ .container {
207
+ --grid-maxwidth: calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin));
208
+ }
209
+ }
210
+
211
+ .mt-1 {
212
+ margin-top: var(--spacing-scale-half) !important;
169
213
  }
170
214
 
171
215
  .mr-1 {
@@ -180,6 +224,10 @@ progress {
180
224
  margin-bottom: var(--spacing-scale-2x) !important;
181
225
  }
182
226
 
227
+ .pt-half {
228
+ padding-top: var(--spacing-scale-half) !important;
229
+ }
230
+
183
231
  .py-3 {
184
232
  padding-bottom: var(--spacing-scale-2x) !important;
185
233
  padding-top: var(--spacing-scale-2x) !important;
@@ -295,6 +343,7 @@ label,
295
343
  }
296
344
 
297
345
  input,
346
+ textarea,
298
347
  .input {
299
348
  color: var(--color-light);
300
349
  font-size: var(--font-size-scale-up-01);
@@ -338,6 +387,10 @@ code,
338
387
  white-space: nowrap !important;
339
388
  }
340
389
 
390
+ .text-base {
391
+ font-size: var(--font-size-scale-base) !important;
392
+ }
393
+
341
394
  .highlight {
342
395
  background: var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));
343
396
  color: var(--status-highlight-text);
package/dist/collection/components/button/button.css CHANGED
@@ -38,7 +38,8 @@ img {
38
38
  }
39
39
 
40
40
  button,
41
- input {
41
+ input,
42
+ textarea {
42
43
  font-family: inherit;
43
44
  font-size: 100%;
44
45
  line-height: var(--font-line-height-medium);
@@ -82,6 +83,10 @@ progress {
82
83
  vertical-align: baseline;
83
84
  }
84
85
 
86
+ textarea {
87
+ overflow: auto;
88
+ }
89
+
85
90
  [type=checkbox],
86
91
  [type=radio] {
87
92
  box-sizing: border-box;
@@ -139,6 +144,17 @@ progress {
139
144
  width: auto;
140
145
  }
141
146
 
147
+ .container {
148
+ --grid-margin: var(--grid-portrait-margin);
149
+ --grid-maxwidth: var(--grid-portrait-maxwidth);
150
+ margin-left: auto;
151
+ margin-right: auto;
152
+ max-width: var(--grid-maxwidth);
153
+ padding-left: var(--grid-margin);
154
+ padding-right: var(--grid-margin);
155
+ width: 100%;
156
+ }
157
+
142
158
  .row {
143
159
  --grid-gutter: var(--grid-portrait-gutter);
144
160
  display: flex;
@@ -148,24 +164,52 @@ progress {
148
164
  }
149
165
 
150
166
  @media (min-width: 576px) {
167
+ .container {
168
+ --grid-margin: var(--grid-tablet-margin);
169
+ }
151
170
  .row {
152
171
  --grid-gutter: var(--grid-tablet-gutter);
153
172
  }
173
+ .container {
174
+ --grid-maxwidth: calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin));
175
+ }
154
176
  }
155
177
  @media (min-width: 992px) {
178
+ .container {
179
+ --grid-margin: var(--grid-tablet-margin);
180
+ }
156
181
  .row {
157
182
  --grid-gutter: var(--grid-tablet-gutter);
158
183
  }
184
+ .container {
185
+ --grid-maxwidth: calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin));
186
+ }
159
187
  }
160
188
  @media (min-width: 1280px) {
189
+ .container {
190
+ --grid-margin: var(--grid-desktop-margin);
191
+ }
161
192
  .row {
162
193
  --grid-gutter: var(--grid-desktop-gutter);
163
194
  }
195
+ .container {
196
+ --grid-maxwidth: calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin));
197
+ }
164
198
  }
165
199
  @media (min-width: 1600px) {
200
+ .container {
201
+ --grid-margin: var(--grid-tv-margin);
202
+ }
166
203
  .row {
167
204
  --grid-gutter: var(--grid-tv-gutter);
168
205
  }
206
+ .container {
207
+ --grid-maxwidth: calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin));
208
+ }
209
+ }
210
+
211
+ .mt-1 {
212
+ margin-top: var(--spacing-scale-half) !important;
169
213
  }
170
214
 
171
215
  .mr-1 {
@@ -180,6 +224,10 @@ progress {
180
224
  margin-bottom: var(--spacing-scale-2x) !important;
181
225
  }
182
226
 
227
+ .pt-half {
228
+ padding-top: var(--spacing-scale-half) !important;
229
+ }
230
+
183
231
  .py-3 {
184
232
  padding-bottom: var(--spacing-scale-2x) !important;
185
233
  padding-top: var(--spacing-scale-2x) !important;
@@ -295,6 +343,7 @@ label,
295
343
  }
296
344
 
297
345
  input,
346
+ textarea,
298
347
  .input {
299
348
  color: var(--color-light);
300
349
  font-size: var(--font-size-scale-up-01);
@@ -338,6 +387,10 @@ code,
338
387
  white-space: nowrap !important;
339
388
  }
340
389
 
390
+ .text-base {
391
+ font-size: var(--font-size-scale-base) !important;
392
+ }
393
+
341
394
  .highlight {
342
395
  background: var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));
343
396
  color: var(--status-highlight-text);
@@ -661,6 +714,13 @@ a.br-button {
661
714
  animation: fill ease-in-out 2s;
662
715
  transform: rotate(9deg);
663
716
  }
717
+ .loading[data-progress="10"] .br-loading-mask.full,
718
+ .loading[data-progress="10"] .br-loading-fill,
719
+ .br-loading[data-progress="10"] .br-loading-mask.full,
720
+ .br-loading[data-progress="10"] .br-loading-fill {
721
+ animation: fill ease-in-out 2s;
722
+ transform: rotate(18deg);
723
+ }
664
724
  .loading[data-progress="16"] .br-loading-mask.full,
665
725
  .loading[data-progress="16"] .br-loading-fill,
666
726
  .br-loading[data-progress="16"] .br-loading-mask.full,
package/dist/collection/components/checkbox/checkbox.css CHANGED
@@ -38,7 +38,8 @@ img {
38
38
  }
39
39
 
40
40
  button,
41
- input {
41
+ input,
42
+ textarea {
42
43
  font-family: inherit;
43
44
  font-size: 100%;
44
45
  line-height: var(--font-line-height-medium);
@@ -82,6 +83,10 @@ progress {
82
83
  vertical-align: baseline;
83
84
  }
84
85
 
86
+ textarea {
87
+ overflow: auto;
88
+ }
89
+
85
90
  [type=checkbox],
86
91
  [type=radio] {
87
92
  box-sizing: border-box;
@@ -139,6 +144,17 @@ progress {
139
144
  width: auto;
140
145
  }
141
146
 
147
+ .container {
148
+ --grid-margin: var(--grid-portrait-margin);
149
+ --grid-maxwidth: var(--grid-portrait-maxwidth);
150
+ margin-left: auto;
151
+ margin-right: auto;
152
+ max-width: var(--grid-maxwidth);
153
+ padding-left: var(--grid-margin);
154
+ padding-right: var(--grid-margin);
155
+ width: 100%;
156
+ }
157
+
142
158
  .row {
143
159
  --grid-gutter: var(--grid-portrait-gutter);
144
160
  display: flex;
@@ -148,24 +164,52 @@ progress {
148
164
  }
149
165
 
150
166
  @media (min-width: 576px) {
167
+ .container {
168
+ --grid-margin: var(--grid-tablet-margin);
169
+ }
151
170
  .row {
152
171
  --grid-gutter: var(--grid-tablet-gutter);
153
172
  }
173
+ .container {
174
+ --grid-maxwidth: calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin));
175
+ }
154
176
  }
155
177
  @media (min-width: 992px) {
178
+ .container {
179
+ --grid-margin: var(--grid-tablet-margin);
180
+ }
156
181
  .row {
157
182
  --grid-gutter: var(--grid-tablet-gutter);
158
183
  }
184
+ .container {
185
+ --grid-maxwidth: calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin));
186
+ }
159
187
  }
160
188
  @media (min-width: 1280px) {
189
+ .container {
190
+ --grid-margin: var(--grid-desktop-margin);
191
+ }
161
192
  .row {
162
193
  --grid-gutter: var(--grid-desktop-gutter);
163
194
  }
195
+ .container {
196
+ --grid-maxwidth: calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin));
197
+ }
164
198
  }
165
199
  @media (min-width: 1600px) {
200
+ .container {
201
+ --grid-margin: var(--grid-tv-margin);
202
+ }
166
203
  .row {
167
204
  --grid-gutter: var(--grid-tv-gutter);
168
205
  }
206
+ .container {
207
+ --grid-maxwidth: calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin));
208
+ }
209
+ }
210
+
211
+ .mt-1 {
212
+ margin-top: var(--spacing-scale-half) !important;
169
213
  }
170
214
 
171
215
  .mr-1 {
@@ -180,6 +224,10 @@ progress {
180
224
  margin-bottom: var(--spacing-scale-2x) !important;
181
225
  }
182
226
 
227
+ .pt-half {
228
+ padding-top: var(--spacing-scale-half) !important;
229
+ }
230
+
183
231
  .py-3 {
184
232
  padding-bottom: var(--spacing-scale-2x) !important;
185
233
  padding-top: var(--spacing-scale-2x) !important;
@@ -295,6 +343,7 @@ label,
295
343
  }
296
344
 
297
345
  input,
346
+ textarea,
298
347
  .input {
299
348
  color: var(--color-light);
300
349
  font-size: var(--font-size-scale-up-01);
@@ -338,6 +387,10 @@ code,
338
387
  white-space: nowrap !important;
339
388
  }
340
389
 
390
+ .text-base {
391
+ font-size: var(--font-size-scale-base) !important;
392
+ }
393
+
341
394
  .highlight {
342
395
  background: var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));
343
396
  color: var(--status-highlight-text);
package/dist/collection/components/dropdown/dropdown.css CHANGED
@@ -38,7 +38,8 @@ img {
38
38
  }
39
39
 
40
40
  button,
41
- input {
41
+ input,
42
+ textarea {
42
43
  font-family: inherit;
43
44
  font-size: 100%;
44
45
  line-height: var(--font-line-height-medium);
@@ -82,6 +83,10 @@ progress {
82
83
  vertical-align: baseline;
83
84
  }
84
85
 
86
+ textarea {
87
+ overflow: auto;
88
+ }
89
+
85
90
  [type=checkbox],
86
91
  [type=radio] {
87
92
  box-sizing: border-box;
@@ -139,6 +144,17 @@ progress {
139
144
  width: auto;
140
145
  }
141
146
 
147
+ .container {
148
+ --grid-margin: var(--grid-portrait-margin);
149
+ --grid-maxwidth: var(--grid-portrait-maxwidth);
150
+ margin-left: auto;
151
+ margin-right: auto;
152
+ max-width: var(--grid-maxwidth);
153
+ padding-left: var(--grid-margin);
154
+ padding-right: var(--grid-margin);
155
+ width: 100%;
156
+ }
157
+
142
158
  .row {
143
159
  --grid-gutter: var(--grid-portrait-gutter);
144
160
  display: flex;
@@ -148,24 +164,52 @@ progress {
148
164
  }
149
165
 
150
166
  @media (min-width: 576px) {
167
+ .container {
168
+ --grid-margin: var(--grid-tablet-margin);
169
+ }
151
170
  .row {
152
171
  --grid-gutter: var(--grid-tablet-gutter);
153
172
  }
173
+ .container {
174
+ --grid-maxwidth: calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin));
175
+ }
154
176
  }
155
177
  @media (min-width: 992px) {
178
+ .container {
179
+ --grid-margin: var(--grid-tablet-margin);
180
+ }
156
181
  .row {
157
182
  --grid-gutter: var(--grid-tablet-gutter);
158
183
  }
184
+ .container {
185
+ --grid-maxwidth: calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin));
186
+ }
159
187
  }
160
188
  @media (min-width: 1280px) {
189
+ .container {
190
+ --grid-margin: var(--grid-desktop-margin);
191
+ }
161
192
  .row {
162
193
  --grid-gutter: var(--grid-desktop-gutter);
163
194
  }
195
+ .container {
196
+ --grid-maxwidth: calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin));
197
+ }
164
198
  }
165
199
  @media (min-width: 1600px) {
200
+ .container {
201
+ --grid-margin: var(--grid-tv-margin);
202
+ }
166
203
  .row {
167
204
  --grid-gutter: var(--grid-tv-gutter);
168
205
  }
206
+ .container {
207
+ --grid-maxwidth: calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin));
208
+ }
209
+ }
210
+
211
+ .mt-1 {
212
+ margin-top: var(--spacing-scale-half) !important;
169
213
  }
170
214
 
171
215
  .mr-1 {
@@ -180,6 +224,10 @@ progress {
180
224
  margin-bottom: var(--spacing-scale-2x) !important;
181
225
  }
182
226
 
227
+ .pt-half {
228
+ padding-top: var(--spacing-scale-half) !important;
229
+ }
230
+
183
231
  .py-3 {
184
232
  padding-bottom: var(--spacing-scale-2x) !important;
185
233
  padding-top: var(--spacing-scale-2x) !important;
@@ -295,6 +343,7 @@ label,
295
343
  }
296
344
 
297
345
  input,
346
+ textarea,
298
347
  .input {
299
348
  color: var(--color-light);
300
349
  font-size: var(--font-size-scale-up-01);
@@ -338,6 +387,10 @@ code,
338
387
  white-space: nowrap !important;
339
388
  }
340
389
 
390
+ .text-base {
391
+ font-size: var(--font-size-scale-base) !important;
392
+ }
393
+
341
394
  .highlight {
342
395
  background: var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));
343
396
  color: var(--status-highlight-text);
package/dist/collection/components/icon/icon.css CHANGED
@@ -38,7 +38,8 @@ img {
38
38
  }
39
39
 
40
40
  button,
41
- input {
41
+ input,
42
+ textarea {
42
43
  font-family: inherit;
43
44
  font-size: 100%;
44
45
  line-height: var(--font-line-height-medium);
@@ -82,6 +83,10 @@ progress {
82
83
  vertical-align: baseline;
83
84
  }
84
85
 
86
+ textarea {
87
+ overflow: auto;
88
+ }
89
+
85
90
  [type=checkbox],
86
91
  [type=radio] {
87
92
  box-sizing: border-box;
@@ -139,6 +144,17 @@ progress {
139
144
  width: auto;
140
145
  }
141
146
 
147
+ .container {
148
+ --grid-margin: var(--grid-portrait-margin);
149
+ --grid-maxwidth: var(--grid-portrait-maxwidth);
150
+ margin-left: auto;
151
+ margin-right: auto;
152
+ max-width: var(--grid-maxwidth);
153
+ padding-left: var(--grid-margin);
154
+ padding-right: var(--grid-margin);
155
+ width: 100%;
156
+ }
157
+
142
158
  .row {
143
159
  --grid-gutter: var(--grid-portrait-gutter);
144
160
  display: flex;
@@ -148,24 +164,52 @@ progress {
148
164
  }
149
165
 
150
166
  @media (min-width: 576px) {
167
+ .container {
168
+ --grid-margin: var(--grid-tablet-margin);
169
+ }
151
170
  .row {
152
171
  --grid-gutter: var(--grid-tablet-gutter);
153
172
  }
173
+ .container {
174
+ --grid-maxwidth: calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin));
175
+ }
154
176
  }
155
177
  @media (min-width: 992px) {
178
+ .container {
179
+ --grid-margin: var(--grid-tablet-margin);
180
+ }
156
181
  .row {
157
182
  --grid-gutter: var(--grid-tablet-gutter);
158
183
  }
184
+ .container {
185
+ --grid-maxwidth: calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin));
186
+ }
159
187
  }
160
188
  @media (min-width: 1280px) {
189
+ .container {
190
+ --grid-margin: var(--grid-desktop-margin);
191
+ }
161
192
  .row {
162
193
  --grid-gutter: var(--grid-desktop-gutter);
163
194
  }
195
+ .container {
196
+ --grid-maxwidth: calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin));
197
+ }
164
198
  }
165
199
  @media (min-width: 1600px) {
200
+ .container {
201
+ --grid-margin: var(--grid-tv-margin);
202
+ }
166
203
  .row {
167
204
  --grid-gutter: var(--grid-tv-gutter);
168
205
  }
206
+ .container {
207
+ --grid-maxwidth: calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin));
208
+ }
209
+ }
210
+
211
+ .mt-1 {
212
+ margin-top: var(--spacing-scale-half) !important;
169
213
  }
170
214
 
171
215
  .mr-1 {
@@ -180,6 +224,10 @@ progress {
180
224
  margin-bottom: var(--spacing-scale-2x) !important;
181
225
  }
182
226
 
227
+ .pt-half {
228
+ padding-top: var(--spacing-scale-half) !important;
229
+ }
230
+
183
231
  .py-3 {
184
232
  padding-bottom: var(--spacing-scale-2x) !important;
185
233
  padding-top: var(--spacing-scale-2x) !important;
@@ -295,6 +343,7 @@ label,
295
343
  }
296
344
 
297
345
  input,
346
+ textarea,
298
347
  .input {
299
348
  color: var(--color-light);
300
349
  font-size: var(--font-size-scale-up-01);
@@ -338,6 +387,10 @@ code,
338
387
  white-space: nowrap !important;
339
388
  }
340
389
 
390
+ .text-base {
391
+ font-size: var(--font-size-scale-base) !important;
392
+ }
393
+
341
394
  .highlight {
342
395
  background: var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));
343
396
  color: var(--status-highlight-text);
package/dist/collection/components/input/input.css CHANGED
@@ -38,7 +38,8 @@ img {
38
38
  }
39
39
 
40
40
  button,
41
- input {
41
+ input,
42
+ textarea {
42
43
  font-family: inherit;
43
44
  font-size: 100%;
44
45
  line-height: var(--font-line-height-medium);
@@ -82,6 +83,10 @@ progress {
82
83
  vertical-align: baseline;
83
84
  }
84
85
 
86
+ textarea {
87
+ overflow: auto;
88
+ }
89
+
85
90
  [type=checkbox],
86
91
  [type=radio] {
87
92
  box-sizing: border-box;
@@ -139,6 +144,17 @@ progress {
139
144
  width: auto;
140
145
  }
141
146
 
147
+ .container {
148
+ --grid-margin: var(--grid-portrait-margin);
149
+ --grid-maxwidth: var(--grid-portrait-maxwidth);
150
+ margin-left: auto;
151
+ margin-right: auto;
152
+ max-width: var(--grid-maxwidth);
153
+ padding-left: var(--grid-margin);
154
+ padding-right: var(--grid-margin);
155
+ width: 100%;
156
+ }
157
+
142
158
  .row {
143
159
  --grid-gutter: var(--grid-portrait-gutter);
144
160
  display: flex;
@@ -148,24 +164,52 @@ progress {
148
164
  }
149
165
 
150
166
  @media (min-width: 576px) {
167
+ .container {
168
+ --grid-margin: var(--grid-tablet-margin);
169
+ }
151
170
  .row {
152
171
  --grid-gutter: var(--grid-tablet-gutter);
153
172
  }
173
+ .container {
174
+ --grid-maxwidth: calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin));
175
+ }
154
176
  }
155
177
  @media (min-width: 992px) {
178
+ .container {
179
+ --grid-margin: var(--grid-tablet-margin);
180
+ }
156
181
  .row {
157
182
  --grid-gutter: var(--grid-tablet-gutter);
158
183
  }
184
+ .container {
185
+ --grid-maxwidth: calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin));
186
+ }
159
187
  }
160
188
  @media (min-width: 1280px) {
189
+ .container {
190
+ --grid-margin: var(--grid-desktop-margin);
191
+ }
161
192
  .row {
162
193
  --grid-gutter: var(--grid-desktop-gutter);
163
194
  }
195
+ .container {
196
+ --grid-maxwidth: calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin));
197
+ }
164
198
  }
165
199
  @media (min-width: 1600px) {
200
+ .container {
201
+ --grid-margin: var(--grid-tv-margin);
202
+ }
166
203
  .row {
167
204
  --grid-gutter: var(--grid-tv-gutter);
168
205
  }
206
+ .container {
207
+ --grid-maxwidth: calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin));
208
+ }
209
+ }
210
+
211
+ .mt-1 {
212
+ margin-top: var(--spacing-scale-half) !important;
169
213
  }
170
214
 
171
215
  .mr-1 {
@@ -180,6 +224,10 @@ progress {
180
224
  margin-bottom: var(--spacing-scale-2x) !important;
181
225
  }
182
226
 
227
+ .pt-half {
228
+ padding-top: var(--spacing-scale-half) !important;
229
+ }
230
+
183
231
  .py-3 {
184
232
  padding-bottom: var(--spacing-scale-2x) !important;
185
233
  padding-top: var(--spacing-scale-2x) !important;
@@ -295,6 +343,7 @@ label,
295
343
  }
296
344
 
297
345
  input,
346
+ textarea,
298
347
  .input {
299
348
  color: var(--color-light);
300
349
  font-size: var(--font-size-scale-up-01);
@@ -338,6 +387,10 @@ code,
338
387
  white-space: nowrap !important;
339
388
  }
340
389
 
390
+ .text-base {
391
+ font-size: var(--font-size-scale-base) !important;
392
+ }
393
+
341
394
  .highlight {
342
395
  background: var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));
343
396
  color: var(--status-highlight-text);