This sample demonstrates the default functionalities of the badge. To apply the badge, add
.e-badge
class to the element.
The Badge is a component which is developed in pure CSS and designed in
em
relative units, so that badge will always be in relevant to the parent and makes the badge super easy to customize.
For Ex to increase the size of the badge, just increase the font-size the width and height will be adjusted.
There are 6 different types of badge. they are explained below.
.e-badge
class to the element.
.e-badge-notification
along with
.e-badge
and also make the wrapper element
position: relative
.
.e-badge-circle
class along with
.e-badge
.
.e-badge-pill
class along with
.e-badge
.
.e-badge-dot
class along with
.e-badge
and
also make the wrapper element
position: relative
.
The badge component supports two position. This is applicable only to Notification and dot badge.
.e-.badge-bottom
class along with
.e-badge
.