Badge Component

    Badge

    Badge is a simple labeling component. It can be used to add additional information to any content or highlight unread items.

    Element is absolute positioned, so parent should be positioned element. It means parent position should be set to anything except static, e.g. relative, absolute, fixed, or sticky.

    Usage

    import Badge from '@paljs/ui/Badge';

    Badge with default position and status(color):

    <Badge>badge text</Badge>

    For example, badge can be placed into Card header:

      New+99
      Card body.