@extends('layouts.contentLayoutMaster')

{{-- page title --}}
@include('panels.page-title')

{{-- vendor style --}}
@section('vendor-style')
<link rel="stylesheet" type="text/css" href="{{asset('vendors/flag-icon/css/flag-icon.min.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('vendors/materialize-stepper/materialize-stepper.min.css')}}">

<link rel="stylesheet" type="text/css" href="{{asset('vendors/flag-icon/css/flag-icon.min.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('vendors/dropify/css/dropify.min.css')}}">
@endsection

{{-- page content --}}
@section('page-style')
<link rel="stylesheet" type="text/css" href="{{asset('css/pages/form-wizard.css')}}">
@endsection
@section('content')
<div class="section">
  <div class="card">
    
  </div>

  <!-- HTML VALIDATION  -->


   <div class="row">
     <div class="col s12">
        @include('panels.flashMessages')

       <div id="validations" class="card card-tabs">
          <div class="card-content">
              <div class="card-title">
                <div class="row">
                  <div class="col s12 m6 l10">
                    
                  </div>
                </div>
              </div>
             <div id="view-validations">
             <form id="accountForm" action="{{route($formUrl)}}" method="post" enctype="multipart/form-data">
                {!! method_field('post') !!}
                @csrf()

                    <div class="row">

                      <div class="input-field col m6 s12">
                        <label for="message">Message</label>
                        <input id="message" class="validate" name="message" type="text" data-error=".errorTxt1" value="{{old('message')}}">
                        @error('message')
                            <div style="color:red">{{ $message }}</div>
                        @enderror
                        <small class="errorTxt1"></small>
                      </div>
                      </div>

                      
                     <div class="row section">
                      <div class="input-field col m6 s12">
                        <div id="file-upload" class="section">
                            <!--Default version-->
                            <div class="row ">
                                <div class="col s12">
                                    <div class="col s12 m4 m12">
                                        <label for="image">Image</label>
                                    </div>
                                    <div class="col s6">
                                        <input type="file" id="input-file-now" name="image" class="dropify validate" alt="150.png" data-default-file="" value="{{old('image')}}" accept="image/*" data-error=".errorTxt1"/>
                                        @error('image')
                                        <div class="color:red">{{$message}}</div>
                                        @enderror
                                        <small class="errorTxt1"></small>
                                    </div>
                                </div>
                            </div>
                        </div>
                      </div>

                    </div>

                    
                      <div class="input-field col s12">
                        <button class="btn waves-effect waves-light right submit" type="submit" name="action">Submit
                          <i class="material-icons right">send</i>
                        </button>
                      </div>
                       
                    </div>

                        

                  </form>
                </div>  
             </div>
          </div>
       </div>
    </div>
</div>
@endsection

@section('vendor-script')
<script src="{{asset('vendors/dropify/js/dropify.min.js')}}"></script>
@endsection

{{-- page script --}}
@section('page-script')
<script src="{{asset('js/scripts/form-file-uploads.js')}}"></script>
@endsection