{% load static %}
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="/docs/4.0/assets/img/favicons/favicon.ico">

    <title>Dashboard Template for Bootstrap</title>
     <link rel="canonical" href="https://getbootstrap.com/docs/4.0/examples/dashboard/">
    <!-- Bootstrap core CSS -->
    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link rel="stylesheet" href="{% static 'css/portal.css' %}">
  </head>

  <body>

    <nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0">
      <a class="navbar-brand col-sm-3 col-md-2 mr-0" href="{% url 'userface:search'%}">Home</a>
      <ul class="navbar-nav px-3">

        <li class="nav-item dropdown">
            <a class="nav-link dropdown-toggle"  id="dropdown01" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Options</a>
            <div class="dropdown-menu" aria-labelledby="dropdown01">
              <a class="dropdown-item"  href="{% url 'userface:myparking'%}">
                <span data-feather="home"></span>
                  My Parking
                </a>
              <a class="dropdown-item" href="{% url 'userface:my-vehicles'%}">
                  <span data-feather="truck"></span>
                  My Vehicles
                </a>

              <a class="dropdown-item" href="{% url 'userface:portal'%}">
                <span data-feather="book-open"></span>
                  My Dash
              </a>

               <a class="dropdown-item" href="{% url 'logout'%}?next=/userface">
                <span data-feather="log-out"></span>
                  Logout
              </a>

            </div>

          </li>

      </ul>
    </nav>

    <div class="container-fluid">
      <div class="row">
        <nav class="col-md-2 d-none d-md-block bg-light sidebar">
          <div class="sidebar-sticky">
            <ul class="nav flex-column">
              {% block active %}
              <li class="nav-item">
                <a class="nav-link active" href="#">
                  <span data-feather="home"></span>
                  Dashboard <span class="sr-only">(current)</span>
                </a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="{% url 'userface:my-vehicles'%}">
                  <span data-feather="truck"></span>
                  My Vehicles
                </a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="{% url 'userface:myparking'%}">
                  <span data-feather="home"></span>
                  My parking
                </a>
              </li>

              {% endblock active %}
            </ul>

            <h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
            </h6>
          </div>
        </nav>

        <main role="main" class="col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">
          <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pb-2 mb-3 border-bottom">
  {% block title %}  <h1 class="h2">Dashboard</h1>  {% endblock title %}
            <div class="btn-toolbar mb-2 mb-md-0">
              <div class="btn-group mr-2">
                  {% block action %}

                  {% endblock action %}
              </div>
            </div>
          </div>

          {% block content %}
            {% if user.is_authenticated %}
            <h3 class="h3"> Welcome to your portal, {{ user.get_username }}! </h3>
            {% else %}
            {% endif %}
            {% endblock content %}

        </main>
      </div>
    </div>



    <!-- Icons -->
    <script src="https://unpkg.com/feather-icons/dist/feather.min.js"></script>
    <script>
      feather.replace()
    </script>
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script src="https://getbootstrap.com/docs/4.0/assets/js/vendor/popper.min.js"></script>
    <script src="https://getbootstrap.com/docs/4.0/dist/js/bootstrap.min.js"></script>

  </body>

