@push('footer')
<script>
    var dialogSponsor = document.getElementById('dialog-sponsor');
    Livewire.on('open-sponsor-dialog', function() {
        dialogSponsor.showModal();
    });
    Livewire.on('close-sponsor-dialog', function() {
        dialogSponsor.close();
    });
</script>
@endpush
<dialog id="dialog-sponsor" @if ($open) open @endif class="w-full lg:w-1/3 shadow rounded-sm relative">
    @if ($sponsor)
        <div class="flex items-center justify-between shadow">
            <div class="p-4">
                {{$sponsor->name}}
            </div>
            <div class="p-4">
                <button wire:click.prevent="$emit('close-sponsor-dialog')">
                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
                        <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
                    </svg>
                </button>
            </div>
        </div>
        <div class="p-4">
            <div>
                {!! Str::markdown($sponsor->bio) !!}
            </div>
            @if ($sponsor->url)
                <div class="mt-4">
                    <a href="{{$sponsor->url}}" target="_blank" class="bg-techcapital-red font-altgothic uppercase border-2 border-techcapital-red text-white py-2 px-4 rounded-sm">Visit Website</a> 
                </div>
            @endif
        </div>
    @endif
</dialog>