Alert prebuilt ClassName
Example Alert-danger
Example Alert-success
Example alert-warning
Example alert-primary
<div className="pt-6 pl-2 md:pl-12 lg:pl-24 xl:pl-56 xl:pr-56">
<p className="alert-danger">Example Alert-danger</p>
</div>
<div className="pt-6 pl-2 md:pl-12 lg:pl-24 xl:pl-56 xl:pr-56">
<p className="alert-success">Example Alert-success</p>
</div>
<div className="pt-6 pl-2 md:pl-12 lg:pl-24 xl:pl-56 xl:pr-56">
<p className="alert-warning">Example alert-warning</p>
</div>
<div className="pt-6 pl-2 md:pl-12 lg:pl-24 xl:pl-56 xl:pr-56">
<p className="alert-primary">Example alert-primary</p>
</div>
Example Alert-danger-fill
Example Alert-success-fill
Example alert-warning-fill
Example alert-primary-fill
<div className="pt-6 pl-2 md:pl-12 lg:pl-24 xl:pl-56 xl:pr-56">
<p className="alert-danger-fill">Example Alert-danger-fill</p>
</div>
<div className="pt-6 pl-2 md:pl-12 lg:pl-24 xl:pl-56 xl:pr-56">
<p className="alert-success-fill">Example Alert-success-fill</p>
</div>
<div className="pt-6 pl-2 md:pl-12 lg:pl-24 xl:pl-56 xl:pr-56">
<p className="alert-warning-fill">Example alert-warning-fill</p>
</div>
<div className="pt-6 pl-2 md:pl-12 lg:pl-24 xl:pl-56 xl:pr-56">
<p className="alert-primary-fill">Example alert-primary-fill</p>
</div>
Button prebuilt ClassName
Example normal button
ButtonExample small button-sm
buttonExample large button-lg
Button
<div className="pt-6 pl-3 xl:pl-56 xl:pr-56 flex-col lg:flex-row ">
<div className="pl-2">
<p className="h4 py-7">Example normal<span className="text-red-600"> button</span></p>
<a href="#" className="button bg-white">Button</a>
</div>
<div className="pl-2 xl:pl-6">
<p className="h4 py-7">Example small <span className="text-red-600"> button-sm</span></p>
<a href="#" className="button-sm bg-white">button</a>
</div>
<div className="pl-2 xl:pl-6">
<p className="h4 py-7">Example large <span className="text-red-600"> button-lg</span></p>
<a href="#" className="button-lg bg-white">Button</a>
</div>
</div>