diff options
Diffstat (limited to 'alphabetlearning/templates/base.html')
-rw-r--r-- | alphabetlearning/templates/base.html | 199 |
1 files changed, 199 insertions, 0 deletions
diff --git a/alphabetlearning/templates/base.html b/alphabetlearning/templates/base.html new file mode 100644 index 0000000..ded8675 --- /dev/null +++ b/alphabetlearning/templates/base.html @@ -0,0 +1,199 @@ +{% load static i18n %} + +<!DOCTYPE html> +{% get_current_language as LANGUAGE_CODE %} +<html lang="{{ LANGUAGE_CODE }}"> +<head> + <meta charset="utf-8"/> + <meta http-equiv="x-ua-compatible" content="ie=edge"/> + <title> + {% block title %} + Alphabet Learning + {% endblock title %} + </title> + <meta name="viewport" content="width=device-width, initial-scale=1.0"/> + <meta name="description" content="Joanna Lemon Resources"/> + <meta name="author" content="Matthew Lemon"/> + <link rel="icon" href="{% static 'images/favicons/al.png' %}"/> + {% block extra_css %} + {% endblock extra_css %} + {% block css %} + <!--Latest compiled and minified Bootstrap CSS --> + {# <link rel="stylesheet"#} + {# href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.2.3/css/bootstrap.min.css"#} + {# integrity="sha512-SbiR/eusphKoMVVXysTKG/7VseWii+Y3FdHrt0EpKgpToZeemhqHeZeLWLhJutz/2ut2Vw1uQEj2MbRF+TVBUA=="#} + {# crossorigin="anonymous"#} + {# referrerpolicy="no-referrer" />#} + <!-- Your stuff: Third-party CSS libraries go here --> + <!-- This file stores project-specific CSS --> + <link rel="stylesheet" href="{% static 'bootstrap/css/bootstrap.css' %}"/> + <link rel="stylesheet" href="{% static 'css/custom.css' %}"/> + <link rel="stylesheet" href="{% static 'css/project.css' %}"/> + <link rel="stylesheet" href="{% static 'css/features.css' %}"> + {# <link rel="stylesheet" href="{% static "css/wrapper.css" %}" type="text/css" media="screen" charset="utf-8" />#} + {% endblock css %} + <!-- Le javascript + ================================================== --> + {# Placed at the top of the document so pages load faster with defer #} + {% block javascript %} + <!-- Bootstrap JS --> + {# <script defer#} + {# src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.2.3/js/bootstrap.min.js"#} + {# integrity="sha512-1/RvZTcCDEUjY/CypiMz+iqqtaoQfAITmNSJY17Myp4Ms5mdxPS5UV7iOfdZoxcGhzFbOm6sntTKJppjvuhg4g=="#} + {# crossorigin="anonymous"#} + {# referrerpolicy="no-referrer"></script>#} + <!-- Your stuff: Third-party javascript libraries go here --> + <!-- place project specific Javascript in this file --> + <script defer src="{% static 'js/project.js' %}"></script> + <script src="{% static "bootstrap/js/bootstrap.js" %}"></script> + <script src="{% static "js/htmx.min.js" %}"></script> + <script src="https://js.stripe.com/v3/"></script> + {% endblock javascript %} +</head> +<body> + + +<header> + <nav class="navbar navbar-expand-lg navbar-light bg-white"> + <div class="container-fluid"> + <a class="navbar-brand" href="{% url "home" %}"> + <img src="{% static "images/AL_long_logo_black_grey.png" %}" width=300px alt="Alphabet Learning Logo"> + </a> + <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" + aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> + <span class="navbar-toggler-icon"></span> + </button> + + + <div class="collapse navbar-collapse" id="navbarNav"> + + <ul class="navbar-nav ms-auto"> + <li class="nav-item"> + <!-- <div class="d-flex align-items-end mx-1 p-1 px-3 text-white rounded rounded-sm bg-primary"> --> + <!-- <div> --> + <!-- <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-2" width="32" height="32"> --> + <!-- <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 3h1.386c.51 0 .955.343 1.087.835l.383 1.437M7.5 14.25a3 3 0 0 0-3 3h15.75m-12.75-3h11.218c1.121-2.3 2.1-4.684 2.924-7.138a60.114 60.114 0 0 0-16.536-1.84M7.5 14.25 5.106 5.272M6 20.25a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Zm12.75 0a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Z" /> --> + <!-- </svg> --> + <!-- </div> --> + <!-- <div class="fw-bold"> --> + <!-- Cart --> + <!-- </div> --> + <!-- </div> --> + </li> + <li class="nav-item"> + <a class="nav-link text-dark fw-bold" href="{% url "resources:resource_list" %}">Resources</a> + </li> + <li class="nav-item"> + <a class="nav-link text-dark fw-bold" + href="https://www.tes.com/teaching-resources/shop/joannalemon" + target="_blank">TES Shop</a> + </li> + <li class="nav-item"> + <a class="nav-link text-dark fw-bold" href="https://joannalemon.etsy.com/" + target="_blank">Etsy</a> + </li> + <li class="nav-item"> + <a class="nav-link text-dark fw-bold" href="https://blog.joannalemon.com" + target="_blank">Blog</a> + </li> + </ul> + </div> + </div> + </nav> + <div class="border-bottom border-dark border-1"></div> +</header> +<main> + {% block body %} + {% if messages %} + {% for message in messages %} + <div class="alert alert-dismissible {% if message.tags %}alert-{{ message.tags }}{% endif %}"> + {{ message }} + <button type="button" + class="btn-close" + data-bs-dismiss="alert" + aria-label="Close"></button> + </div> + {% endfor %} + {% endif %} + {% block main %} + <div class="container"> + {% block content %} + {% endblock content %} + <footer class="pt-4 my-md-5 pt-md-5 border-top"> + <div class="row"> + <div class="col-12 col-md"> + <img class="mb-2" src="#" alt="" width="24" height="19"> + <small class="d-block mb-3 text-muted">© 2024</small> + </div> + <div class="col-6 col-md"> + <h5>Features</h5> + <ul class="list-unstyled text-small"> + <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Cool stuff</a> + </li> + <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Random + feature</a></li> + <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Team + feature</a></li> + <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Stuff for + developers</a></li> + <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Another one</a> + </li> + <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Last time</a> + </li> + </ul> + </div> + <div class="col-6 col-md"> + <h5>Pages on this site</h5> + <ul class="list-unstyled text-small"> + <li class="mb-1"><a class="link-secondary text-decoration-none" + href="{% url "resources:resource_list" %}">Resources</a></li> + <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Resource + name</a></li> + <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Another + resource</a></li> + <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Final + resource</a></li> + </ul> + </div> + <div class="col-6 col-md"> + <h5>About</h5> + <ul class="list-unstyled text-small"> + <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Team</a></li> + <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Locations</a> + </li> + <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Privacy</a> + </li> + <li class="mb-1"><a class="link-secondary text-decoration-none" href="#">Terms</a></li> + </ul> + </div> + </div> + </footer> + + </div> + {% endblock main %} + {% endblock body %} +</main> +<!-- /container --> +{% block modal %} +{% endblock modal %} +{% block inline_javascript %} +{% comment %} +Script tags with only code, no src (defer by default). To run +with a "defer" so that you run inline code: +<script> + # + } { + # window.addEventListener('DOMContentLoaded', () => { + # + } { + # /* Run whatever you want */ # + } { + # + }); + # + } +</script> +{% endcomment %} +{% endblock inline_javascript %} +</body> +</html> |