@extends('frontend.counselor-dashboard.layouts.master')

@section('dashboard-contents')
<div class="dashboard__content-wrap mt-3">
  <div class="dashboard__content-title d-flex flex-wrap justify-content-between">
    <h4 class="title">Counselor</h4>
    <a href="{{ route('counselor.counselor.create') }}" class="btn btn-primary btn-hight-basic">
      <i class="fas fa-plus-circle"></i> New
    </a>
  </div>
  <div class="row">
    <div class="col-12">
      <div class="dashboard__review-table table-responsive">
        <table class="table table-borderless">
          <thead>
            <tr>
              <th>Thumb Image</th>
              <th>Title</th>
              <th>Actions</th>
            </tr>
          </thead>
          <tbody>
            @foreach ($models as $model)
            <tr>
              <td>
                <img style="max-width: 120px;max: height 100px;" src="{{ $model->thumb_image }}">
              </td>
              <td> 
                <a target="_blank" class="no-image" href="{{ route('counselors-details', ['id' => $model->id, 'slug' => Str::slug($model->title)]) }}">
                  {{ $model->title }}
                </a>
              </td>
              <td>
                <a href="{{ route('counselor.counselor.edit', $model->id) }}"
                  class="text-primary"><i class="far fa-edit"></i></a>
                <a href="{{ route('counselor.counselor.destroy', $model->id) }}"
                  class="text-danger delete-item"><i class="fas fa-trash-alt"></i></a>
              </td>
            </tr>
            @endforeach
            @if(count($models) ==0)
            <td class="text-center" colspan="100">{{ __('No Data') }}</td>
            @endif
          </tbody>
        </table>
        <div class="mt-30">
          {{ $models->render() }}
        </div>
      </div>
    </div>
  </div>
</div>
@endsection
@push('scripts')
<style>
  .dashboard__review-table tbody tr td>a.no-image:last-child{
    padding: 5px 0px;
    border: none !important;
    vertical-align: middle !important;
    background: unset !important;
    color: #000 !important;
    width: auto !important;
    height: auto !important;
    font-size: 16px;
    text-decoration: underline;
  }
</style>
 
@endpush