<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css">
  <script src="https://kit.fontawesome.com/fb86779649.js" crossorigin="anonymous"></script>
  <!--
    using local bootstrap
  <link rel="stylesheet" href="/static/css/normalize.css">
  <link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap.css')}}">
  -->
  <link rel="stylesheet" href="{{ url_for('static', filename='css/styles.css')}}">

</head>

<header class="p-3 bg-dark text-white">
    <div class="container-md">
    <div class="d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start">
      <a href="/" class="d-flex align-items-center mb-2 mb-lg-0 text-white text-decoration-none me-3">
        <!-- <i class="fad fa-mug-hot" style="font-size: 3rem"></i> -->
        <img src="static/imgs/mblogo_white.png" alt="HTML5 Icon" width="60" height="40">
      </a>

      <ul class="nav col-8 col-md-auto me-md-auto mb-2 justify-content-left mb-md-0">
        <!-- <li><a href="/" class="nav-link px-2 text-white">Home</a></li> -->
        {% if session['logged_in'] %}
          <li><a href="/dashboard" class="nav-link px-2 text-white">Dashboard</a></li>
          {% if session['user']['isProfessor'] %}
            <!-- <li><a href="/" class="nav-link px-2 text-white">Something for the Professor to see</a></li> -->
          {%else%}
            <!-- <li><a href="/sample_question" class="nav-link px-2 text-white">Something for the Students to see</a></li> -->
          {%endif%}
        {%endif%}
      </ul>
      <div class="text-end">
        {% if session['logged_in'] %}
          <a href="user/signout" class="btn btn-danger me-0">Logout</a>
        {%else%}
          <a href="/login" class="btn btn-outline-light me-0">Login</a>
          <a href="/signup" class="btn btn-outline-warning me-0"> Sign-up</a>
        {%endif%}
      </div>
    </div>
  </div>
</header>

<body>
  <div class="container mt-4">
    {% block content %}
    {% endblock %}
  </div>

  <script src="{{ url_for('static', filename='js/jquery.js')}}"></script>
  <script src="{{ url_for('static', filename='js/scripts.js')}}"></script>

  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4" crossorigin="anonymous"></script>
</body>
</html>
