<div class="card mx-4 my-4 z-0 ">
    <link href="{{ asset('css/pages/patch.css') }}" rel="stylesheet"> 
    <div wire:loading.class="flex" wire:loading.class.remove="hidden"
        class="absolute inset-0 items-center justify-center z-50 bg-slate-50 dark:bg-navy-900 hidden">
        <div class="flex justify-center items-center ">
            <div class="animate-spin rounded-full h-32 w-32 border-t-2 border-b-2 border-blue-500"></div>
        </div>
    </div>

    {{-- end loading --}}
    <div wire:loading.remove>
        @if ($currentContent === 'Role')
            <livewire:pages.role.role-index />
        @elseif ($currentContent === 'User')
            <livewire:pages.user.user-index />
        @elseif ($currentContent === 'SendPatch')
            <livewire:pages.send-patch.send-patch />
        @elseif ($currentContent === 'Patch')
            <livewire:pages.patch.patch-index />
            @elseif ($currentContent === 'Parameter')
            <livewire:pages.parameter.parameter-index />    
        @else
            @livewire('code-comparer')
        @endif
    </div>
</div>
