Plankton_Detector/PlanktonDetector/templates/base.html
2024-01-07 00:24:35 +01:00

45 lines
1.5 KiB
HTML

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300&display=swap" rel="stylesheet">
<link rel="stylesheet" href="{% static 'DetectionApp/css/base.css' %}">
{%block extracss%}{%endblock extracss%}
<title>Plankton Detector</title>
</head>
<body>
<div class="top-menu" id="top-menu">
<a href="{% url 'posts' %}">Community</a>
<a href="{% url 'detect' %}">Predict</a>
{% if user.is_authenticated %}
<a href="{% url 'history' %}">History</a>
<a href="{% url 'logout' %}?next={{request.path}}">Logout {{user}}</a>
{%else%}
<a href="{% url 'login' %}?next={{request.path}}">Login</a>
{%endif%}
</div>
<div class="root">
{%block content%}{%endblock content%}
</div>
<footer class="footer">
<p>Footer</p>
</footer>
<script>
var prevScrollpos = window.pageYOffset;
window.onscroll = function() {
var currentScrollPos = window.pageYOffset;
if (prevScrollpos > currentScrollPos) {
document.getElementById("top-menu").style.top = "0";
} else {
document.getElementById("top-menu").style.top = "-45px";
}
prevScrollpos = currentScrollPos;
}
</script>
</body>
</html>