jlengrand/bugsink
1
0
Fork 0
mirror of https://github.com/jlengrand/bugsink.git synced 2026-03-10 08:01:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Non-ugly login page

Browse Source
This commit is contained in:
Klaas van Schelven
2024-05-27 15:10:01 +02:00
parent 7cf521ce74
commit 9b6409f0cd
3 changed files with 60 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
templates/bugsink/login.html
View File

@@ -1,40 +1,51 @@
{% extends "base.html" %}
{% extends "barest_base.html" %}
{% load static %}
{# from https://docs.djangoproject.com/en/5.0/topics/auth/default/#django.contrib.auth.views.LoginView #}
{% block title %}Log in · {{ site_title }}{% endblock %}
{% block content %}
<div class="m-4">
<h1 class="text-4xl mt-4">{{ site_title }} Log in</h1>
{% if form.errors %}
<p>Your username and password didn't match. Please try again.</p>
{% endif %}
<div class="bg-cyan-100 h-screen overflow-hidden flex items-center justify-center"> {# the cyan background #}
<div class="bg-white lg:w-5/12 md:6/12 w-10/12"> {# the centered box #}
<div class="bg-slate-200 absolute left-1/2 transform -translate-x-1/2 -translate-y-1/2 rounded-full p-4 md:p-8"> {# the logo #}
<a href="/"><img src="{% static 'images/bugsink-logo.png' %}" class="h-8 w-8 md:h-16 md:w-16" alt="Bugsink"></a>
</div>
{% if next %}
{% if user.is_authenticated %}
<p>Your account doesn't have access to this page. To proceed, please login with an account that has access.</p>
{% else %}
<p>Please login to see this page.</p>
{% endif %}
{% endif %}
<div class="p-12 md:pt-24 md:pl-24 md:pr-24 md:pb-16">
<form method="post" action="{% url 'login' %}">
{% csrf_token %}
<table>
<tr>
<td>{{ form.username.label_tag }}</td>
<td>{{ form.username }}</td>
</tr>
<tr>
<td>{{ form.password.label_tag }}</td>
<td>{{ form.password }}</td>
</tr>
</table>
{% if form.errors %}
<div class="mb-8">Your username and password didn't match. Please try again.</div>
<input type="submit" value="login">
<input type="hidden" name="next" value="{{ next }}">
</form>
{% elif next %}
{% if user.is_authenticated %}
<div class="mb-8">Your account doesn't have access to this page. To proceed, please login with an account that has access.</div>
{% else %}
<div class="mb-8">Please login to see this page.</div>
{% endif %}
{% endif %}
<form method="post" action="{% url 'login' %}">
{% csrf_token %}
<div class="flex items-center text-lg mb-6 md:mb-8">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="absolute ml-3" width="24">
<path fill-rule="evenodd" d="M7.5 6a4.5 4.5 0 1 1 9 0 4.5 4.5 0 0 1-9 0ZM3.751 20.105a8.25 8.25 0 0 1 16.498 0 .75.75 0 0 1-.437.695A18.683 18.683 0 0 1 12 22.5c-2.786 0-5.433-.608-7.812-1.7a.75.75 0 0 1-.437-.695Z" clip-rule="evenodd" />
</svg>
<input name="username" type="text" class="bg-slate-200 pl-12 py-2 md:py-4 focus:outline-none w-full" placeholder="Username" />
</div>
<div class="flex items-center text-lg mb-6 md:mb-8">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="absolute ml-3" width="24">
<path fill-rule="evenodd" d="M12 1.5a5.25 5.25 0 0 0-5.25 5.25v3a3 3 0 0 0-3 3v6.75a3 3 0 0 0 3 3h10.5a3 3 0 0 0 3-3v-6.75a3 3 0 0 0-3-3v-3c0-2.9-2.35-5.25-5.25-5.25Zm3.75 8.25v-3a3.75 3.75 0 1 0-7.5 0v3h7.5Z" clip-rule="evenodd" />
</svg>
<input name="password" type="password" class="bg-slate-200 pl-12 py-2 md:py-4 focus:outline-none w-full" placeholder="Password" />
</div>
<input type="hidden" name="next" value="{{ next }}">
<button class="bg-slate-800 font-medium p-2 md:p-4 text-white uppercase w-full">Login</button>
</form>
</div>
</div>
</div>
{% endblock %}

2
theme/static/css/dist/styles.css vendored
View File

File diff suppressed because one or more lines are too long

20
theme/templates/barest_base.html Normal file
View File

@@ -0,0 +1,20 @@
{% load static tailwind_tags %}<!DOCTYPE html>{# copy of bare_base.html, but without even a menu bar #}
<html lang="en">
<head>
<title>{% block title %}Bugsink{% endblock %}</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
{% tailwind_preload_css %}
{% tailwind_css %}
</head>
<body>
<div id="content">
<div>
{% block content %}{% endblock %}
</div>
</div>
{% block extra_js %}{% endblock %}
</body>
</html>