Alert

Alert Demo

New message!

You have 1 unread message

Usage

HTML

<div class="alert-green">
  <div class="i-carbon-information" />
  <div>
    <h3 class="font-bold">
      New message!
    </h3>
    <div class="text-xs">
      You have 1 unread message
    </div>
  </div>
</div>

JSX

<div className="alert-green">
  <div className="i-carbon-information" />
  <div>
    <h3 className="font-bold">
      New message!
    </h3>
    <div className="text-xs">
      You have 1 unread message
    </div>
  </div>
</div>

Rules

/^alert-((rose|pink|fuchsia|purple|violet|indigo|blue|sky|cyan|teal|emerald|green|lime|yellow|amber|orange|red|gray|slate|zinc|neutral|stone|light|dark|lightblue|warmgray|truegray|coolgray|bluegray))$/