{% load static %}
{% block layout_menu %}
<aside id="layout-menu" class="layout-menu menu-vertical menu">
    <div class="app-brand demo">
      <a href="" class="app-brand-link">
        <span class="app-brand-logo demo menu-text fw-bold"><span style="color: black;">GK</span></span> 

        <span class="app-brand-text demo menu-text fw-bold ms-2">{{function_name |capfirst }}</span>
      </a>

      <a href="javascript:void(0);" class="layout-menu-toggle ms-auto">
        <i class="bx bx-chevron-left bx-sm align-middle"></i>
      </a>
    </div>

    <div class="menu-inner-shadow"></div>

    <ul class="menu-inner py-1">
      <!-- Dashboard -->
      <li class="menu-item {% if 'dashboard' in request.path %}active{% endif %}">
        <a href="{% url 'gate_keeper_dashboard' %}" class="menu-link">
          <i class="menu-icon tf-icons bx bx-tachometer"></i>
          <div data-i18n="Analytics">Dashboard</div>
        </a>
      </li>

      <!-- Layouts -->
      <li class="menu-item {% if 'visitor' in request.path or 'user' in request.path %}active open{% endif %}">
        <a href="javascript:void(0);" class="menu-link menu-toggle">
          <i class="menu-icon tf-icons bx bx-edit"></i>
          <div data-i18n="Layouts">Visitor</div>
        </a>

        <ul class="menu-sub">
          <li class="menu-item {% if request.path == '/gate_keeper/visitor' %}active{% endif %}">
            <a href="{% url 'gate_keeper_visitor_verification' %}" class="menu-link">
              <div data-i18n="Without menu">Appointments</div>
            </a>
          </li>
          <li class="menu-item {% if request.path == '/gate_keeper/visitor/add' %}active{% endif %}">
            <a href="{% url 'gate_keeper_visitor_add' %}" class="menu-link">
              <div data-i18n="Without navbar">Add New Appointments</div>
            </a>
          </li>
          <li class="menu-item {% if request.path == '/gate_keeper/user' %}active{% endif %}">
            <a href="{% url 'gate_keeper_user' %}" class="menu-link">
              <div data-i18n="Container">All Visitors</div>
            </a>
          </li>
        </ul>
      </li>
    </ul>
  </aside>
{% endblock layout_menu  %}