1<!doctype html>
2<html lang="en">
3<head>
4 <!-- Required meta tags -->
5 <meta charset="utf-8">
6 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
7
8 <!-- Bootstrap CSS -->
9 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
10
11 {% block title %}
12 {% endblock %}
13</head>
14<body>
15
16<!-- Navbar -->
17<nav class="navbar navbar-expand-lg navbar-light bg-light px-4">
18 <a class="navbar-brand" href="#">Homepage</a>
19 <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
20 <span class="navbar-toggler-icon"></span>
21 </button>
22 <div class="collapse navbar-collapse" id="navbarNav">
23 <ul class="navbar-nav ml-auto">
24 {% if user.is_authenticated %}
25 <li class="nav-item">
26 <a class="nav-link" href="#">Profile</a>
27 </li>
28 <li class="nav-item">
29 <a class="nav-link" href="#">Logout</a>
30 </li>
31 {% else %}
32 <li class="nav-item">
33 <a class="nav-link" href="#">Login</a>
34 </li>
35 <li class="nav-item">
36 <a class="nav-link" href="#">Sign Up</a>
37 </li>
38 {% endif %}
39 </ul>
40 </div>
41</nav>
42
43{% block body %}
44{% endblock %}
45
46<!-- Optional JavaScript -->
47<!-- jQuery first, then Popper.js, then Bootstrap JS -->
48<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
49<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
50<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
51
52</body>
53</html>