Match form and card components' "subtle" variant
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 6.9k
- Forks
- 1.1k
- Avg merge
- 1d 7h
- Merged PRs (30d)
- 57
Description
Package
v4.x
Description
Current implementation:
- Card/PageCard "subtle" variant:
bg-elevated/50 ring-default - Form components/Button "subtle" variant:
bg-elevated ring-accented
Request:
- Make these the same, so a "subtle" input or textarea visually aligns with cards of the same variant.
Additional context
I don't have a strong preference for whether subtle inputs inside a subtle card should appear darkened or not, but I think it would look better if an opaque background was used by default, so soft/subtle on soft/subtle would appear "chromeless"
This is currently achievable through build config, but unelegant. As there's no "form-control" base configuration to extend, and as variants are not configurable in UTheme, all related components must be configured.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the Card/PageCard, form component, Button, input, and textarea variant definitions, and review the existing build configuration workaround. Align the subtle styling so form controls visually match cards, then verify that the variants render consistently.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- tailwindcss, typescript
- Domain
- design, frontend
- Issue type
- Feature
- Difficulty
- 2/5
- Estimated time
- Half a day
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 66/100