recipes/templates/common/base.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>
{% block title %}Cait.Rocks!{% endblock %}
</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
{% load static %}
<link rel="stylesheet" href="{% static 'bootstrap/dist/css/bootstrap.min.css' %}">
<link rel="stylesheet" href="{% static 'font-awesome/css/font-awesome.css' %}">
<link rel="stylesheet" href="{% static 'recipes/css/cait_rocks.css' %}">
{% block page_css %}{% endblock %}
</head>
<body {% block ng_app %}{% endblock %} {% block ng_controller %}{% endblock %} {% block ng_init %}{% endblock %}>
{% block navbar %}
<nav id="navigation_bar" class="navbar navbar-expand-sm navbar-dark bg-dark navbar-fixed-top">
<h1 class="navbar-brand mb-0">
<a class="navbar-brand" href="{% url 'home' %}">Cait.Rocks</a>
</h1>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#mynavbar"
aria-controls="mynavbar" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="mynavbar">
<ul class="navbar-nav mr-auto">
{% if request.user.is_authenticated %}
<li class="nav-item">
<a class="nav-link" href="{% url 'planner:planner-list' %}">PlanningTool</a>
</li>
{% endif %}
<li class="nav-item">
<a class="nav-link" href="{% url 'planner:recipes-list' %}">Recipes</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'planner:months-list' %}">MonthlyPlans</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'about' %}">About</a>
</li>
</ul>
<ul class="navbar-nav ml-auto">
{% if not request.user.is_authenticated %}
<li class="nav-item">
<a class="nav-link" href="{% url 'login' %}">Login</a>
</li>
{% else %}
<li class="nav-item">
<a class="nav-link" href="{% url 'admin:index' %}">Admin</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'planner:swagger' %}">API</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'logout' %}">Logout-{{ user.username }}</a>
</li>
{% endif %}
</ul>
</div>
</nav>
{% endblock %}
<div class="container" id="main_body_container">
<div class="row-fluid">
<div class="col-12">
{% block content %}{% endblock %}
</div>
</div>
</div>
<script src="{% static 'jquery/dist/jquery.min.js' %}"></script>
<script src="{% static 'bootstrap/dist/js/bootstrap.min.js' %}"></script>
<script src="{% static 'angular/angular.min.js' %}"></script>
{% block app_js %}{% endblock %}
{% block page_js %}{% endblock %}
</body>
</html>