Badge
Introduction
Badges are primarily used to quickly convey information
without taking up space on screen
They can be used to show a user's status or as a notification
badge along with a number count.
Badge on Icons
Badges are primarily used with icons to show a count of items
already collected.
You can position the badges either on the right or left side,
using
top-right
or
top-left
respectively.
Icons are imported and used from
FontAwesome
.
Badge on Avatars
Badge on avatars can be used to show the status of the user,
whether they are online or offline.
The badges can be positioned on either four corners of the
avatar.
There are also 4 different sizes of badges, using classes
badge-dot-sm
,
badge-dot-md
,
badge-dot-lg
&
badge-dot-xl
.
Badge as Border on Avatar
A twist on the typical badge on avatar, this allows user to
show their status by the color of the border surrounding their
avatar.
The same 3 colors are offered just like regular avatar badges.
