copilot-swe-agent[bot]
3fa24c0686
Co-authored-by: christianlouis <361235+christianlouis@users.noreply.github.com>
197 lines
10 KiB
HTML
197 lines
10 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<title>{% block title %}DocuElevate{% endblock %}</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<!-- Tailwind CSS or other global CSS references -->
|
|
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
|
|
<link rel="stylesheet" href="/static/styles.css" />
|
|
<!-- Alpine.js moved to head for earlier loading -->
|
|
<script src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
|
|
{% block head_css %}
|
|
<!-- Tailwind CSS and other CSS -->
|
|
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
|
|
<!-- Font Awesome -->
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
|
|
integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
|
|
crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
{% endblock %}
|
|
{% block head_extra %}{% endblock %}
|
|
<!-- CSRF token for AJAX/fetch requests -->
|
|
<meta name="csrf-token" content="{{ csrf_token | default('', true) }}">
|
|
</head>
|
|
|
|
<body class="bg-gray-50 min-h-screen flex flex-col">
|
|
<!-- Global Nav -->
|
|
<nav class="bg-white shadow">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex justify-between h-16 items-center">
|
|
|
|
<!-- Brand + Icon -->
|
|
<div class="flex-shrink-0">
|
|
<a href="/" class="inline-flex items-center space-x-2">
|
|
<!-- Icon -->
|
|
<span
|
|
class="material-symbols-light--folder-managed-outline text-blue-500"
|
|
style="width: 24px; height: 24px;"
|
|
></span>
|
|
<!-- Text -->
|
|
<span class="text-xl font-bold text-blue-500 hover:text-blue-700">
|
|
DocuElevate
|
|
</span>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Menu Items - using x-data for mobile menu toggle -->
|
|
<div x-data="{ mobileMenuOpen: false, adminMenuOpen: false }">
|
|
<div class="hidden md:flex space-x-4 items-center">
|
|
<a href="/" class="text-gray-700 hover:text-gray-900">Home</a>
|
|
<a href="/upload" class="text-gray-700 hover:text-gray-900">Upload</a>
|
|
<a href="/files" class="text-gray-700 hover:text-gray-900">Files</a>
|
|
|
|
<!-- Admin dropdown (shown only for admin users via JS) -->
|
|
<div id="adminMenuContainer" class="relative hidden">
|
|
<button
|
|
@click="adminMenuOpen = !adminMenuOpen"
|
|
@click.outside="adminMenuOpen = false"
|
|
type="button"
|
|
class="inline-flex items-center text-gray-700 hover:text-gray-900 focus:outline-none"
|
|
aria-haspopup="true"
|
|
:aria-expanded="adminMenuOpen"
|
|
>
|
|
<i class="fas fa-shield-alt mr-1 text-red-500"></i>
|
|
Admin
|
|
<i class="fas fa-chevron-down ml-1 text-xs"></i>
|
|
</button>
|
|
<div
|
|
x-show="adminMenuOpen"
|
|
x-transition:enter="transition ease-out duration-100 transform"
|
|
x-transition:enter-start="opacity-0 scale-95"
|
|
x-transition:enter-end="opacity-100 scale-100"
|
|
x-transition:leave="transition ease-in duration-75 transform"
|
|
x-transition:leave-start="opacity-100 scale-100"
|
|
x-transition:leave-end="opacity-0 scale-95"
|
|
class="absolute right-0 mt-2 w-48 bg-white rounded-md shadow-lg ring-1 ring-black ring-opacity-5 z-50"
|
|
>
|
|
<div class="py-1">
|
|
<a href="/settings" class="flex items-center px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">
|
|
<i class="fas fa-cog w-4 mr-2 text-gray-500"></i> Settings
|
|
</a>
|
|
<a href="/admin/credentials" class="flex items-center px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">
|
|
<i class="fas fa-key w-4 mr-2 text-yellow-500"></i> Credentials
|
|
</a>
|
|
<a href="/env" class="flex items-center px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">
|
|
<i class="fas fa-terminal w-4 mr-2 text-gray-500"></i> Environment
|
|
</a>
|
|
<a href="/admin/files" class="flex items-center px-4 py-2 text-sm text-gray-700 hover:bg-gray-100">
|
|
<i class="fas fa-folder-open w-4 mr-2 text-gray-500"></i> File Manager
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Status (de-emphasized) -->
|
|
<a href="/status" class="text-gray-500 hover:text-gray-700 text-sm" title="System Status">
|
|
<i class="fas fa-circle-dot mr-0.5"></i> Status
|
|
</a>
|
|
|
|
<a href="/about" class="text-gray-700 hover:text-gray-900">About</a>
|
|
|
|
<!-- Dynamic Auth Section -->
|
|
<div id="authSection" class="text-gray-700 hover:text-gray-900"></div>
|
|
</div>
|
|
|
|
<!-- Mobile menu button -->
|
|
<button
|
|
@click="mobileMenuOpen = !mobileMenuOpen"
|
|
type="button"
|
|
class="md:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500"
|
|
:aria-expanded="mobileMenuOpen"
|
|
>
|
|
<span class="sr-only">Open main menu</span>
|
|
<svg class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
|
|
</svg>
|
|
</button>
|
|
|
|
<!-- Mobile menu, show/hide based on menu state -->
|
|
<div
|
|
x-show="mobileMenuOpen"
|
|
x-transition:enter="transition ease-out duration-100 transform"
|
|
x-transition:enter-start="opacity-0 scale-95"
|
|
x-transition:enter-end="opacity-100 scale-100"
|
|
x-transition:leave="transition ease-in duration-75 transform"
|
|
x-transition:leave-start="opacity-100 scale-100"
|
|
x-transition:leave-end="opacity-0 scale-95"
|
|
class="md:hidden absolute top-16 inset-x-0 bg-white shadow-md z-50"
|
|
>
|
|
<div class="px-2 pt-2 pb-3 space-y-1 sm:px-3">
|
|
<a href="/" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">Home</a>
|
|
<a href="/upload" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">Upload</a>
|
|
<a href="/files" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">Files</a>
|
|
|
|
<!-- Admin section in mobile menu (shown only for admin users via JS) -->
|
|
<div id="mobileAdminSection" class="hidden">
|
|
<div class="border-t border-gray-200 mt-1 pt-1">
|
|
<p class="px-3 py-1 text-xs font-semibold text-red-600 uppercase tracking-wider flex items-center">
|
|
<i class="fas fa-shield-alt mr-1"></i> Admin
|
|
</p>
|
|
<a href="/settings" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">
|
|
<i class="fas fa-cog mr-2 text-gray-400"></i> Settings
|
|
</a>
|
|
<a href="/admin/credentials" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">
|
|
<i class="fas fa-key mr-2 text-yellow-400"></i> Credentials
|
|
</a>
|
|
<a href="/env" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">
|
|
<i class="fas fa-terminal mr-2 text-gray-400"></i> Environment
|
|
</a>
|
|
<a href="/admin/files" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">
|
|
<i class="fas fa-folder-open mr-2 text-gray-400"></i> File Manager
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Status (de-emphasized) in mobile -->
|
|
<a href="/status" class="block px-3 py-2 rounded-md text-sm font-medium text-gray-400 hover:text-gray-600 hover:bg-gray-50">
|
|
<i class="fas fa-circle-dot mr-1"></i> Status
|
|
</a>
|
|
|
|
<a href="/about" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">About</a>
|
|
|
|
<!-- Mobile Auth Section -->
|
|
<div id="mobileAuthSection" class="block px-3 py-2 rounded-md text-base font-medium text-gray-700 hover:text-gray-900 hover:bg-gray-50">
|
|
<!-- Will be populated by JS -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Main Content -->
|
|
<main class="flex-grow">
|
|
{% block content %}{% endblock %}
|
|
</main>
|
|
|
|
<!-- Footer -->
|
|
<footer class="bg-white shadow">
|
|
<div class="max-w-7xl mx-auto px-4 py-4 text-center text-gray-600">
|
|
DocuElevate 2025 -
|
|
<a href="/privacy" class="text-blue-500 hover:underline">Privacy</a> -
|
|
<a href="/imprint" class="text-blue-500 hover:underline">Imprint</a> -
|
|
<a href="/terms" class="text-blue-500 hover:underline">Terms</a> -
|
|
<a href="/cookies" class="text-blue-500 hover:underline">Cookies</a> -
|
|
<a href="/license" class="text-blue-500 hover:underline">License</a> -
|
|
<a href="/attribution" class="text-blue-500 hover:underline">Attributions</a> -
|
|
<span class="text-xs">Version {{ app_version|default(version, true) }}</span>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Common JS (shared) -->
|
|
<script src="/static/js/common.js"></script>
|
|
|
|
<!-- Let child pages define extra scripts if needed -->
|
|
{% block scripts %}{% endblock %}
|
|
</body>
|
|
</html>
|