@extends('layouts.admin')
@section('content')
@section('styles')  
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.9.0/fullcalendar.css" />
    <style>
        .fc-content{
           
            height: 55px  !important;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .fc-title{
           color: white  !important;
           display:inline-block !important;
            width: 150px !important;
            word-break: break-word !important;
            font-size: 18px;
            margin-left: 10px;
        }
    </style>

@endsection
<div class="card">
    <div class="card-header">
      Training Calender
    </div>
    <div class="card-body">
        <div class="container">   
             <div id='calendar'></div>
        </div>       
    </div>    
</div>


@endsection
@section('scripts')
@parent
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.9.0/fullcalendar.js"></script>
<script src="{{asset('js/cal.js')}}"></script>
@endsection