177 lines
No EOL
10 KiB
HTML
177 lines
No EOL
10 KiB
HTML
{% load static tailwind_tags gravatar %}
|
|
{% url 'home' as home_url %}
|
|
{% url 'trade_offer_list' as trade_offer_list_url %}
|
|
{% url 'trade_offer_my_list' as trade_offer_my_list_url %}
|
|
{% url 'settings' as settings_url %}
|
|
|
|
<!DOCTYPE html>
|
|
<html lang="en" data-theme="light">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<!-- Inline script to set the theme before rendering -->
|
|
<script>
|
|
(function () {
|
|
const savedTheme = localStorage.getItem('theme');
|
|
if (savedTheme === 'dark') {
|
|
document.documentElement.classList.add('dark');
|
|
document.documentElement.setAttribute('data-theme', 'dark');
|
|
} else {
|
|
document.documentElement.classList.remove('dark');
|
|
document.documentElement.setAttribute('data-theme', 'light');
|
|
}
|
|
})();
|
|
</script>
|
|
|
|
<title>[PᴋMɴ Trade Club] {% block title %}{% endblock title %}</title>
|
|
<link rel="shortcut icon" href="{% static 'images/favicon.ico' %}">
|
|
<!-- Choices.js -->
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/choices.js@11.0.6/public/assets/styles/choices.min.css" />
|
|
<script async src="https://cdn.jsdelivr.net/npm/choices.js@11.0.6/public/assets/scripts/choices.min.js"></script>
|
|
<!-- Tailwind CSS and Base stylesheet -->
|
|
{% tailwind_css %}
|
|
<link rel="stylesheet" href="{% static 'css/base.css' %}">
|
|
|
|
<!-- Floating UI -->
|
|
<script src="https://cdn.jsdelivr.net/npm/@floating-ui/core@1.6.9"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/@floating-ui/dom@1.6.13"></script>
|
|
{% block css %}{% endblock %}
|
|
|
|
{% block javascript_head %}{% endblock %}
|
|
</head>
|
|
<div class="min-h-screen bg-base-200">
|
|
<!-- Header and Navigation -->
|
|
<div class="navbar bg-base-100 shadow-sm">
|
|
<div class="navbar-start">
|
|
<div class="dropdown">
|
|
<div tabindex="0" role="button" class="btn btn-ghost hidden sm:flex md:hidden">
|
|
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h8m-8 6h16" /> </svg>
|
|
</div>
|
|
<ul
|
|
tabindex="0"
|
|
class="menu menu-sm dropdown-content bg-base-100 rounded-box z-1 mt-3 w-52 p-2 shadow">
|
|
<li><a href="{% url 'home' %}">Home</a></li>
|
|
<li>
|
|
<a>Trades</a>
|
|
<ul class="p-2">
|
|
<li><a href="{% url 'trade_offer_list' %}">All Offers</a></li>
|
|
<li><a href="{% url 'trade_offer_my_list' %}">My Trades</a></li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<a class="btn btn-ghost text-xl" href="{% url 'home' %}">
|
|
<span class="inline leading-none" aria-hidden="true">
|
|
<span class="inline-block relative align-text-top">P</span><span class="inline-block relative align-text-bottom">K</span><span class="inline-block relative align-text-top">M</span><span class="inline-block relative align-text-bottom">N</span>
|
|
<span class="inline-block relative">Trade Club</span>
|
|
</span>
|
|
<span aria-hidden="false" class="sr-only">Pokemon Trade Club</span>
|
|
</a>
|
|
</div>
|
|
<div class="navbar-center hidden md:flex">
|
|
<ul class="menu menu-horizontal px-1">
|
|
<li><a href="{% url 'home' %}">Home</a></li>
|
|
<li>
|
|
<details>
|
|
<summary>Trades</summary>
|
|
<ul class="p-2 w-32 z-10">
|
|
<li><a href="{% url 'trade_offer_list' %}">All Offers</a></li>
|
|
<li><a href="{% url 'trade_offer_my_list' %}">My Trades</a></li>
|
|
</ul>
|
|
</details>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="navbar-end">
|
|
|
|
<button id="theme-toggle-btn" class="btn btn-ghost btn-circle me-2" title="Toggle Theme">
|
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6 dark:hidden">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M12 3v2.25m6.364.386-1.591 1.591M21 12h-2.25m-.386 6.364-1.591-1.591M12 18.75V21m-4.773-4.227-1.591 1.591M5.25 12H3m4.227-4.773L5.636 5.636M15.75 12a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0Z" />
|
|
</svg>
|
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6 hidden dark:block">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M21.752 15.002A9.72 9.72 0 0 1 18 15.75c-5.385 0-9.75-4.365-9.75-9.75 0-1.33.266-2.597.748-3.752A9.753 9.753 0 0 0 3 11.25C3 16.635 7.365 21 12.75 21a9.753 9.753 0 0 0 9.002-5.998Z" />
|
|
</svg>
|
|
</button>
|
|
{% if user.is_authenticated %}
|
|
<div class="dropdown dropdown-end hidden sm:block">
|
|
<div tabindex="0" role="button" class="btn btn-ghost btn-circle avatar">
|
|
<div class="w-10 rounded-full">
|
|
{{ user.email|gravatar:40 }}
|
|
</div>
|
|
</div>
|
|
<ul
|
|
tabindex="0"
|
|
class="menu menu-sm dropdown-content bg-base-100 rounded-box z-1 mt-3 w-32 p-2 shadow">
|
|
<li>
|
|
<a class="flex items-center justify-between" href="https://www.gravatar.com/profile/" target="_blank" rel="noopener noreferrer">
|
|
<div>Profile</div>
|
|
<div>
|
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-4">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M13.5 6H5.25A2.25 2.25 0 0 0 3 8.25v10.5A2.25 2.25 0 0 0 5.25 21h10.5A2.25 2.25 0 0 0 18 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25" />
|
|
</svg>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="justify-between" href="{% url 'list_friend_codes' %}">
|
|
Friend Codes
|
|
</a>
|
|
</li>
|
|
<li><a href="{% url 'account_logout' %}">Sign Out</a></li>
|
|
</ul>
|
|
</div>
|
|
{% else %}
|
|
<div class="flex gap-2">
|
|
<a class="btn btn-primary" href="{% url 'account_login' %}">Login</a>
|
|
<a class="btn btn-secondary" href="{% url 'account_signup' %}">Sign Up</a>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Main Content -->
|
|
<main class="container mx-auto p-4 sm:w-4/5 md:w-full xl:w-256">
|
|
{% include '_messages.html' %}
|
|
{% block content %}{% endblock %}
|
|
</main>
|
|
|
|
<!-- Footer -->
|
|
<footer class="bg-base-200 text-base-content p-4">
|
|
<div class="container mx-auto text-center">
|
|
<p>© {% now "Y" %} PKMNTrade.Club. All rights reserved.</p>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Dock -->
|
|
<div x-data class="dock bg-neutral text-neutral-content sm:hidden">
|
|
<button @click="window.location.href = '{{ home_url }}'" class="{% if request.path == home_url %}dock-active{% endif %}">
|
|
<svg class="size-[1.2em]" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g fill="currentColor" stroke-linejoin="miter" stroke-linecap="butt"><polyline points="1 11 12 2 23 11" fill="none" stroke="currentColor" stroke-miterlimit="10" stroke-width="2"></polyline><path d="m5,13v7c0,1.105.895,2,2,2h10c1.105,0,2-.895,2-2v-7" fill="none" stroke="currentColor" stroke-linecap="square" stroke-miterlimit="10" stroke-width="2"></path><line x1="12" y1="22" x2="12" y2="18" fill="none" stroke="currentColor" stroke-linecap="square" stroke-miterlimit="10" stroke-width="2"></line></g></svg>
|
|
<span class="dock-label">Home</span>
|
|
</button>
|
|
<button @click="window.location.href = '{{ trade_offer_list_url }}'" class="{% if request.path == trade_offer_list_url %}dock-active{% endif %}">
|
|
<svg class="size-[1.2em]" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6"><path stroke-linecap="round" stroke-linejoin="round" d="M3.75 12h16.5m-16.5 3.75h16.5M3.75 19.5h16.5M5.625 4.5h12.75a1.875 1.875 0 0 1 0 3.75H5.625a1.875 1.875 0 0 1 0-3.75Z" /></svg>
|
|
<span class="dock-label">All Offers</span>
|
|
</button>
|
|
<button @click="window.location.href = '{{ trade_offer_my_list_url }}'" class="{% if request.path == trade_offer_my_list_url %}dock-active{% endif %}">
|
|
<svg class="size-[1.2em]" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6"><path stroke-linecap="round" stroke-linejoin="round" d="M3 7.5 7.5 3m0 0L12 7.5M7.5 3v13.5m13.5 0L16.5 21m0 0L12 16.5m4.5 4.5V7.5" /></svg>
|
|
<span class="dock-label">My Trades</span>
|
|
</button>
|
|
<button @click="window.location.href = '{{ settings_url }}'" class="{% if request.path == settings_url %}dock-active{% endif %}">
|
|
{% if user.is_authenticated %}<div tabindex="0" role="button" class="avatar"><div class="w-6 rounded-full">{{ user.email|gravatar:40 }}</div></div>{% else %}<svg class="size-[1.2em]" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g fill="currentColor" stroke-linejoin="miter" stroke-linecap="butt"><circle cx="12" cy="12" r="3" fill="none" stroke="currentColor" stroke-linecap="square" stroke-miterlimit="10" stroke-width="2"></circle><path d="m22,13.25v-2.5l-2.318-.966c-.167-.581-.395-1.135-.682-1.654l.954-2.318-1.768-1.768-2.318.954c-.518-.287-1.073-.515-1.654-.682l-.966-2.318h-2.5l-.966,2.318c-.581.167-1.135.395-1.654.682l-2.318-.954-1.768,1.768.954,2.318c-.287.518-.515,1.073-.682,1.654l-2.318.966v2.5l2.318.966c.167.581.395,1.135.682,1.654l-.954,2.318,1.768,1.768,2.318-.954c.518.287,1.073.515,1.654.682l.966,2.318h2.5l.966-2.318c.581-.167,1.135-.395,1.654-.682l2.318.954,1.768-1.768-.954-2.318c.287-.518.515-1.073.682-1.654l2.318-.966Z" fill="none" stroke="currentColor" stroke-linecap="square" stroke-miterlimit="10" stroke-width="2"></path></g></svg>{% endif %}
|
|
<span class="dock-label">Settings</span>
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Alpine Plugins -->
|
|
<script defer src="https://cdn.jsdelivr.net/npm/@alpinejs/collapse@3.14.8/dist/cdn.min.js"></script>
|
|
|
|
<!-- Alpine Core -->
|
|
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.14.8/dist/cdn.min.js"></script>
|
|
|
|
<script defer src="{% static 'js/tooltip.js' %}"></script>
|
|
|
|
<script defer src="{% static 'js/base.js' %}"></script>
|
|
{% block javascript %}{% endblock %}
|
|
</body>
|
|
</html> |