Skip to content

Badge Enhancement #1888

@simeonoff

Description

@simeonoff

Enhance the igc-badge component to include new predefined sizes and a new Dot type, implement an improved outline that does not affect the badge’s inner content, update icon and font sizes, and resolve contrast issues to ensure compliance with WCAG AA accessibility standards, following the latest design handoff.

  1. Add predefined sizes
  • small
  • medium
  • large
  1. Add Dot boolean attribute
    Introduce a new Dot boolean attribute as a minimal badge without any content
    The Dot badge can be of any variant (default, info, success, warning, error)
  2. Improve outline implementation
    Ensure the outline is rendered outside the badge without affecting its internal size or content
  3. Visual and design alignment
    Update icon and font sizes based on the latest Figma handoff
    Verify spacing, padding, and border radius values align with design tokens
    The modifications are valid for all 4 themes.

All details are to be found in the handoff file.

Metadata

Metadata

Assignees

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions