mirror/bugsink
1
0
Fork 0
mirror of https://github.com/bugsink/bugsink.git synced 2026-05-12 18:29:12 -05:00
Code Issues Packages Projects Releases Wiki Activity

Factor out 'tailwind_formfield' tag

Browse Source
This commit is contained in:
Klaas van Schelven
2024-06-10 10:00:06 +02:00
parent 0549f5a7d1
commit d71916940a
8 changed files with 36 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files
projects/templates/projects/project_members_invite.html
+2 -12
View File
@@ -1,12 +1,11 @@
{% extends "base.html" %}
{% load static %}
{% load tailwind_forms %}
{% block title %}Invite Members · {{ project.name }} · {{ site_title }}{% endblock %}
{% block content %}
<div class="flex items-center justify-center">
<div class="m-4 max-w-4xl flex-auto">
@@ -30,16 +29,7 @@
Invite a member to join the project "{{ project.name }}". They will receive an email with a link to join.
</div>
<div class="text-lg mb-6 md:mb-8">
<input name="email" type="text" class="{% if form.email.errors %}bg-red-100{% else %}bg-slate-100{% endif %} pl-4 py-2 md:py-4 focus:outline-none w-full" {% if form.email.value %}value="{{ form.email.value }}"{% endif %} placeholder="{{ form.email.label }}" />
{% if form.email.errors %}
{% for error in form.email.errors %}
<div class="text-red-500 pt-1 px-2 text-sm">{{ error }}</div>
{% endfor %}
{% elif form.email.help_text %}
<div class="text-gray-500 pt-1 px-2 text-sm">{{ form.email.help_text|safe }}</div>
{% endif %}
</div>
{% tailwind_formfield form.email %}
<div class="text-lg ml-1 mb-8"> {# ml-1 is strictly speaking not aligned, but visually it looks better "to me"; perhaps because of all of the round elements? #}
<div class="text-slate-800 font-bold">{{ form.role.label }}</div>
teams/templates/teams/team_members_invite.html
+2 -10
View File
@@ -1,5 +1,6 @@
{% extends "base.html" %}
{% load static %}
{% load tailwind_forms %}
{% block title %}Invite Members · {{ team.name }} · {{ site_title }}{% endblock %}
@@ -30,16 +31,7 @@
Invite a member to join the team "{{ team.name }}". They will receive an email with a link to join.
</div>
<div class="text-lg mb-6 md:mb-8">
<input name="email" type="text" class="{% if form.email.errors %}bg-red-100{% else %}bg-slate-100{% endif %} pl-4 py-2 md:py-4 focus:outline-none w-full" {% if form.email.value %}value="{{ form.email.value }}"{% endif %} placeholder="{{ form.email.label }}" />
{% if form.email.errors %}
{% for error in form.email.errors %}
<div class="text-red-500 pt-1 px-2 text-sm">{{ error }}</div>
{% endfor %}
{% elif form.email.help_text %}
<div class="text-gray-500 pt-1 px-2 text-sm">{{ form.email.help_text|safe }}</div>
{% endif %}
</div>
{% tailwind_formfield form.email %}
<div class="text-lg ml-1 mb-8"> {# ml-1 is strictly speaking not aligned, but visually it looks better "to me"; perhaps because of all of the round elements? #}
<div class="text-slate-800 font-bold">{{ form.role.label }}</div>
templates/signup.html
+4 -32
View File
@@ -1,5 +1,6 @@
{% extends "barest_base.html" %}
{% load static %}
{% load tailwind_forms %}
{% block title %}Sign up · {{ site_title }}{% endblock %}
@@ -16,38 +17,9 @@
<form method="post" action=".">
{% csrf_token %}
<div class="text-lg mb-6 md:mb-8">
<input name="username" type="text" class="{% if form.username.errors %}bg-red-100{% else %}bg-slate-200{% endif %} pl-4 py-2 md:py-4 focus:outline-none w-full" {% if form.username.value %}value="{{ form.username.value }}"{% endif %} placeholder="{{ form.username.label }}" />
{% if form.username.errors %}
{% for error in form.username.errors %}
<div class="text-red-500 pt-1 px-2 text-sm">{{ error }}</div>
{% endfor %}
{% elif form.username.help_text %}
<div class="text-gray-500 pt-1 px-2 text-sm">{{ form.username.help_text|safe }}</div>
{% endif %}
</div>
<div class="text-lg mb-6 md:mb-8">
<input name="password1" type="password" class="{% if form.password1.errors %}bg-red-100{% else %}bg-slate-200{% endif %} pl-4 py-2 md:py-4 focus:outline-none w-full" {% if form.password1.value %}value="{{ form.password1.value }}"{% endif %} placeholder="{{ form.password1.label }}" />
{% if form.password1.errors %}
{% for error in form.password1.errors %}
<div class="text-red-500 pt-1 px-2 text-sm">{{ error }}</div>
{% endfor %}
{% elif form.password1.help_text %}
<div class="text-gray-500 pt-1 px-2 text-sm">{{ form.password1.help_text|safe }}</div>
{% endif %}
</div>
<div class="text-lg mb-6 md:mb-8">
<input name="password2" type="password" class="{% if form.password2.errors %}bg-red-100{% else %}bg-slate-200{% endif %} pl-4 py-2 md:py-4 focus:outline-none w-full" {% if form.password2.value %}value="{{ form.password2.value }}"{% endif %} placeholder="{{ form.password2.label }}" />
{% if form.password2.errors %}
{% for error in form.password2.errors %}
<div class="text-red-500 pt-1 px-2 text-sm">{{ error }}</div>
{% endfor %}
{% elif form.password2.help_text %}
<div class="text-gray-500 pt-1 px-2 text-sm">{{ form.password2.help_text|safe }}</div>
{% endif %}
</div>
{% tailwind_formfield form.user %}
{% tailwind_formfield form.password1 %}
{% tailwind_formfield form.password2 %}
<button class="bg-slate-800 font-medium p-2 md:p-4 text-white uppercase w-full">Sign up</button>
theme/templates/tailwind_forms/formfield.html
+12
View File
@@ -0,0 +1,12 @@
{% if formfield %}
<div class="text-lg mb-6 md:mb-8">
<input name="{{ formfield.name }}" type="{{ formfield.field.widget.input_type }}" class="{% if formfield.errors %}bg-red-100{% else %}bg-slate-100{% endif %} pl-4 py-2 md:py-4 focus:outline-none w-full" {% if formfield.value %}value="{{ formfield.value }}"{% endif %} placeholder="{{ formfield.label }}" />
{% if formfield.errors %}
{% for error in formfield.errors %}
<div class="text-red-500 pt-1 px-2 text-sm">{{ error }}</div>
{% endfor %}
{% elif formfield.help_text %}
<div class="text-gray-500 pt-1 px-2 text-sm">{{ formfield.help_text|safe }}</div>
{% endif %}
</div>
{% endif %}
theme/templatetags/tailwind_forms.py
+9
View File
@@ -0,0 +1,9 @@
from django import template
register = template.Library()
@register.inclusion_tag('tailwind_forms/formfield.html')
def tailwind_formfield(formfield):
return {'formfield': formfield}
users/templates/users/request_reset_password.html
+2 -10
View File
@@ -1,5 +1,6 @@
{% extends "barest_base.html" %}
{% load static %}
{% load tailwind_forms %}
{% block title %}Resend confirmation · {{ site_title }}{% endblock %}
@@ -16,16 +17,7 @@
<form method="post" action=".">
{% csrf_token %}
<div class="text-lg mb-6 md:mb-8">
<input name="email" type="text" class="{% if form.email.errors %}bg-red-100{% else %}bg-slate-200{% endif %} pl-4 py-2 md:py-4 focus:outline-none w-full" {% if form.email.value %}value="{{ form.email.value }}"{% endif %} placeholder="{{ form.email.label }}" />
{% if form.email.errors %}
{% for error in form.email.errors %}
<div class="text-red-500 pt-1 px-2 text-sm">{{ error }}</div>
{% endfor %}
{% elif form.email.help_text %}
<div class="text-gray-500 pt-1 px-2 text-sm">{{ form.email.help_text|safe }}</div>
{% endif %}
</div>
{% tailwind_formfield form.email %}
<button class="bg-slate-800 font-medium p-2 md:p-4 text-white uppercase w-full">Reset password</button>
</form>
users/templates/users/resend_confirmation.html
+2 -10
View File
@@ -1,5 +1,6 @@
{% extends "barest_base.html" %}
{% load static %}
{% load tailwind_forms %}
{% block title %}Resend confirmation · {{ site_title }}{% endblock %}
@@ -16,16 +17,7 @@
<form method="post" action=".">
{% csrf_token %}
<div class="text-lg mb-6 md:mb-8">
<input name="email" type="text" class="{% if form.email.errors %}bg-red-100{% else %}bg-slate-200{% endif %} pl-4 py-2 md:py-4 focus:outline-none w-full" {% if form.email.value %}value="{{ form.email.value }}"{% endif %} placeholder="{{ form.email.label }}" />
{% if form.email.errors %}
{% for error in form.email.errors %}
<div class="text-red-500 pt-1 px-2 text-sm">{{ error }}</div>
{% endfor %}
{% elif form.email.help_text %}
<div class="text-gray-500 pt-1 px-2 text-sm">{{ form.email.help_text|safe }}</div>
{% endif %}
</div>
{% tailwind_formfield form.email %}
<button class="bg-slate-800 font-medium p-2 md:p-4 text-white uppercase w-full">Resend verification email</button>
</form>
users/templates/users/reset_password.html
+3 -21
View File
@@ -1,5 +1,6 @@
{% extends "barest_base.html" %}
{% load static %}
{% load tailwind_forms %}
{% block title %}Reset password · {{ site_title }}{% endblock %}
@@ -16,27 +17,8 @@
<form method="post" action=".">
{% csrf_token %}
<div class="text-lg mb-6 md:mb-8">
<input name="new_password1" type="password" class="{% if form.new_password1.errors %}bg-red-100{% else %}bg-slate-200{% endif %} pl-4 py-2 md:py-4 focus:outline-none w-full" {% if form.new_password1.value %}value="{{ form.new_password1.value }}"{% endif %} placeholder="{{ form.new_password1.label }}" />
{% if form.new_password1.errors %}
{% for error in form.new_password1.errors %}
<div class="text-red-500 pt-1 px-2 text-sm">{{ error }}</div>
{% endfor %}
{% elif form.new_password1.help_text %}
<div class="text-gray-500 pt-1 px-2 text-sm">{{ form.new_password1.help_text|safe }}</div>
{% endif %}
</div>
<div class="text-lg mb-6 md:mb-8">
<input name="new_password2" type="password" class="{% if form.new_password2.errors %}bg-red-100{% else %}bg-slate-200{% endif %} pl-4 py-2 md:py-4 focus:outline-none w-full" {% if form.new_password2.value %}value="{{ form.new_password2.value }}"{% endif %} placeholder="{{ form.new_password2.label }}" />
{% if form.new_password2.errors %}
{% for error in form.new_password2.errors %}
<div class="text-red-500 pt-1 px-2 text-sm">{{ error }}</div>
{% endfor %}
{% elif form.new_password2.help_text %}
<div class="text-gray-500 pt-1 px-2 text-sm">{{ form.new_password2.help_text|safe }}</div>
{% endif %}
</div>
{% tailwind_formfield form.new_password1 %}
{% tailwind_formfield form.new_password2 %}
<input type="hidden" name="next" value="{{ next }}" />