|
1
|
{% extends "base.html" %} |
|
2
|
{% load static %} |
|
3
|
{% block title %}Sign In — Fossilrepo{% endblock %} |
|
4
|
|
|
5
|
{% block extra_head %} |
|
6
|
{% if turnstile_enabled %} |
|
7
|
<script src="https://challenges.cloudflare.com/turnstile/v0/api.js" async defer></script> |
|
8
|
{% endif %} |
|
9
|
{% endblock %} |
|
10
|
|
|
11
|
{% block content %} |
|
12
|
<div class="flex min-h-[80vh] items-center justify-center"> |
|
13
|
<div class="w-full max-w-sm space-y-8"> |
|
14
|
<div class="flex flex-col items-center"> |
|
15
|
<img src="{% static 'img/fossilrepo-logo-dark.png' %}" alt="Fossilrepo" class="h-12 w-auto mb-6"> |
|
16
|
<h2 class="text-center text-3xl font-bold tracking-tight text-gray-100">Sign in</h2> |
|
17
|
<p class="mt-2 text-center text-sm text-gray-400">Fossilrepo Django + HTMX</p> |
|
18
|
</div> |
|
19
|
|
|
20
|
{% if form.errors %} |
|
21
|
<div class="rounded-md bg-red-900/50 border border-red-700 p-4"> |
|
22
|
<p class="text-sm text-red-300">Invalid username or password.</p> |
|
23
|
</div> |
|
24
|
{% endif %} |
|
25
|
|
|
26
|
{% if turnstile_error %} |
|
27
|
<div class="rounded-md bg-red-900/50 border border-red-700 p-4"> |
|
28
|
<p class="text-sm text-red-300">Bot verification failed. Please try again.</p> |
|
29
|
</div> |
|
30
|
{% endif %} |
|
31
|
|
|
32
|
<form method="post" class="space-y-6"> |
|
33
|
{% csrf_token %} |
|
34
|
<div> |
|
35
|
<label for="id_username" class="block text-sm font-medium text-gray-300">Username</label> |
|
36
|
<div class="mt-1">{{ form.username }}</div> |
|
37
|
</div> |
|
38
|
<div> |
|
39
|
<label for="id_password" class="block text-sm font-medium text-gray-300">Password</label> |
|
40
|
<div class="mt-1">{{ form.password }}</div> |
|
41
|
</div> |
|
42
|
{% if turnstile_enabled %} |
|
43
|
<div class="cf-turnstile" data-sitekey="{{ turnstile_site_key }}" data-theme="dark"></div> |
|
44
|
{% endif %} |
|
45
|
<button type="submit" |
|
46
|
class="w-full rounded-md bg-brand px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-brand-hover focus:outline-none focus:ring-2 focus:ring-brand focus:ring-offset-2 focus:ring-offset-gray-950 transition-colors"> |
|
47
|
Sign in |
|
48
|
</button> |
|
49
|
</form> |
|
50
|
</div> |
|
51
|
</div> |
|
52
|
{% endblock %} |
|
53
|
|