@extends('backend.layouts.app')

@section('title', 'Translate Slider')

@push('styles')

    
@endpush

@section('content')

<form method="POST" action="{{url('admin/translate/Banner')}}" id="form_validation"  novalidate="novalidate">
    @csrf
    <div class="row clearfix">




   <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
   <div class="card">

               <div class="header">
                    <h2><strong style="color:black">Traduction Sliders</strong></h2>
                </div>



    <div class="body">
<div class="row clearfix" style="border:1px solid black">

@forelse($banners as $key=>$banner)
            
                  <div class="col-sm-12" >  
                 
                 <p style="color:#fff;background-color:#02396C;font-size:17px;border:3px;text-align:center;padding: 4px 8px;">Slider : {{$key+1}}</p><br>
                
                  <div class="col-sm-2" style="color:black">  
                   <center><img src="{{asset('united-states.png')}}" style="width:60px;height:60px"></center>
                  </div>
                 <div class="col-sm-5">           
                    <div class="form-group form-float">
                        <div class="form-line">
                            <input type="text" name="title" id="tag_title{{$banner->id}}" class="form-control" value="{{$banner->title}}">
                            <label class="form-label"> <strong style="color:black"> Title </strong></label>
                            </div>
                    </div>
                 </div>
                    
                    <div class="col-sm-5">      
                     <div class="form-group form-float">
                        <div class="form-line">
                            <input type="text" name="subtitle" id="tag_subtitle{{$banner->id}}" class="form-control" value="{{$banner->subtitle}}">
                            <label class="form-label"> <strong style="color:black">Subtitle</strong></label>
                            </div>
                    </div>
                     </div>
                   </div>


              <div class="col-sm-12" > 
                @forelse($languages as $lang)
                 
                  <div class="col-sm-2" style="color:black">  
                   <center><img src="{{asset('storage/languages/'.$lang->logo)}}" style="width:40px;height:40px" title="{{$lang->code}}"></center>
                  </div>
                 <div class="col-sm-5">           
                    <div class="form-group form-float">
                        <div class="form-line">

                            <input type="text" name="title{{$banner->id}}{{$lang->code}}" id="tag_title{{$banner->id}}{{$lang->id}}" class="form-control"
                             value="{{getTranslation_banner($banner->id,$lang->code)['title']}}" required="">

                            <label class="form-label"> <strong style="color:black"> Title </strong> <span style="color:red">*</span></label>
                            </div>
                    </div>
                 </div>
                    
                    <div class="col-sm-5">      
                     <div class="form-group form-float">
                        <div class="form-line">
                            <input type="text" name="subtitle{{$banner->id}}{{$lang->code}}" id="tag_subtitle{{$banner->id}}{{$lang->id}}" class="form-control"
                             value="{{getTranslation_banner($banner->id,$lang->code)['subtitle']}}">
                            <label class="form-label"> <strong style="color:black">Subtitle</strong></label>
                            </div>
                    </div>
                     </div>

                   
                    @empty
              <p><center style="color:red">Not existe any Langueges</center></p>
                   @endforelse

               </div>    
                  @empty              
              <p><center style="color:red">Not existe any sliders</center></p>              

              @endforelse
</div>

               












          <button type="submit" class="btn btn-primary btn-block m-t-15 waves-effect"><i class="material-icons">save </i> Add</button>




           </div>
        </div>
</div>


    







        
    </div>
</form>



@endsection

@push('scripts')
     <!-- validation -->
      <script src="{{ asset('backend/plugins/jquery-validation/jquery.validate.js')}}"></script>
        <!-- Custom Js -->
       <script src="{{ asset('backend/js/pages/forms/form-validation.js')}}"></script>

@endpush