fix(summary-chip): make single-digit chips circular#2387
fix(summary-chip): make single-digit chips circular#2387chintankavathia wants to merge 1 commit into
Conversation
There was a problem hiding this comment.
Code Review
This pull request updates the styling of the .chip class in si-summary-chip.component.scss by centering its content and defining a minimum inline size. The reviewer suggested also setting a fixed block-size to match the min-inline-size to ensure the chip remains perfectly circular regardless of its content's font size or line height.
Important
The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.
6e09967 to
74fbad2
Compare
|
Caution The consumer version of Gemini Code Assist on GitHub has been sunset. All code review activity has officially ceased. |
| min-inline-size: calc(1lh + 2 * map.get(variables.$spacers, 4)); | ||
| border: 1px solid variables.$element-ui-3; | ||
| border-radius: map.get(variables.$spacers, 6); | ||
| border-radius: 1rem; |
There was a problem hiding this comment.
Not really a different, but should guard against eventual changes in the line-height.
| border-radius: 1rem; | |
| border-radius: 1lh; |
currently there is deviation between badge and summary chip when having single digit value.
Documentation.
Examples.
Dashboards Demo.
Playwright report.
Coverage Reports: