Skip to content

Commit 67da2f4

Browse files
authored
style(badge): added a min-inline-size (#4715)
especially for single character contents
1 parent 0b90481 commit 67da2f4

File tree

6 files changed

+8
-0
lines changed

6 files changed

+8
-0
lines changed
Loading
397 Bytes
Loading
277 Bytes
Loading
351 Bytes
Loading
Loading

packages/components/src/components/badge/badge.scss

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,14 @@
5555
inline-size: fit-content;
5656
font-weight: 700;
5757

58+
// Added a minimum inline size, especially for single-character content, to ensure that it won't be any narrower than a circle.
59+
box-sizing: content-box;
60+
61+
&:not(:empty) {
62+
min-inline-size: calc(1.4em - 2 * #{variables.$db-spacing-fixed-2xs});
63+
}
64+
65+
// Icon specific settings
5866
&:has(.db-icon) {
5967
padding: variables.$db-spacing-fixed-3xs;
6068
}

0 commit comments

Comments
 (0)