@extends('layouts.admin')
@section('title', 'Menus')
@section('content')
<form method="post" action="{{ route('admin.menus.update') }}" class="grid max-w-3xl gap-6">
    @csrf
    @foreach($menus as $menu)
        <fieldset class="rounded-xl border border-line bg-white p-4">
            <legend class="px-1 font-semibold">{{ $menu->name }}</legend>
            @foreach($menu->items as $item)
                <div class="mt-3 grid gap-2 sm:grid-cols-[1fr_1fr_80px]">
                    <input type="hidden" name="items[{{ $item->id }}][id]" value="{{ $item->id }}">
                    <input name="items[{{ $item->id }}][label]" value="{{ $item->label }}" class="rounded border border-line px-3 py-2 text-sm">
                    <input name="items[{{ $item->id }}][url]" value="{{ $item->url }}" class="rounded border border-line px-3 py-2 text-sm">
                    <input name="items[{{ $item->id }}][sort]" value="{{ $item->sort }}" class="rounded border border-line px-3 py-2 text-sm">
                </div>
            @endforeach
        </fieldset>
    @endforeach
    <button class="w-fit rounded-full bg-ink px-5 py-2 text-sm font-semibold text-cream">Save menus</button>
</form>
@endsection