Files
NoN-Site/nonpacks/templates/base.html
T
2026-08-03 21:55:59 -05:00

134 lines
5.7 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %}Packs Site{% endblock %}</title>
{% load static %}
<link rel="stylesheet" href="{% static 'css/style.css' %}">
{% block extra_head %}{% endblock %}
<link rel="stylesheet" href="{% static 'fonts/roboto.css' %}">
<link rel="stylesheet" href="{% static 'fontawesome/css/all.min.css' %}">
<link rel="icon" type="image/png" href="{% static 'Logo.png' %}">
</head>
<body>
<div class="app-bar">
<div class="app-bar-title">
{% block app_bar_logo %}
<img src="{% static 'Logo.png' %}" alt="Packs" height="32">
{% endblock %}
</div>
<nav class="app-bar-nav">
<span class="version-badge desktop-version">
<i class="fas fa-tag"></i> {{ APP_ENV }}
<span class="separator"></span>
<i class="fas fa-code-branch"></i> {{ GIT_COMMIT_HASH }}
<span class="separator"></span>
<i class="{{ OS_ICON }}"></i> {{ OS_NAME }}
<span class="separator"></span>
<i class="fas fa-clock"></i> {{ PAGE_GEN_TIME }}
</span>
<span class="version-badge mobile-version">
<i class="fas fa-code-branch"></i> {{ APP_ENV|slice:":1"|upper }}
<i class="{{ OS_ICON }}" style="margin-left: 4px;"></i>
</span>
<a href="{% url 'landing:home' %}">
<i class="fas fa-home"></i><span class="nav-text"> Home</span>
</a>
<a href="{% url 'library:browse' %}">
<i class="fas fa-compass"></i><span class="nav-text"> Browse</span>
</a>
<a href="{% url 'profiles:user_list' %}">
<i class="fas fa-users"></i><span class="nav-text"> Users</span>
</a>
</nav>
</div>
<main class="main-content">
{% block content %}{% endblock %}
</main>
{% if user.is_authenticated %}
<div class="user-bar">
{% if impersonating %}
<a class="impersonate-chip" href="{% url 'profiles:user_profile' impersonator.username %}"
title="Impersonator: {{ impersonator.username }}">
{% if impersonator_avatar_url %}
<img src="{{ impersonator_avatar_url }}" alt="">
{% else %}
<div class="default-avatar mini">{{ impersonator.username|first|upper }}</div>
{% endif %}
<span>Impersonator: {{ impersonator.username }}</span>
</a>
{% endif %}
<div class="user-avatar" onclick="toggleUserMenu()">
{% if user.userprofile.avatar %}
<img src="{{ user.userprofile.avatar_url }}" alt="Avatar">
{% else %}
<div class="default-avatar">{{ user.username|first|upper }}</div>
{% endif %}
</div>
<div class="user-menu" id="user-menu">
<a href="{% url 'profiles:user_profile' request.user.username %}" class="user-edit">
<i class="fas fa-user-circle"></i> {{ user.username }}
</a>
<div class="user-info"></div>
<a href="{% url 'profiles:account' %}">
<i class="fas fa-user-cog"></i> Account Settings
</a>
<a href="{% url 'profiles:settings' %}">
<i class="fas fa-key"></i> API Tokens
</a>
{% if user.is_staff %}
<a href="{% url 'admin:index' %}">
<i class="fas fa-shield-alt"></i> Admin panel
</a>
{% endif %}
<form method="post" action="{% url 'profiles:logout' %}" style="display: inline;">
{% csrf_token %}
<button type="submit" class="logout-button">
{% if impersonating %}
<i class="fas fa-undo-alt"></i> Stop impersonating
{% else %}
<i class="fas fa-sign-out-alt"></i> Logout
{% endif %}
</button>
</form>
</div>
</div>
<script>
function toggleUserMenu() {
const menu = document.getElementById('user-menu');
menu.style.display = menu.style.display === 'block' ? 'none' : 'block';
}
document.addEventListener('click', (e) => {
if (!e.target.closest('.user-bar')) {
document.getElementById('user-menu').style.display = 'none';
}
});
function getCookie(name) {
let cookieValue = null;
if (document.cookie && document.cookie !== '') {
const cookies = document.cookie.split(';');
for (let i = 0; i < cookies.length; i++) {
const cookie = cookies[i].trim();
if (cookie.substring(0, name.length + 1) === (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
</script>
{% else %}
<div class="auth-bar">
<a href="{% url 'profiles:login' %}"><i class="fas fa-sign-in-alt"></i> Login</a> |
<a href="{% url 'profiles:register' %}"><i class="fas fa-user-plus"></i> Register</a>
</div>
{% endif %}
{% block extra_js %}{% endblock %}
</body>
</html>