Repository navigation
[FEATURE] UI Customization. Add control-size design tokens - #366
Merged
jgbernalp merged 3 commits intoOct 15, 2026
Merged
Conversation
Add --perses-size-control-{xs,sm,md,lg} (1.5/2/2.5/3rem) to the design
tokens, with TypeScript tokens, types and tests. IconButton uses them for
width/height and Button uses them as min-height so controls of the same size
share a height.
Signed-off-by: Jenny Zhu <jenny.a.zhu@gmail.com>
|
React Doctor found no new issues. 🎉 Reviewed by React Doctor for commit |
This was referenced Oct 14, 2026
Signed-off-by: Gabriel Bernal <gbernal@redhat.com>
Signed-off-by: Gabriel Bernal <gbernal@redhat.com>
jgbernalp
force-pushed
the
zhuje/ui-customization-control-size-tokens
branch
from
October 15, 2026 10:20
a29b19e to
41aaf1b
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Follow-up to the sizing question on #312. Adds a control-size scale to
@perses-dev/design-tokensso controls of the samesizeshare a height.tokens.css,tokens.tsandtypes.ts, with tests.widthandheight(xsgrows from 1rem to 1.5rem, which meets the WCAG 2.5.8 24px minimum target).min-height, so it grows with larger text instead of clipping. Box sizing isborder-boxvia the reset, so the token is the outer height including the 1px border.xs/sm), TextField ([FEATURE] UI Customization. Textfield Component #354), and anindicatorscale for Checkbox/Switch/icons. These follow once this merges.Visual changes to merged components: Button
xsandsmgrow by about 0.25rem,mdandlgchange by about 0.1rem, IconButtonxsgrows by 0.5rem.Screenshots
Not included yet.
Checklist
[<catalog_entry>] <commit message>naming convention using one of thefollowing
catalog_entryvalues:FEATURE,ENHANCEMENT,BUGFIX,BREAKINGCHANGE,DOC,IGNORE.UI Changes
See e2e docs for more details.