{% extends "main/base.html" %}

{% block header %}
    <!-- BEGIN: Header-->

    <!-- END: Header-->
{% endblock header %}

{% block sidenav %}
    <div id="show-sidenav" class="draggable z-depth-1 hide">
        <i class="material-icons-outlined theme-on-primary-text pointer">chevron_right</i>
    </div>
    <!-- BEGIN: SideNav-->
    <aside id="main-sidenav" class="sidenav-main nav-collapsed nav-collapsible sidenav-light sidenav-active-rounded z-depth-2">
        <ul class="sidenav sidenav-collapsible leftside-navigation collapsible sidenav-fixed menu-shadow pt-2 theme-surface-transparent1" id="slide-out" data-menu="menu-navigation" data-collapsible="accordion">

            <li class="bold"><a id="dashboard-sidenav" class="waves-effect waves-cyan" href="{{ url_for('main.home') }}">
                <i class="material-icons-outlined">dashboard</i>
                <span class="menu-title" data-i18n="">Dashboard</span>
            </a></li>

            <li class="bold"><a id="settings-sidenav" class="waves-effect waves-cyan" href="{{ url_for('settings_system.settings') }}">
                <i class="material-icons-outlined">settings</i>
                <span class="menu-title" data-i18n="">Settings</span>
            </a></li>

            <li class="bold"><a id="logout-sidenav" class="waves-effect waves-cyan" href="{{ url_for('user_system.logout') }}">
                <i class="material-icons-outlined">exit_to_app</i>
                <span class="menu-title" data-i18n="">Logout</span>
            </a></li>

            <li class="bold"><a id="hide-sidenav" class="waves-effect waves-cyan" href="#">
                <i class="material-icons-outlined">menu_open</i>
                <span class="menu-title" data-i18n="">Hide Sidenav</span>
            </a></li>

            {% for app in apps %}
                <li class="bold">
                    {% if app.open_in == 'iframe' %}
                        <a id="dashboard-sidenav" class="waves-effect waves-cyan" href="{{ url_for('main.app_view', url=app.url) }}">
                    {% elif app.open_in == "this_tab" %}
                        <a id="dashboard-sidenav" class="waves-effect waves-cyan" href="{{ app.prefix }}{{ app.url }}">
                    {% elif app.open_in == "new_tab" %}
                        <a id="dashboard-sidenav" class="waves-effect waves-cyan" href="{{ app.prefix }}{{ app.url }}" target="_blank">
                    {% endif %}
                    <img src="{{ app.sidebar_icon }}" style="position: relative; top: 5px; left: 2px; margin-right: 18px; height: 24px">
                    <span class="menu-title" data-i18n="">{{ app.name }}</span>
                </a></li>
            {% endfor %}

        </ul>
               <a id="sidenav-mobile-toggle-btn"
                  class="sidenav-trigger btn-sidenav-toggle btn-floating btn-medium waves-effect waves-light hide-on-large-only theme-primary"
                  href="#" data-target="slide-out">
                   <i class="material-icons-outlined theme-on-primary-text">menu</i>
               </a>
    </aside>
    <!-- END: SideNav-->

{% endblock sidenav%}

{% block footer %}
    <!-- BEGIN: Footer-->
    <!-- <footer class="page-footer footer footer-static footer-light navbar-border navbar-shadow">
      <div class="footer-copyright">
        <div class="container"><span>&copy; 2019 All rights reserved.</span><span class="right hide-on-small-only">DashMachine</span></div>
      </div>
    </footer> -->
    <!-- END: Footer-->
{% endblock footer %}