ui5-button: Height does not match spec
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 1.8k
- Forks
- 285
- Avg merge
- 3d 2h
- Merged PRs (30d)
- 59
Description
Bug Description
ui5-button is 26px heigh, but it should be 32px.
Affected Component
No response
Expected Behaviour
A lot of Fiori controls are defined (in compact) as being 1.625rem (26px) centered in a 2rem (32px) rectangle, creating a visual padding of 3px top/bottom.
Input field are like this and implemented correctly.
But the ui5-button is missing this important feature, leading to alignment issues and controls that are visually stuck to each other.
Isolated Example
No response
Steps to Reproduce
...
Log Output, Stack Trace or Screenshots
No response
Priority
No response
UI5 Web Components Version
2.25.0
Browser
Chrome
Operating System
No response
Additional Context
No response
Organization
No response
Declaration
- I’m not disclosing any internal or sensitive information.
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 by locating the ui5-button implementation and its compact sizing styles, then compare its height behavior with the input field mentioned in the report. The work is done when the button matches the specified 32px rectangle with the intended visual padding and no longer causes alignment issues.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, typescript
- Domain
- design, frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 68/100