@extends('categories.layout')

@section('content')

<div class="card mt-5">
  <h2 class="card-header">Add New Category</h2>
  <div class="card-body">

    <div class="d-grid gap-2 d-md-flex justify-content-md-end">
        <a class="btn btn-primary btn-sm" href="{{ route('categories.index') }}"><i class="fa fa-arrow-left"></i> Back</a>
    </div>

    <form action="{{ route('categories.store') }}" method="POST" enctype="multipart/form-data">
        @csrf

        <div class="mb-3">
            <label for="inputName" class="form-label"><strong>Name:</strong></label>
            <input
                type="text"
                name="name"
                class="form-control @error('name') is-invalid @enderror"
                id="inputName"
                placeholder="Name">
            @error('name')
                <div class="form-text text-danger">{{ $message }}</div>
            @enderror
        </div>

         <div class="mb-3">
            <label for="inputCode" class="form-label"><strong>Code:</strong></label>
            <input
                type="string"
                name="code"
                class="form-control @error('code') is-invalid @enderror"
                id="inputCode"
                placeholder="code">
            @error('code')
                <div class="form-text text-danger">{{ $message }}</div>
            @enderror
        </div>
       <div class="mb-3">
            <label for="inputDetail" class="form-label"><strong>Detail:</strong></label>
            <textarea
                class="form-control @error('detail') is-invalid @enderror"
                style="height:150px"
                name="detail"
                id="inputDetail"
                placeholder="Detail"></textarea>
            @error('detail')
                <div class="form-text text-danger">{{ $message }}</div>
            @enderror
        </div>
       <div class="mb-3">
            <label for="inputImg" class="form-label"><strong>Image:</strong></label>
            <input type="file" name="img" id="inputImg">
            <input type="hidden" name="image" id="inputImage" value="none">
            @error('image')
                <div class="form-text text-danger">{{ $message }}</div>
            @enderror
        </div>
        <button type="submit" class="btn btn-success"><i class="fa-solid fa-floppy-disk"></i> Submit</button>
    </form>

  </div>
</div>
@endsection