Alert With action
Alert With action
=
<div>
<div class="flex rounded-md bg-green-50 p-4 text-sm text-green-500" x-cloak x-show="showAlert" x-data="{ showAlert: true }">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="mr-3 h-5 w-5 flex-shrink-0">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z" clip-rule="evenodd" />
</svg>
<div>
<h4 class="font-bold">Success alert</h4>
<div class="mt-1">Lorem ipsum dolor sit amet. Internos reprehenderit perspiciatis commodi et omnis impedit.</div>
<div class="mt-2 flex space-x-4">
<button class="inline-block font-bold leading-loose">View Details</button>
<button class="inline-block font-bold leading-loose" x-on:click="showAlert = false">Dismiss</button>
</div>
</div>
</div>
</div>