| <!DOCTYPE html>
|
| <html lang="en" class="dark">
|
| <head>
|
| <meta charset="UTF-8">
|
| <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
| <title>{% block title %}Admin Panel{% endblock %} - Arxiver</title>
|
| <script src="https://cdn.tailwindcss.com"></script>
|
| <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;400;500;600;700;800&display=swap" rel="stylesheet">
|
| <script>
|
| tailwind.config = {
|
| darkMode: 'class',
|
| theme: {
|
| extend: {
|
| fontFamily: {
|
| sans: ['Inter', 'system-ui', 'sans-serif'],
|
| },
|
| }
|
| }
|
| }
|
| </script>
|
| <style>
|
| * {
|
| font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
|
| }
|
|
|
|
|
| .glass {
|
| background: rgba(255, 255, 255, 0.1);
|
| backdrop-filter: blur(10px);
|
| -webkit-backdrop-filter: blur(10px);
|
| border: 1px solid rgba(255, 255, 255, 0.2);
|
| }
|
|
|
| .dark .glass {
|
| background: rgba(17, 24, 39, 0.7);
|
| border: 1px solid rgba(75, 85, 99, 0.3);
|
| }
|
|
|
| .glass-card {
|
| background: rgba(255, 255, 255, 0.95);
|
| backdrop-filter: blur(20px);
|
| -webkit-backdrop-filter: blur(20px);
|
| border: 1px solid rgba(229, 231, 235, 0.5);
|
| }
|
|
|
| .dark .glass-card {
|
| background: rgba(31, 41, 55, 0.95);
|
| border: 1px solid rgba(75, 85, 99, 0.3);
|
| }
|
|
|
| .glass-nav {
|
| background: rgba(255, 255, 255, 0.8);
|
| backdrop-filter: blur(12px);
|
| -webkit-backdrop-filter: blur(12px);
|
| border-bottom: 1px solid rgba(229, 231, 235, 0.5);
|
| }
|
|
|
| .dark .glass-nav {
|
| background: rgba(17, 24, 39, 0.8);
|
| border-bottom: 1px solid rgba(75, 85, 99, 0.3);
|
| }
|
|
|
|
|
| .gradient-bg {
|
| background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
|
| background-size: 400% 400%;
|
| animation: gradient 15s ease infinite;
|
| }
|
|
|
| .dark .gradient-bg {
|
| background: linear-gradient(-45deg, #1e3a8a, #7c3aed, #059669, #0891b2);
|
| background-size: 400% 400%;
|
| animation: gradient 15s ease infinite;
|
| }
|
|
|
| @keyframes gradient {
|
| 0% { background-position: 0% 50%; }
|
| 50% { background-position: 100% 50%; }
|
| 100% { background-position: 0% 50%; }
|
| }
|
|
|
|
|
| * {
|
| transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
|
| }
|
|
|
|
|
| ::-webkit-scrollbar {
|
| width: 10px;
|
| height: 10px;
|
| }
|
|
|
| ::-webkit-scrollbar-track {
|
| background: transparent;
|
| }
|
|
|
| ::-webkit-scrollbar-thumb {
|
| background: rgba(156, 163, 175, 0.5);
|
| border-radius: 5px;
|
| }
|
|
|
| .dark ::-webkit-scrollbar-thumb {
|
| background: rgba(75, 85, 99, 0.5);
|
| }
|
|
|
| ::-webkit-scrollbar-thumb:hover {
|
| background: rgba(107, 114, 128, 0.7);
|
| }
|
|
|
| .dark ::-webkit-scrollbar-thumb:hover {
|
| background: rgba(107, 114, 128, 0.7);
|
| }
|
| </style>
|
| {% block extra_head %}{% endblock %}
|
| </head>
|
| <body class="bg-gradient-to-br from-gray-50 to-gray-100 dark:from-gray-900 dark:to-gray-800 min-h-screen">
|
| {% block content %}{% endblock %}
|
| {% block extra_scripts %}{% endblock %}
|
|
|
|
|
| <script>
|
|
|
| function initTheme() {
|
| const theme = localStorage.getItem('theme') || 'dark';
|
| if (theme === 'dark') {
|
| document.documentElement.classList.add('dark');
|
| } else {
|
| document.documentElement.classList.remove('dark');
|
| }
|
| }
|
|
|
|
|
| function toggleTheme() {
|
| const isDark = document.documentElement.classList.contains('dark');
|
| if (isDark) {
|
| document.documentElement.classList.remove('dark');
|
| localStorage.setItem('theme', 'light');
|
| } else {
|
| document.documentElement.classList.add('dark');
|
| localStorage.setItem('theme', 'dark');
|
| }
|
| }
|
|
|
|
|
| initTheme();
|
| </script>
|
| </body>
|
| </html>
|
|
|