@extends('layouts.app') 
@section('content')
  @include('levelGroup.header')

<section class="">
  <div class="row">
    <div class="col s12">
      <div class="card white">
        <div class="card-content white">
          <p class="card-title inline valign-wrapper">
            <img src="{{ $levelGroup->image }}" alt="" width="60" height="60" class="circle">
            <span>{!! $levelGroup->name !!}</span>
          </p>
          <hr>

          <div class="row">
            <div class="col s12">

              <div class="row">

                <div class="col s12 m4">
                  <p class="valign-wrapper">
                    <i class="material-icons left">reorder</i> Order: {{ $levelGroup->order }}
                  </p>
                </div>

              </div>


              <div class="row">

                @isset($levelGroup->courseId)
                <div class="col s12 m3">
                  <p class="valign-wrapper">
                    <i class="material-icons left">book</i> Course:&nbsp;
                    <a href="{{ route('course.show', $levelGroup->courseId) }}">
                      {{ $levelGroup->course->name }}
                    </a>
                  </p>
                </div>
                @endisset
              </div>
              <div class="row">
                <div class="input-field col s12 m6">
                    <i class="material-icons left">book</i> Is Shortcut:&nbsp;
                  @if($levelGroup->is_shortcut)
                  <p class="valign-wrapper"> Yes </p>
                  @else
                  <p class="valign-wrapper"> No </p>
                  @endif
                </div>
              </div>

              <div class="row">
                <div class="col s12">
                  <small>Description</small>
                  <p>
                    {{ $levelGroup->description }}
                  </p>
                </div>
              </div>



              <a href="{{ route('levelGroup.edit', $levelGroup->id) }}" class="btn-floating btn waves-effect waves-light teal right tooltipped"
                data-position="left" data-tooltip="Edit">
                <i class="material-icons">edit</i>
              </a>

            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
@endsection