Adrian A. Baumann
e172e2f9dc
All checks were successful
Build containers when image tags change / build-if-image-changed (., web, containers, main container, git.baumann.gr/adebaumann/labhelper) (push) Successful in 16s
Build containers when image tags change / build-if-image-changed (data-loader, loader, initContainers, init-container, git.baumann.gr/adebaumann/labhelper-data-loader) (push) Successful in 3s
79 lines
2.9 KiB
HTML
79 lines
2.9 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Login - LabHelper{% endblock %}
|
|
|
|
{% block page_header %}
|
|
<div class="page-header">
|
|
<h1><i class="fas fa-sign-in-alt"></i> Login</h1>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="section" style="max-width: 500px; margin: 0 auto;">
|
|
{% if form.errors %}
|
|
<div class="alert alert-error">
|
|
<i class="fas fa-exclamation-circle"></i> Your username and password didn't match. Please try again.
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if next %}
|
|
{% if user.is_authenticated %}
|
|
<div class="alert alert-error">
|
|
<i class="fas fa-info-circle"></i> Your account doesn't have access to this page. To proceed,
|
|
please login with an account that has access.
|
|
</div>
|
|
{% else %}
|
|
<div class="alert alert-error">
|
|
<i class="fas fa-info-circle"></i> Please login to see this page.
|
|
</div>
|
|
{% endif %}
|
|
{% endif %}
|
|
|
|
<form method="post" action="{% url 'login' %}" style="display: flex; flex-direction: column; gap: 20px;">
|
|
{% csrf_token %}
|
|
|
|
<div>
|
|
<label for="{{ form.username.id_for_label }}" style="display: block; font-weight: 600; margin-bottom: 8px; color: #555;">
|
|
<i class="fas fa-user"></i> Username
|
|
</label>
|
|
<input type="{{ form.username.field.widget.input_type }}"
|
|
name="{{ form.username.name }}"
|
|
id="{{ form.username.id_for_label }}"
|
|
{% if form.username.value %}value="{{ form.username.value }}"{% endif %}
|
|
required
|
|
autofocus
|
|
style="width: 100%; padding: 12px 16px; border: 2px solid #e0e0e0; border-radius: 10px; font-size: 15px; transition: all 0.3s;">
|
|
</div>
|
|
|
|
<div>
|
|
<label for="{{ form.password.id_for_label }}" style="display: block; font-weight: 600; margin-bottom: 8px; color: #555;">
|
|
<i class="fas fa-lock"></i> Password
|
|
</label>
|
|
<input type="password"
|
|
name="{{ form.password.name }}"
|
|
id="{{ form.password.id_for_label }}"
|
|
required
|
|
style="width: 100%; padding: 12px 16px; border: 2px solid #e0e0e0; border-radius: 10px; font-size: 15px; transition: all 0.3s;">
|
|
</div>
|
|
|
|
<input type="hidden" name="next" value="{{ next }}">
|
|
|
|
<button type="submit" class="btn" style="justify-content: center; margin-top: 10px;">
|
|
<i class="fas fa-sign-in-alt"></i> Login
|
|
</button>
|
|
</form>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block extra_js %}
|
|
<script>
|
|
$('input[type="text"], input[type="password"]').on('focus', function() {
|
|
$(this).css('border-color', '#667eea');
|
|
$(this).css('box-shadow', '0 0 0 3px rgba(102, 126, 234, 0.1)');
|
|
}).on('blur', function() {
|
|
$(this).css('border-color', '#e0e0e0');
|
|
$(this).css('box-shadow', 'none');
|
|
});
|
|
</script>
|
|
{% endblock %}
|