@extends('layouts.default')
@section('content')
<style>
    #tabs-with-content .tabs:not(:last-child) 
    {
     margin-bottom: 0;
    }

    #tabs-with-content .tab-content 
    {
    padding: 1rem;
    display: none;
    }

    #tabs-with-content .tab-content.is-active 
    {
    display: block;
    }
</style>
<script>
 $(document).ready(function(){
    let tabsWithContent = (function () {
    let tabs = document.querySelectorAll('.tabs li');
    let tabsContent = document.querySelectorAll('.tab-content');

    let deactvateAllTabs = function () {
        tabs.forEach(function (tab) {
        tab.classList.remove('is-active');
        });
    };

    let hideTabsContent = function () {
        tabsContent.forEach(function (tabContent) {
        tabContent.classList.remove('is-active');
        });
    };

    let activateTabsContent = function (tab) {
        tabsContent[getIndex(tab)].classList.add('is-active');
    };

    let getIndex = function (el) {
        return [...el.parentElement.children].indexOf(el);
    };

    tabs.forEach(function (tab) {
        tab.addEventListener('click', function () {
        deactvateAllTabs();
        hideTabsContent();
        tab.classList.add('is-active');
        activateTabsContent(tab);
        });
    })

    tabs[0].click();
    })();
 });
</script>
<section class="section">
    <div class="container"> 
        <div class="level">
            <div class="level-left">
                <h2 class="title logis-red">{{ trans( 'labels.bookings' ) }} : {{ $training->tr_date }}</h2>
            </div>
            <div class="level-right">
                <a class="button is-primary" href="/trainings">{{ trans('labels.back')}}</a>
            </div>
        </div>
        <hr/>
    </div>
</section>
    <div class="container"> 
        <div id="tabs-with-content">
            <div class="tabs is-left">
                <ul>
<br />
<b>Warning</b>:  Undefined variable $training in <b>/home/abazis/apps/logis-test/resources/views/slots/read_only.blade.php</b> on line <b>81</b><br />
<br />
<b>Warning</b>:  Attempt to read property "presence" on null in <b>/home/abazis/apps/logis-test/resources/views/slots/read_only.blade.php</b> on line <b>81</b><br />
<br />
<b>Warning</b>:  foreach() argument must be of type array|object, null given in <b>/home/abazis/apps/logis-test/resources/views/slots/read_only.blade.php</b> on line <b>81</b><br />
                </ul>
            </div>
            <div>
<br />
<b>Warning</b>:  Undefined variable $training in <b>/home/abazis/apps/logis-test/resources/views/slots/read_only.blade.php</b> on line <b>95</b><br />
<br />
<b>Warning</b>:  Attempt to read property "presence" on null in <b>/home/abazis/apps/logis-test/resources/views/slots/read_only.blade.php</b> on line <b>95</b><br />
<br />
<b>Warning</b>:  foreach() argument must be of type array|object, null given in <b>/home/abazis/apps/logis-test/resources/views/slots/read_only.blade.php</b> on line <b>95</b><br />
                    </table>
                </section>
            </div>
        </div>
    </div>
@endsection