Modal: Custom Button

<button type="button" x-data="{ open: false }" @click="open = ! open" class="btn btn-ghost">
    <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z" />
    </svg>
    <template x-teleport="body">
        <dialog class="modal modal-open " x-show="open" @keyup.escape.window="open = false">
            <div class="modal-box" @click.outside="open = false">
                <h3 class="font-bold text-lg">Congratulations random Internet user!</h3>
                <p class="py-4">You've been selected for a chance to get one year of subscription to use Wikipedia for free!</p>

            </div>
        </dialog>
    </template>
</button>