@marianmeres/stuic 3.102.0 → 3.103.0
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.
|
@@ -389,30 +389,36 @@
|
|
|
389
389
|
============================================================================ */
|
|
390
390
|
.stuic-button[data-aspect1] {
|
|
391
391
|
aspect-ratio: 1;
|
|
392
|
-
justify-items: center;
|
|
393
392
|
}
|
|
394
393
|
|
|
394
|
+
/*
|
|
395
|
+
* Declare both dimensions instead of deriving the square from aspect-ratio +
|
|
396
|
+
* min-* on a shrink-to-fit inline-flex box. WebKit (iOS Safari) resolves the
|
|
397
|
+
* cross-axis from content width before enforcing min-width, which squeezed
|
|
398
|
+
* icon buttons into a vertical ellipse. Fixed width == height removes that
|
|
399
|
+
* derivation, so every engine renders a true square/circle.
|
|
400
|
+
*/
|
|
395
401
|
.stuic-button[data-aspect1][data-size="sm"] {
|
|
396
|
-
|
|
397
|
-
|
|
402
|
+
width: var(--stuic-button-min-height-sm);
|
|
403
|
+
height: var(--stuic-button-min-height-sm);
|
|
398
404
|
padding: var(--stuic-button-padding-y-sm);
|
|
399
405
|
}
|
|
400
406
|
|
|
401
407
|
.stuic-button[data-aspect1][data-size="md"] {
|
|
402
|
-
|
|
403
|
-
|
|
408
|
+
width: var(--stuic-button-min-height-md);
|
|
409
|
+
height: var(--stuic-button-min-height-md);
|
|
404
410
|
padding: var(--stuic-button-padding-y-md);
|
|
405
411
|
}
|
|
406
412
|
|
|
407
413
|
.stuic-button[data-aspect1][data-size="lg"] {
|
|
408
|
-
|
|
409
|
-
|
|
414
|
+
width: var(--stuic-button-min-height-lg);
|
|
415
|
+
height: var(--stuic-button-min-height-lg);
|
|
410
416
|
padding: var(--stuic-button-padding-y-lg);
|
|
411
417
|
}
|
|
412
418
|
|
|
413
419
|
.stuic-button[data-aspect1][data-size="xl"] {
|
|
414
|
-
|
|
415
|
-
|
|
420
|
+
width: var(--stuic-button-min-height-xl);
|
|
421
|
+
height: var(--stuic-button-min-height-xl);
|
|
416
422
|
padding: var(--stuic-button-padding-y-xl);
|
|
417
423
|
}
|
|
418
424
|
|