206 lines
8.9 KiB
HTML
206 lines
8.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" class="dark">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Deck Admin</title>
|
|
|
|
<!-- Tailwind CSS v4.1.4 CDN -->
|
|
<script src="https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio"></script>
|
|
|
|
<!-- Tailwind Config (Dark Mode + Theme Colors) -->
|
|
<script>
|
|
tailwind.config = {
|
|
darkMode: 'class',
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
background: '#121418', // dark slate with blue/gray tone
|
|
surface: '#1e2127', // a bit lighter for containers/cards
|
|
border: '#2a2d34', // visible but subtle borders
|
|
primary: '#4f8cff', // soft blue that pops but is not neon
|
|
text: '#e4e4e7', // light gray for high contrast
|
|
muted: '#a0a0ad', // for subdued text
|
|
},
|
|
},
|
|
}
|
|
};
|
|
</script>
|
|
|
|
|
|
<!-- Flowbite -->
|
|
<link href="https://cdn.jsdelivr.net/npm/flowbite@3.1.2/dist/flowbite.min.css" rel="stylesheet">
|
|
</head>
|
|
<body class="bg-background text-text min-h-screen font-sans">
|
|
<nav class="bg-white border-gray-200 dark:bg-gray-900">
|
|
<div class="max-w-screen-xl flex flex-wrap items-center x-auto p-4">
|
|
<a href="{{url_for('main.index')}}" class="flex items-center space-x-3 rtl:space-x-reverse">
|
|
<span class="self-center text-2xl font-semibold whitespace-nowrap dark:text-white">Tutortool</span>
|
|
</a>
|
|
<div class="w-auto" id="navbar-default">
|
|
<ul class="font-medium p-0 py-2 border border-gray-100 rounded-lg bg-gray-50 flex flex-row space-x-8 rtl:space-x-reverse mt-0 border-0 bg-white dark:bg-gray-800 dark:bg-gray-900 dark:border-gray-700 justify-between">
|
|
<li>
|
|
<a href="{{url_for('main.admin')}}" class="rounded-sm bg-transparent text-blue-700 p-0 dark:text-blue-500" aria-current="page">Deck Admin</a>
|
|
</li>
|
|
<li>
|
|
<a href="{{url_for('main.banner')}}" class="text-grey-900 dark:hover:text-blue-500 hover:text-blue-700 rounded-sm bg-transparent dark:text-white">Banner</a>
|
|
</li>
|
|
<li>
|
|
<a href="{{url_for('main.confused_notifications')}}" class="text-grey-900 dark:hover:text-blue-500 hover:text-blue-700 rounded-sm bg-transparent p-0 dark:text-white">Confused</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="container mx-auto px-6 py-10 space-y-12">
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-10">
|
|
|
|
<!-- Deck Form + Decks -->
|
|
<div class="bg-surface rounded-xl p-6 shadow-lg space-y-6">
|
|
<h2 class="text-2xl font-semibold">Add New Deck</h2>
|
|
<form method="POST" class="space-y-4">
|
|
{{ deck_form.hidden_tag() }}
|
|
|
|
<div>
|
|
<label class="block mb-1 text-sm font-medium">{{ deck_form.name.label }}</label>
|
|
{{ deck_form.name(class="w-full rounded-lg p-3 bg-background border border-border text-text placeholder-muted focus:outline-none focus:ring-2 focus:ring-primary") }}
|
|
</div>
|
|
|
|
<div>
|
|
<label class="block mb-1 text-sm font-medium">{{ deck_form.deck.label }}</label>
|
|
{{ deck_form.deck(multiple=True, class="w-full rounded-lg p-3 bg-background border border-border text-text placeholder-muted focus:outline-none focus:ring-2 focus:ring-primary") }}
|
|
</div>
|
|
|
|
<div>
|
|
<label class="block mb-1 text-sm font-medium">{{ deck_form.description.label }}</label>
|
|
{{ deck_form.description(class="w-full rounded-lg p-3 bg-background border border-border text-text placeholder-muted focus:outline-none focus:ring-2 focus:ring-primary") }}
|
|
</div>
|
|
|
|
<div>
|
|
{{ deck_form.submit_deck(class="w-full bg-primary hover:bg-blue-700 text-white py-2 px-4 rounded-lg") }}
|
|
</div>
|
|
</form>
|
|
|
|
<!-- Existing Decks Table -->
|
|
<h2 class="text-2xl font-semibold pt-6">Existing Decks</h2>
|
|
{% if decks %}
|
|
<div class="overflow-x-auto">
|
|
<table class="w-full table-auto text-left text-sm">
|
|
<thead class="text-muted border-b border-border">
|
|
<tr>
|
|
<th class="px-4 py-2">Name</th>
|
|
<th class="px-4 py-2">Passwords</th>
|
|
<th class="px-4 py-2">Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for deck in decks %}
|
|
<tr class="border-b border-border hover:bg-background/30">
|
|
<td class="px-4 py-2 font-medium">{{ deck.name }}</td>
|
|
<td class="px-4 py-2">
|
|
{% if deck.passwords %}
|
|
<ul class="list-disc list-inside text-muted">
|
|
{% for password in deck.passwords %}
|
|
<li>{{ password.value }}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% else %}
|
|
<em class="text-muted">None</em>
|
|
{% endif %}
|
|
</td>
|
|
<td class="px-4 py-2">
|
|
<form method="POST" action="{{ url_for('main.delete_deck', deck_id=deck.id) }}">
|
|
<button type="submit" class="bg-red-600 hover:bg-red-700 text-white px-3 py-1 rounded-lg text-sm">Delete</button>
|
|
</form>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% else %}
|
|
<p class="text-center text-muted">No decks available.</p>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<!-- Password Form + Passwords -->
|
|
<div class="bg-surface rounded-xl p-6 shadow-lg space-y-6">
|
|
<h2 class="text-2xl font-semibold">Add New Password</h2>
|
|
<form method="POST" class="space-y-4">
|
|
{{ password_form.hidden_tag() }}
|
|
|
|
<div>
|
|
<label class="block mb-1 text-sm font-medium">{{ password_form.value.label }}</label>
|
|
{{ password_form.value(class="w-full rounded-lg p-3 bg-background border border-border text-text placeholder-muted focus:outline-none focus:ring-2 focus:ring-primary") }}
|
|
</div>
|
|
|
|
<div>
|
|
<label class="block mb-1 text-sm font-medium">{{ password_form.expires_at.label }}</label>
|
|
{{ password_form.expires_at(class="w-full rounded-lg p-3 bg-background border border-border text-text placeholder-muted focus:outline-none focus:ring-2 focus:ring-primary", type="datetime-local") }}
|
|
</div>
|
|
|
|
<div>
|
|
<label class="block mb-1 text-sm font-medium">{{ password_form.decks.label }}</label>
|
|
{{ password_form.decks(class="w-full rounded-lg p-3 bg-background border border-border text-text placeholder-muted focus:outline-none focus:ring-2 focus:ring-primary") }}
|
|
</div>
|
|
|
|
<div>
|
|
{{ password_form.submit_password(class="w-full bg-primary hover:bg-blue-700 text-white py-2 px-4 rounded-lg") }}
|
|
</div>
|
|
</form>
|
|
|
|
<!-- Existing Passwords Table -->
|
|
<h2 class="text-2xl font-semibold pt-6">Existing Passwords</h2>
|
|
{% if passwords %}
|
|
<div class="overflow-x-auto">
|
|
<table class="w-full table-auto text-left text-sm">
|
|
<thead class="text-muted border-b border-border">
|
|
<tr>
|
|
<th class="px-4 py-2">Password</th>
|
|
<th class="px-4 py-2">Expires</th>
|
|
<th class="px-4 py-2">Decks</th>
|
|
<th class="px-4 py-2">Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for password in passwords %}
|
|
<tr class="border-b border-border hover:bg-background/30">
|
|
<td class="px-4 py-2 font-medium">{{ password.value }}</td>
|
|
<td class="px-4 py-2">{{ password.expires_at }}</td>
|
|
<td class="px-4 py-2">
|
|
{% if password.decks %}
|
|
<ul class="list-disc list-inside text-muted">
|
|
{% for deck in password.decks %}
|
|
<li>{{ deck.name }}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% else %}
|
|
<em class="text-muted">None</em>
|
|
{% endif %}
|
|
</td>
|
|
<td class="px-4 py-2">
|
|
<form method="POST" action="{{ url_for('main.delete_password', password_id=password.id) }}">
|
|
<button type="submit" class="bg-red-600 hover:bg-red-700 text-white px-3 py-1 rounded-lg text-sm">Delete</button>
|
|
</form>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% else %}
|
|
<p class="text-center text-muted">No passwords available.</p>
|
|
{% endif %}
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/flowbite@3.1.2/dist/flowbite.min.js"></script>
|
|
</body>
|
|
</html>
|
|
|