Skip to content

fix: badges can grow#10005

Open
BF150 wants to merge 4 commits intodevelopfrom
fix/9837-badge-uses-width
Open

fix: badges can grow#10005
BF150 wants to merge 4 commits intodevelopfrom
fix/9837-badge-uses-width

Conversation

@BF150
Copy link
Copy Markdown
Contributor

@BF150 BF150 commented Apr 13, 2026

No description provided.

@BF150 BF150 self-assigned this Apr 13, 2026
@BF150 BF150 added the v4 label Apr 13, 2026
Copy link
Copy Markdown
Contributor

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request modifies the badge component's styling by changing its display property from inline-flex to flex. The review feedback correctly identifies that this change converts the badge into a block-level element, which typically conflicts with the expected inline behavior of a badge component. It is recommended to revert this change to maintain proper layout integration.

/* Visible with forced colors */
outline: transparent solid to-rem(1);
display: inline-flex;
display: flex;
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

Changing display: inline-flex to display: flex makes the badge a block-level element. This causes the component to occupy the full width of its container and start on a new line, which is typically not the expected behavior for a badge. Badges are generally expected to be inline elements. If the goal is to allow the badge to grow in certain contexts, it is recommended to keep inline-flex and manage the growth via the host element's styling (e.g., flex-grow or width) in the parent layout.

Suggested change
display: flex;
display: inline-flex;

@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Apr 13, 2026

🚀 MCP preview deployed to Vercel: https://kolibri-ejk9870bl-public-ui-kolibri-mcp.vercel.app

@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Apr 13, 2026

@BF150 BF150 marked this pull request as ready for review April 14, 2026 06:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Das span-Element im KolBadge nimmt nicht die gesamte Größe des Hosts ein

1 participant