Flatlogic Bot 16066e4ba4 Mock 5
2026-02-06 20:41:24 +00:00

51 lines
2.1 KiB
HTML

{% extends 'base.html' %}
{% block title %}Login | {{ project_name }}{% endblock %}
{% block content %}
<div class="container py-5">
<div class="row justify-content-center">
<div class="col-md-5">
<div class="card bg-card border-0 rounded-4 p-4 shadow-lg">
<h2 class="h4 mb-4 fw-bold">Login</h2>
{% if form.errors %}
<div class="alert alert-danger small">
Your username and password didn't match. Please try again.
</div>
{% endif %}
<form method="post" action="{% url 'login' %}">
{% csrf_token %}
<div class="mb-3">
<label for="id_username" class="form-label text-muted small">Username</label>
<input type="text" name="username" autofocus maxlength="150" required id="id_username" class="form-control bg-dark border-secondary text-white">
</div>
<div class="mb-3">
<label for="id_password" class="form-label text-muted small">Password</label>
<input type="password" name="password" required id="id_password" class="form-control bg-dark border-secondary text-white">
</div>
<button type="submit" class="btn btn-primary-custom w-100 mt-3 fw-bold">Login</button>
<input type="hidden" name="next" value="{{ next }}">
</form>
<div class="mt-4 text-center">
<p class="small text-muted mb-0">Don't have an account? <a href="{% url 'signup' %}" class="text-accent-green text-decoration-none">Create one</a></p>
</div>
</div>
</div>
</div>
</div>
<style>
.text-accent-green { color: var(--accent-green); }
.bg-card { background-color: var(--card-bg); }
.form-control:focus {
background-color: var(--bg-dark);
border-color: var(--accent-green);
box-shadow: 0 0 0 0.25rem rgba(0, 255, 173, 0.1);
color: white;
}
</style>
{% endblock %}