feat(templates/allauth): style allauth elements

This commit is contained in:
2026-03-10 14:19:20 +01:00
parent 8fb52132bb
commit 12200ad663
29 changed files with 414 additions and 0 deletions

View File

@@ -0,0 +1,68 @@
{% extends "allauth/layouts/base.html" %}
{% load allauth %}
{% block body %}
<div class="flex flex-grow flex-col md:flex-row">
<aside class="bg-slate-900 md:w-72">
<ul class="flex flex-col gap-1 p-3">
{% url 'account_email' as email_url_ %}
{% if email_url_ %}
<li>
<a class="{% block nav_class_email %}block rounded-md px-3 py-2 text-sm font-medium text-white transition-colors hover:bg-slate-800{% endblock %}"
href="{{ email_url_ }}">Change Email</a>
</li>
{% endif %}
{% url 'account_change_password' as change_password_url_ %}
{% if change_password_url_ %}
<li>
<a class="{% block nav_class_password %}block rounded-md px-3 py-2 text-sm font-medium text-white transition-colors hover:bg-slate-800{% endblock %}"
href="{{ change_password_url_ }}">Change Password</a>
</li>
{% endif %}
{% url 'account_change_phone' as phone_url_ %}
{% if phone_url_ %}
<li>
<a class="{% block nav_class_phone %}block rounded-md px-3 py-2 text-sm font-medium text-white transition-colors hover:bg-slate-800{% endblock %}"
href="{{ phone_url_ }}">Change Phone</a>
</li>
{% endif %}
{% url 'socialaccount_connections' as connections_url_ %}
{% if connections_url_ %}
<li>
<a class="{% block nav_class_socialaccount %}block rounded-md px-3 py-2 text-sm font-medium text-white transition-colors hover:bg-slate-800{% endblock %}"
href="{{ connections_url_ }}">Third-Party Accounts</a>
</li>
{% endif %}
{% url 'mfa_index' as mfa_index_url_ %}
{% if mfa_index_url_ %}
<li>
<a class="{% block nav_class_mfa %}block rounded-md px-3 py-2 text-sm font-medium text-white transition-colors hover:bg-slate-800{% endblock %}"
href="{{ mfa_index_url_ }}">Two-Factor Authentication</a>
</li>
{% endif %}
{% url 'usersessions_list' as usersessions_list_url_ %}
{% if usersessions_list_url_ %}
<li>
<a class="{% block nav_class_usersessions %}block rounded-md px-3 py-2 text-sm font-medium text-white transition-colors hover:bg-slate-800{% endblock %}"
href="{{ usersessions_list_url_ }}">Sessions</a>
</li>
{% endif %}
</ul>
</aside>
<main class="flex-1">
<div id="content" class="mx-auto w-full max-w-5xl px-4 sm:px-6 lg:px-8">
{% if messages %}
<div class="pt-4">
{% for message in messages %}
{% element alert level=message.tags %}
{% slot message %}
{{ message }}
{% endslot %}
{% endelement %}
{% endfor %}
</div>
{% endif %}
{% block content %}{% endblock %}
</div>
</main>
</div>
{% endblock %}