@khipu/design-system 0.2.0-alpha.132 → 0.2.0-alpha.133
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/beercss/khipu-beercss.css +30 -9
- package/dist/beercss/khipu-beercss.min.css +1 -1
- package/dist/beercss/khipu-beercss.scoped.css +30 -9
- package/dist/beercss/khipu-beercss.scoped.min.css +1 -1
- package/dist/beercss/metadata.json +5 -5
- package/dist/index.js +13 -9
- package/dist/index.mjs +13 -9
- package/package.json +1 -1
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
*
|
|
12
12
|
* AUTO-GENERATED FILE - DO NOT EDIT MANUALLY
|
|
13
13
|
* Source: design-system/src/tokens/tokens.json
|
|
14
|
-
* Generated: 2026-07-
|
|
14
|
+
* Generated: 2026-07-21T17:45:24.815Z
|
|
15
15
|
*
|
|
16
16
|
* To regenerate:
|
|
17
17
|
* cd design-system && npm run tokens:generate
|
|
@@ -988,10 +988,12 @@ a.kds-btn {
|
|
|
988
988
|
|
|
989
989
|
/* Spacing - Using design tokens */
|
|
990
990
|
padding: var(--kds-spacing-button-padding); /* 0 16px */
|
|
991
|
-
|
|
992
|
-
|
|
993
|
-
|
|
994
|
-
|
|
991
|
+
/* Respiro vertical solo relevante con label multilinea; en una linea manda min-height. */
|
|
992
|
+
padding-block: var(--kds-spacing-1);
|
|
993
|
+
/* height:auto + min-height (no height fija): si el label envuelve en pantallas
|
|
994
|
+
angostas el botón crece en vez de recortar el texto; min-height ademas impide
|
|
995
|
+
que flex-shrink lo colapse como flex-item en contenedores flex-column. */
|
|
996
|
+
height: auto;
|
|
995
997
|
min-height: var(--kds-spacing-button-min-height); /* 44px */
|
|
996
998
|
|
|
997
999
|
/* Border - Using design token */
|
|
@@ -1187,9 +1189,16 @@ a.kds-btn-error-text:disabled {
|
|
|
1187
1189
|
box-shadow: none;
|
|
1188
1190
|
}
|
|
1189
1191
|
|
|
1192
|
+
/* Label: al envolver en pantallas angostas las lineas quedan parejas y el icono
|
|
1193
|
+
(inline, dentro del label) fluye con el texto en vez de anclarse al borde. */
|
|
1194
|
+
button.kds-btn .kds-btn-label,
|
|
1195
|
+
a.kds-btn .kds-btn-label {
|
|
1196
|
+
text-wrap: balance;
|
|
1197
|
+
}
|
|
1198
|
+
|
|
1190
1199
|
/* Icon wrapper - control size via span container */
|
|
1191
|
-
button.kds-btn
|
|
1192
|
-
a.kds-btn
|
|
1200
|
+
button.kds-btn .kds-icon,
|
|
1201
|
+
a.kds-btn .kds-icon {
|
|
1193
1202
|
min-width: var(--kds-spacing-button-icon-size);
|
|
1194
1203
|
min-height: var(--kds-spacing-button-icon-size);
|
|
1195
1204
|
width: var(--kds-spacing-button-icon-size);
|
|
@@ -1200,10 +1209,22 @@ a.kds-btn > .kds-icon {
|
|
|
1200
1209
|
display: inline-flex;
|
|
1201
1210
|
align-items: center;
|
|
1202
1211
|
justify-content: center;
|
|
1212
|
+
vertical-align: middle;
|
|
1213
|
+
}
|
|
1214
|
+
|
|
1215
|
+
/* El gap del boton no aplica al icono inline: el respiro icono-texto sale del margen. */
|
|
1216
|
+
button.kds-btn .kds-icon-start,
|
|
1217
|
+
a.kds-btn .kds-icon-start {
|
|
1218
|
+
margin-inline-end: var(--kds-spacing-1);
|
|
1219
|
+
}
|
|
1220
|
+
|
|
1221
|
+
button.kds-btn .kds-icon-end,
|
|
1222
|
+
a.kds-btn .kds-icon-end {
|
|
1223
|
+
margin-inline-start: var(--kds-spacing-1);
|
|
1203
1224
|
}
|
|
1204
1225
|
|
|
1205
|
-
button.kds-btn
|
|
1206
|
-
a.kds-btn
|
|
1226
|
+
button.kds-btn .kds-icon > i,
|
|
1227
|
+
a.kds-btn .kds-icon > i {
|
|
1207
1228
|
font-size: var(--kds-spacing-button-icon-size);
|
|
1208
1229
|
min-width: var(--kds-spacing-button-icon-size);
|
|
1209
1230
|
min-height: var(--kds-spacing-button-icon-size);
|