@extends('admin.layouts.app')

@push('scripts_header')
<style type="text/css">
    .error {
        color: red;
    }

    .red-mark {
        color: red;
    }

</style>
@endpush

@section('content')
<div class="pagetitle">
    <!-- <h1>Add User</h1> -->
    <nav>
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ route('admin-dashboard') }}">Dashboard</a></li>
            <li class="breadcrumb-item active">Contact Banner</li>
        </ol>
    </nav>
</div><!-- End Page Title -->

<section class="section">
    <div class="row">
        <div class="col-lg-12">

            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">New Banner</h5>

                    <!-- General Form Elements -->
                    <form role="form" action="{{route('admin-contact-banners.store')}}" method="post" enctype="multipart/form-data">
                    @csrf

                    <div class="row mb-3">
                        <label for="banner_text" class="col-sm-2 col-form-label">Banner Text<span class="red-mark">*</span></label>
                        
                        <div class="col-sm-10">
                            <input type="text" placeholder="Please enter first name" name="banner_text" id="banner_text" 
                            class="form-control" value="{{ old('banner_text') }}">
                            
                            @if($errors->has('banner_text'))
                            <div class="error">{{ $errors->first('banner_text') }}</div>
                            @endif
                        </div>
                    </div>

                    {{-- <div class="row mb-3">
                        <label for="inputPassword" class="col-sm-2 col-form-label">Description</label>
                        
                        <div class="col-sm-10">
                            <textarea name="description" class="form-control" value="{{ old('description') }}" style="height: 100px"></textarea>
                            
                            @if($errors->has('description'))
                                <div class="error">{{ $errors->first('description') }}</div>
                            @endif
                        </div>
                    </div> --}}

                    <div class="row mb-3">
                        <label for="inputNumber" class="col-sm-2 col-form-label">Image<span class="red-mark">*</span></label>
                        <div class="col-sm-10">                            
                            
                            <div class="needsclick dropzone" id="document-dropzone"></div> 

                            @if($errors->has('image'))
                            <div class="error">{{ $errors->first('image') }}</div>
                            @endif
                        </div>
                    </div>                    
                    
                    <div class="row mb-3">
                        <label class="col-sm-2 col-form-label"></label>
                        <div class="col-sm-10">
                            <button type="submit" class="btn btn-primary">Submit</button>
                            <a class="btn btn-default" href="{{ route('admin-contact-banners.index') }}">Back</a>
                        </div>
                    </div>
                </form><!-- End General Form Elements -->
                    <!-- End General Form Elements -->
                </div>
            </div>
        </div>   
    </div>
</section>

<style type="text/css">
    .error{
        color: red;
    }
</style>
@endsection

<link href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.5.1/min/dropzone.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.5.1/min/dropzone.min.js"></script> 

@include('admin.misc.scripts.dropzone_contact_banner')