mirror of
https://github.com/lrnselfreliance/wrolpi.git
synced 2026-10-26 19:01:39 -04:00
The Details/Open pair on every archive card came out 36px beside 28px.
Mantine gives ActionIcon a size scale unrelated to Button's, and defaults
the two differently:
size xs sm md lg xl default
Button 30 36 42 50 60 sm (36)
ActionIcon 18 22 28 34 44 md (28)
So the two never matched, at any size, and every toolbar mixing them was
ragged -- the archive card is just where it shows most.
Mantine already ships the aligned scale as `--ai-size-input-*`, for an
ActionIcon standing beside an Input; those five values are identical to
`--button-height-*`. ui.css points one at the other, which fixes every
size at once including ones no call site uses yet, and IconButton now
defaults to `sm` like Button.
Both halves are needed and both are proven so: dropping just the `sm`
remap reddens the default and `sm` cases while xs/md/lg/xl stay green;
reverting just the default reddens the default case alone, at 42 vs 36 --
the mismatch inverted rather than fixed.
A further test pins the direction. The pair could also be squared up by
cutting the labelled button down to 28px, which would be the wrong fix.
Gallery gains a row of Button/IconButton pairs at all five sizes.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
|
||
|---|---|---|
| .. | ||
| api | ||
| components | ||
| contexts | ||
| hooks | ||
| themes | ||
| types | ||
| api.js | ||
| App.css | ||
| App.js | ||
| DashboardPage.js | ||
| DashboardPage.test.js | ||
| Events.js | ||
| index.css | ||
| index.js | ||
| logo.svg | ||
| reportWebVitals.js | ||
| semantic-baseline.json | ||
| semantic-baseline.test.js | ||
| setupTests.js | ||
| Tags.cy.js | ||
| Tags.js | ||
| Tags.test.js | ||
| test-fixtures.js | ||
| test-fixtures.test.js | ||
| test-utils.js | ||
| test-utils.test.js | ||