@extends('layouts.app')

@section('title', 'Liste des Catégories')

@section('side_bar')
@include('layouts.admin.side_bar_dashboard')
@endsection

@section('content')
<div class="container">
    <div class="row">
        <div class="col-md-6">
            <h4>@yield('title')</h4>
        </div>
        <div class="col-md-6 d-flex justify-content-end">
            <a href="{{ route('categories.create') }}" class="btn btn-primary">Ajouter une catégorie</a>
        </div>
    </div>

    <div class="card p-3 d-none d-md-block">
        <div class="row align-items-center">
            <div class="col-3 ">
                <p class="exerge"> # </p>
            </div>
            <div class="col-6 col-xl-7">
                <p class="exerge"> Nom </p>
            </div>
            <div class="col-3 col-xl-2">
                <p class="text-center"> Action</p>
            </div>
        </div>
    </div>


    @foreach ($categories as $category)
    <div class="card p-3 pe-0 mb-4 shadow">
        <div class="row align-items-center">
            <div class="col-3">
                <p class="exerge">{{ $category->id }}</p>
            </div>
            <div class="col-9 col-md-6 col-xl-7 ">
                <p class="exerge"> {{ $category->name }}</p>
            </div>
            <div class="col-12 col-md-3 col-xl-2 d-flex">
                <a href="{{ route('categories.edit', $category) }}" class="btn btn-secondary me-2"><i class="bi bi-plus-square"></i></a>


                <form action="{{ route('categories.destroy', $category) }}" method="POST">
                    @csrf
                    @method('DELETE')
                    <button type="submit" class="btn btn-danger"><i class="bi bi-trash3"></i></button>
                </form>

            </div>
        </div>
    </div>
    @endforeach
</div>
@endsection