mirror of
https://github.com/wowlikon/LiB.git
synced 2026-02-04 04:31:09 +00:00
77 lines
5.3 KiB
HTML
77 lines
5.3 KiB
HTML
<!doctype html>
|
||
<html lang="ru">
|
||
<head>
|
||
<title>{% block title %}LiB{% endblock %}</title>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<script async="" src="https://cdnjs.cloudflare.com/ajax/libs/js-sha256/0.11.0/sha256.min.js"></script>
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/cash/8.1.5/cash.min.js"></script>
|
||
<script src="https://cdn.tailwindcss.com"></script>
|
||
<link rel="stylesheet" href="/static/styles.css" />
|
||
{% block extra_head %}{% endblock %}
|
||
</head>
|
||
<body class="flex flex-col min-h-screen bg-gray-100">
|
||
<header class="bg-gray-500 text-white p-4 shadow-md">
|
||
<div class="mx-auto pl-5 pr-3 flex justify-between items-center">
|
||
<a class="flex gap-4 items-center max-w-10 h-auto" href="/">
|
||
<img class="invert" src="/static/logo.svg" />
|
||
<h1 class="text-2xl font-bold">LiB</h1>
|
||
</a>
|
||
<nav>
|
||
<ul class="flex space-x-4">
|
||
<li><a href="/" class="hover:text-gray-200">Главная</a></li>
|
||
<li><a href="/books" class="hover:text-gray-200">Книги</a></li>
|
||
<li><a href="/about" class="hover:text-gray-200">О нас</a></li>
|
||
<li><a href="/api" class="hover:text-gray-200">API</a></li>
|
||
</ul>
|
||
</nav>
|
||
<div class="relative" id="user-menu-area">
|
||
<a href="/auth" id="guest-link" class="block hover:opacity-80 transition"><img class="w-6 h-6 invert" src="/static/avatar.svg" /></a>
|
||
<button type="button" id="user-btn" class="hidden items-center gap-2 hover:opacity-80 transition focus:outline-none">
|
||
<img
|
||
id="user-avatar"
|
||
src="https://www.gravatar.com/avatar/00000000000000000000000000000000?d=mp&f=y"
|
||
class="w-8 h-8 rounded-full border-2 border-white object-cover bg-gray-600"
|
||
alt="User Avatar"
|
||
/>
|
||
|
||
<svg id="user-arrow" class="w-4 h-4 transition-transform duration-200" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/>
|
||
</svg>
|
||
</button>
|
||
<div id="user-dropdown" class="hidden absolute right-0 mt-2 w-56 bg-white rounded-lg shadow-lg border border-gray-200 z-50 overflow-hidden">
|
||
<div class="px-4 py-3 border-b border-gray-200">
|
||
<p id="dropdown-name" class="text-sm font-semibold text-gray-900 truncate">Пользователь</p>
|
||
<p id="dropdown-username" class="text-sm text-gray-500 truncate">@username</p>
|
||
<p id="dropdown-email" class="text-xs text-gray-400 truncate mt-1">email@example.com</p>
|
||
</div>
|
||
<a href="/profile" class="flex items-center px-4 py-2 text-sm hover:bg-gray-100">
|
||
<svg class="w-4 h-4 mr-3 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"></path></svg>
|
||
<p class="text-gray-700 text-sm">Мой профиль</p>
|
||
</a>
|
||
<a href="/my-books" class="flex items-center px-4 py-2 text-sm hover:bg-gray-100">
|
||
<svg class="w-4 h-4 mr-3 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"></path></svg>
|
||
<p class="text-gray-700 text-sm">Мои книги</p>
|
||
</a>
|
||
<div class="border-t border-gray-200 mt-1 pt-1">
|
||
<button type="button" id="logout-btn" class="flex items-center w-full px-4 py-2 text-sm text-red-600 hover:bg-red-50">
|
||
<svg class="w-4 h-4 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"></path></svg>
|
||
<p class="text-gray-700 text-sm">Выйти</p>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
{% block content %}{% endblock %}
|
||
|
||
<footer class="bg-gray-800 text-white p-4 mt-8">
|
||
<div class="container mx-auto text-center">
|
||
<p>© 2025 My Awesome Library. All rights reserved.</p>
|
||
</div>
|
||
</footer>
|
||
|
||
{% block scripts %}{% endblock %}
|
||
</body>
|
||
</html> |