Overview

When a component has a long name, the text overflows the bounds of its badge.

Steps to reproduce:

  1. Create or select a component with a long name.
  2. View the component's badge in the UI by hovering a component.
  3. Observe that the text overflows beyond the intended badge boundaries.

Proposed resolution

User interface changes

CommentFileSizeAuthor
Screenshot 2025-03-21 at 2.34.02 PM.png38.35 KBlauriii

Issue fork experience_builder-3514653

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

lauriii created an issue. See original summary.

meghasharma’s picture

meghasharma commented
Assigned: Unassigned » meghasharma

Working on this

meghasharma opened merge request !813

meghasharma’s picture

meghasharma commented
Assigned: meghasharma » Unassigned
Status: Active » Needs review

Fixed the issue where long component names were overflowing the badge. Now, the text stays within bounds and displays correctly. Ready for review.

omkar-pd’s picture

omkar-pd commented
Status: Needs review » Needs work

stylelint failed.

meghasharma’s picture

meghasharma commented
Assigned: Unassigned » meghasharma
meghasharma’s picture

meghasharma commented
Assigned: meghasharma » Unassigned
Status: Needs work » Needs review

Fixed stylelint.

jessebaker made their first commit to this issue’s fork.

jessebaker’s picture

jessebaker commented
Status: Needs review » Fixed

Thanks! Merged

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.