<div class="sidebar" data-background-color="black" data-active-color="warning">

    <!--
		Tip 1: you can change the color of the sidebar's background using: data-background-color="white | black"
		Tip 2: you can change the color of the active button using the data-active-color="primary | info | success | warning | danger"
	-->

    	<div class="sidebar-wrapper">
            <div class="logo" style="padding:0px">
                <a href="/ecc" class="simple-text">
                    <img src="/assets/ecc/assets/img/ECCLOGO.png" alt="LOGO" style="width:65%">
                </a>
            </div>

            @yield('active_page')

            <ul class="nav">
                <li @if ($active_page == "dashboard") class="active" @endif>
                    <a href="/ecc">
                        <i><img src="/assets/icons/browser.svg" style="height:30px;margin-top:-10px;"></i>
                        <p>Dashboard</p>
                    </a>
                </li>
                <li @if ($active_page == "message") class="active" @endif>
                    <a href="/ecc/messages">
                        <i><img src="/assets/icons/news.svg" style="height:32px;margin-top:-11px;"></i>
                        <p>Messages</p>
                    </a>
                </li>
                <li @if ($active_page == "calendar") class="active" @endif>
                    <a href="/ecc/calendar">
                        <i><img src="/assets/icons/calendar.svg" style="height:32px;margin-top:-11px;"></i>
                        <p>Horaire</p>
                    </a>
                </li>
                <li @if ($active_page == "guide") class="active" @endif>
                    <a href="/ecc/guide">
                        <i><img src="/assets/icons/book.svg" style="height:32px;margin-top:-11px;"></i>
                        <p>Guide Pédagogique</p>
                    </a>
                </li>
                <li @if ($active_page == "list") class="active" @endif>
                    <a href="/ecc/list">
                        <i><img src="/assets/icons/id-card.svg" style="height:32px;margin-top:-11px;"></i>
                        <p>Liste des cadets</p>
                    </a>
                </li>
                <li @if ($active_page == "file") class="active" @endif>
                    <a href="/ecc/files">
                        <i><img src="/assets/icons/save.svg" style="height:32px;margin-top:-11px;"></i>
                        <p>Fichier</p>
                    </a>
                </li>
                <br>
                <li @if ($active_page == "update") class="active" @endif>
                    <a href="/ecc/update">
                        <i><img src="/assets/icons/timer.svg" style="height:27px;margin-top:-11px;"></i>
                        <p style="font-size: 11px;">Mise à jour</p>
                    </a>
                </li>
                <li @if ($active_page == "file") class="active" @endif>
                    <a href="https://gitlab.com/TheGamecraft/c-cms/issues">
                        <i><img src="/assets/icons/hospital.svg" style="height:20px;margin-top:-11px;"></i>
                        <p style="font-size: 11px;">Signaler un bug</p>
                    </a>
                </li>
            </ul>
    	</div>
    </div>