From 924760273c7086930ec56b9bdad597a462ec763a Mon Sep 17 00:00:00 2001
From: kaiyou <pierre@jaury.eu>
Date: Sun, 29 Oct 2017 17:53:48 +0100
Subject: [PATCH] Update the ui macros and polish the overall UI

---
 admin/mailu/ui/templates/admin/create.html    |  4 +-
 admin/mailu/ui/templates/admin/list.html      | 32 ++++----
 admin/mailu/ui/templates/alias/create.html    |  4 +-
 admin/mailu/ui/templates/alias/list.html      | 50 ++++++------
 .../mailu/ui/templates/alternative/list.html  | 36 ++++-----
 admin/mailu/ui/templates/announcement.html    |  4 +-
 admin/mailu/ui/templates/base.html            | 17 +---
 admin/mailu/ui/templates/confirm.html         |  4 +-
 admin/mailu/ui/templates/docker-error.html    |  2 +-
 admin/mailu/ui/templates/domain/create.html   |  4 +-
 admin/mailu/ui/templates/domain/details.html  | 60 +++++++-------
 admin/mailu/ui/templates/domain/list.html     | 78 +++++++++----------
 admin/mailu/ui/templates/fetch/create.html    | 20 ++++-
 admin/mailu/ui/templates/fetch/edit.html      |  2 +-
 admin/mailu/ui/templates/fetch/list.html      | 58 +++++++-------
 admin/mailu/ui/templates/form.html            |  4 +-
 admin/mailu/ui/templates/helpers.html         | 13 ----
 admin/mailu/ui/templates/index.html           |  5 --
 admin/mailu/ui/templates/login.html           |  4 +-
 admin/mailu/ui/templates/macros.html          | 33 ++++++++
 admin/mailu/ui/templates/manager/create.html  |  4 +-
 admin/mailu/ui/templates/manager/list.html    | 32 ++++----
 admin/mailu/ui/templates/relay/list.html      | 50 ++++++------
 admin/mailu/ui/templates/services.html        | 44 +++++------
 admin/mailu/ui/templates/user/create.html     | 11 ++-
 admin/mailu/ui/templates/user/forward.html    |  4 +-
 admin/mailu/ui/templates/user/list.html       | 74 +++++++++---------
 admin/mailu/ui/templates/user/reply.html      |  4 +-
 admin/mailu/ui/templates/user/settings.html   |  7 +-
 29 files changed, 347 insertions(+), 317 deletions(-)
 delete mode 100644 admin/mailu/ui/templates/helpers.html
 delete mode 100644 admin/mailu/ui/templates/index.html

diff --git a/admin/mailu/ui/templates/admin/create.html b/admin/mailu/ui/templates/admin/create.html
index 6fe7e67b..060e5570 100644
--- a/admin/mailu/ui/templates/admin/create.html
+++ b/admin/mailu/ui/templates/admin/create.html
@@ -4,7 +4,8 @@
 {% trans %}Add a global administrator{% endtrans %}
 {% endblock %}
 
-{% block box_content %}
+{% block content %}
+{% call macros.box() %}
 <form class="form" method="post" role="form">
   {{ form.hidden_tag() }}
   {{ macros.form_field(form.admin, id='admin') }}
@@ -13,4 +14,5 @@
     $("#admin").select2();
   </script>
 </form>
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/admin/list.html b/admin/mailu/ui/templates/admin/list.html
index d286fb3f..72b5a1fa 100644
--- a/admin/mailu/ui/templates/admin/list.html
+++ b/admin/mailu/ui/templates/admin/list.html
@@ -10,21 +10,19 @@
 </a>
 {% endblock %}
 
-{% block box %}
-<table class="table table-bordered">
-  <tbody>
-    <tr>
-      <th>{% trans %}Actions{% endtrans %}</th>
-      <th>{% trans %}Email{% endtrans %}</th>
-    </tr>
-    {% for admin in admins %}
-    <tr>
-      <td>
-        <a href="{{ url_for('.admin_delete', admin=admin.email) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>
-      </td>
-      <td>{{ admin }}</td>
-    </tr>
-    {% endfor %}
-  </tbody>
-</table>
+{% block content %}
+{% call macros.table() %}
+<tr>
+  <th>{% trans %}Actions{% endtrans %}</th>
+  <th>{% trans %}Email{% endtrans %}</th>
+</tr>
+{% for admin in admins %}
+<tr>
+  <td>
+    <a href="{{ url_for('.admin_delete', admin=admin.email) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>
+  </td>
+  <td>{{ admin }}</td>
+</tr>
+{% endfor %}
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/alias/create.html b/admin/mailu/ui/templates/alias/create.html
index c848464b..9b176d36 100644
--- a/admin/mailu/ui/templates/alias/create.html
+++ b/admin/mailu/ui/templates/alias/create.html
@@ -8,7 +8,8 @@
 {{ domain }}
 {% endblock %}
 
-{% block box_content %}
+{% block content %}
+{% call macros.box() %}
 <form class="form" method="post" role="form">
   {{ form.hidden_tag() }}
   {{ macros.form_field(form.localpart, append='<span class="input-group-addon">@'+domain.name+'</span>') }}
@@ -23,4 +24,5 @@
     })
   </script>
 </form>
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/alias/list.html b/admin/mailu/ui/templates/alias/list.html
index d7380ef5..29766b25 100644
--- a/admin/mailu/ui/templates/alias/list.html
+++ b/admin/mailu/ui/templates/alias/list.html
@@ -12,30 +12,28 @@
 <a class="btn btn-primary" href="{{ url_for('.alias_create', domain_name=domain.name) }}">{% trans %}Add alias{% endtrans %}</a>
 {% endblock %}
 
-{% block box %}
-<table class="table table-bordered">
-  <tbody>
-    <tr>
-      <th>{% trans %}Actions{% endtrans %}</th>
-      <th>{% trans %}Email{% endtrans %}</th>
-      <th>{% trans %}Destination{% endtrans %}</th>
-      <th>{% trans %}Comment{% endtrans %}</th>
-      <th>{% trans %}Created{% endtrans %}</th>
-      <th>{% trans %}Last edit{% endtrans %}</th>
-    </tr>
-    {% for alias in domain.aliases %}
-    <tr>
-      <td>
-        <a href="{{ url_for('.alias_edit', alias=alias.email) }}" title="{% trans %}Edit{% endtrans %}"><i class="fa fa-pencil"></i></a>&nbsp;
-        <a href="{{ url_for('.alias_delete', alias=alias.email) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>
-      </td>
-      <td>{{ alias }}</td>
-      <td>{{ alias.destination|join(', ') or '-' }}</td>
-      <td>{{ alias.comment or '' }}</td>
-      <td>{{ alias.created_at }}</td>
-      <td>{{ alias.updated_at or '' }}</td>
-    </tr>
-    {% endfor %}
-  </tbody>
-</table>
+{% block content %}
+{% call macros.table() %}
+<tr>
+  <th>{% trans %}Actions{% endtrans %}</th>
+  <th>{% trans %}Email{% endtrans %}</th>
+  <th>{% trans %}Destination{% endtrans %}</th>
+  <th>{% trans %}Comment{% endtrans %}</th>
+  <th>{% trans %}Created{% endtrans %}</th>
+  <th>{% trans %}Last edit{% endtrans %}</th>
+</tr>
+{% for alias in domain.aliases %}
+<tr>
+  <td>
+    <a href="{{ url_for('.alias_edit', alias=alias.email) }}" title="{% trans %}Edit{% endtrans %}"><i class="fa fa-pencil"></i></a>&nbsp;
+    <a href="{{ url_for('.alias_delete', alias=alias.email) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>
+  </td>
+  <td>{{ alias }}</td>
+  <td>{{ alias.destination|join(', ') or '-' }}</td>
+  <td>{{ alias.comment or '' }}</td>
+  <td>{{ alias.created_at }}</td>
+  <td>{{ alias.updated_at or '' }}</td>
+</tr>
+{% endfor %}
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/alternative/list.html b/admin/mailu/ui/templates/alternative/list.html
index 547d2ecb..56e7565b 100644
--- a/admin/mailu/ui/templates/alternative/list.html
+++ b/admin/mailu/ui/templates/alternative/list.html
@@ -12,23 +12,21 @@
 <a class="btn btn-primary" href="{{ url_for('.alternative_create', domain_name=domain.name) }}">{% trans %}Add alternative{% endtrans %}</a>
 {% endblock %}
 
-{% block box %}
-<table class="table table-bordered">
-  <tbody>
-    <tr>
-      <th>{% trans %}Actions{% endtrans %}</th>
-      <th>{% trans %}Name{% endtrans %}</th>
-      <th>{% trans %}Created{% endtrans %}</th>
-    </tr>
-    {% for alternative in domain.alternatives %}
-    <tr>
-      <td>
-        <a href="{{ url_for('.alternative_delete', alternative=alternative.name) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>
-      </td>
-      <td>{{ alternative }}</td>
-      <td>{{ alternative.created_at }}</td>
-    </tr>
-    {% endfor %}
-  </tbody>
-</table>
+{% block content %}
+{% call macros.table() %}
+<tr>
+  <th>{% trans %}Actions{% endtrans %}</th>
+  <th>{% trans %}Name{% endtrans %}</th>
+  <th>{% trans %}Created{% endtrans %}</th>
+</tr>
+{% for alternative in domain.alternatives %}
+<tr>
+  <td>
+    <a href="{{ url_for('.alternative_delete', alternative=alternative.name) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>
+  </td>
+  <td>{{ alternative }}</td>
+  <td>{{ alternative.created_at }}</td>
+</tr>
+{% endfor %}
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/announcement.html b/admin/mailu/ui/templates/announcement.html
index 6d080154..ced68297 100644
--- a/admin/mailu/ui/templates/announcement.html
+++ b/admin/mailu/ui/templates/announcement.html
@@ -8,11 +8,13 @@
 {% trans %}from{% endtrans %} {{ from_address }}
 {% endblock %}
 
-{% block box_content %}
+{% block content %}
+{% call macros.box() %}
 <form class="form" method="post" role="form">
   {{ form.hidden_tag() }}
   {{ macros.form_field(form.announcement_subject) }}
   {{ macros.form_field(form.announcement_body, rows=10) }}
   {{ macros.form_field(form.submit) }}
 </form>
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/base.html b/admin/mailu/ui/templates/base.html
index 5fb0d8a9..0aa380c8 100644
--- a/admin/mailu/ui/templates/base.html
+++ b/admin/mailu/ui/templates/base.html
@@ -53,22 +53,7 @@ class="hold-transition skin-blue sidebar-mini"
 
       <section class="content">
         {{ utils.flashed_messages(container=False) }}
-        {% block content %}
-        <div class="row">
-          <div class="col-lg-12">
-            <div class="box">
-              {% block box %}
-              <div class="box-header">
-                {% block box_title %}{% endblock %}
-              </div>
-              <div class="box-body">
-                {% block box_content %}{% endblock %}
-              </div>
-              {% endblock %}
-            </div>
-          </div>
-        </div>
-        {% endblock %}
+        {% block content %}{% endblock %}
       </section>
     </div>
     <footer class="main-footer">
diff --git a/admin/mailu/ui/templates/confirm.html b/admin/mailu/ui/templates/confirm.html
index 36ecd7f5..3b8a451f 100644
--- a/admin/mailu/ui/templates/confirm.html
+++ b/admin/mailu/ui/templates/confirm.html
@@ -8,7 +8,9 @@
 {{ action }}
 {% endblock %}
 
-{% block box_content %}
+{% block content %}
+{% call macros.box(theme="warning") %}
 <p>{% trans action %}You are about to {{ action }}. Please confirm your action.{% endtrans %}</p>
 {{ macros.form(form) }}
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/docker-error.html b/admin/mailu/ui/templates/docker-error.html
index 2038c0a0..248e8b27 100644
--- a/admin/mailu/ui/templates/docker-error.html
+++ b/admin/mailu/ui/templates/docker-error.html
@@ -8,7 +8,7 @@
 {{ action }}
 {% endblock %}
 
-{% block box_content %}
+{% block content %}
 <p>{% trans action %}An error occurred while talking to the Docker server.{% endtrans %}</p>
 <pre>{{ error }}</pre>
 {% endblock %}
diff --git a/admin/mailu/ui/templates/domain/create.html b/admin/mailu/ui/templates/domain/create.html
index 301d91ac..7589d8e6 100644
--- a/admin/mailu/ui/templates/domain/create.html
+++ b/admin/mailu/ui/templates/domain/create.html
@@ -4,7 +4,8 @@
 {% trans %}New domain{% endtrans %}
 {% endblock %}
 
-{% block box_content %}
+{% block content %}
+{% call macros.box() %}
 <form class="form" method="post" role="form">
   {{ form.hidden_tag() }}
   {{ macros.form_field(form.name) }}
@@ -15,4 +16,5 @@
   {{ macros.form_field(form.comment) }}
   {{ macros.form_field(form.submit) }}
 </form>
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/domain/details.html b/admin/mailu/ui/templates/domain/details.html
index d57e8fd1..de56eb18 100644
--- a/admin/mailu/ui/templates/domain/details.html
+++ b/admin/mailu/ui/templates/domain/details.html
@@ -14,38 +14,36 @@
 {% endif %}
 {% endblock %}
 
-{% block box %}
+{% block content %}
+{% call macros.table() %}
 {% set hostname = config["HOSTNAMES"].split(",")[0] %}
-<table class="table table-bordered">
-  <tbody>
-    <tr>
-      <th>{% trans %}Domain name{% endtrans %}</th>
-      <td>{{ domain.name }}</td>
-    </tr>
-    <tr>
-      <th>{% trans %}DNS MX entry{% endtrans %}</th>
-      <td><pre>{{ domain.name }}. 600 IN MX 10 {{ hostname }}.</pre></td>
-    </tr>
-    <tr>
-      <th>{% trans %}DNS SPF entries{% endtrans %}</th>
-      <td><pre>
+<tr>
+  <th>{% trans %}Domain name{% endtrans %}</th>
+  <td>{{ domain.name }}</td>
+</tr>
+<tr>
+  <th>{% trans %}DNS MX entry{% endtrans %}</th>
+  <td><pre>{{ domain.name }}. 600 IN MX 10 {{ hostname }}.</pre></td>
+</tr>
+<tr>
+  <th>{% trans %}DNS SPF entries{% endtrans %}</th>
+  <td><pre>
 {{ domain.name }}. 600 IN TXT "v=spf1 mx a:{{ hostname }} -all"
 {{ domain.name }}. 600 IN SPF "v=spf1 mx a:{{ hostname }} -all"</pre></td>
-    </tr>
-    {% if domain.dkim_publickey %}
-    <tr>
-      <th>{% trans %}DKIM public key{% endtrans %}</th>
-      <td><pre style="white-space: pre-wrap; word-wrap: break-word;">{{ domain.dkim_publickey }}</pre></td>
-    </tr>
-    <tr>
-      <th>{% trans %}DNS DKIM entry{% endtrans %}</th>
-      <td><pre style="white-space: pre-wrap; word-wrap: break-word;">{{ config["DKIM_SELECTOR"] }}._domainkey.{{ domain.name }}. IN 600 TXT "v=DKIM1; k=rsa; p={{ domain.dkim_publickey }}"</pre></td>
-    </tr>
-    <tr>
-      <th>{% trans %}DNS DMARC entry{% endtrans %}</th>
-      <td><pre>_dmarc.{{ domain.name }}. 600 IN TXT "v=DMARC1; p=reject;{% if config["DMARC_RUA"] %} rua=mailto:{{ config["DMARC_RUA"] }}@{{ config["DOMAIN"] }};{% endif %}{% if config["DMARC_RUF"] %} ruf=mailto:{{ config["DMARC_RUF"] }}@{{ config["DOMAIN"] }};{% endif %} adkim=s; aspf=s"</pre></td>
-    </tr>
-    {% endif %}
-  </tbody>
-</table>
+</tr>
+{% if domain.dkim_publickey %}
+<tr>
+  <th>{% trans %}DKIM public key{% endtrans %}</th>
+  <td><pre style="white-space: pre-wrap; word-wrap: break-word;">{{ domain.dkim_publickey }}</pre></td>
+</tr>
+<tr>
+  <th>{% trans %}DNS DKIM entry{% endtrans %}</th>
+  <td><pre style="white-space: pre-wrap; word-wrap: break-word;">{{ config["DKIM_SELECTOR"] }}._domainkey.{{ domain.name }}. IN 600 TXT "v=DKIM1; k=rsa; p={{ domain.dkim_publickey }}"</pre></td>
+</tr>
+<tr>
+  <th>{% trans %}DNS DMARC entry{% endtrans %}</th>
+  <td><pre>_dmarc.{{ domain.name }}. 600 IN TXT "v=DMARC1; p=reject;{% if config["DMARC_RUA"] %} rua=mailto:{{ config["DMARC_RUA"] }}@{{ config["DOMAIN"] }};{% endif %}{% if config["DMARC_RUF"] %} ruf=mailto:{{ config["DMARC_RUF"] }}@{{ config["DOMAIN"] }};{% endif %} adkim=s; aspf=s"</pre></td>
+</tr>
+{% endif %}
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/domain/list.html b/admin/mailu/ui/templates/domain/list.html
index 46a5d723..0fa54f4f 100644
--- a/admin/mailu/ui/templates/domain/list.html
+++ b/admin/mailu/ui/templates/domain/list.html
@@ -10,44 +10,42 @@
 {% endif %}
 {% endblock %}
 
-{% block box %}
-<table class="table table-bordered">
-  <tbody>
-    <tr>
-      <th>{% trans %}Actions{% endtrans %}</th>
-      <th>{% trans %}Manage{% endtrans %}</th>
-      <th>{% trans %}Domain name{% endtrans %}</th>
-      <th>{% trans %}Mailbox count{% endtrans %}</th>
-      <th>{% trans %}Alias count{% endtrans %}</th>
-      <th>{% trans %}Comment{% endtrans %}</th>
-      <th>{% trans %}Created{% endtrans %}</th>
-      <th>{% trans %}Last edit{% endtrans %}</th>
-    </tr>
-    {% for domain in current_user.get_managed_domains() %}
-    <tr>
-      <td>
-        <a href="{{ url_for('.domain_details', domain_name=domain.name) }}" title="{% trans %}Details{% endtrans %}"><i class="fa fa-list"></i></a>&nbsp;
-        {% if current_user.global_admin %}
-        <a href="{{ url_for('.domain_edit', domain_name=domain.name) }}" title="{% trans %}Edit{% endtrans %}"><i class="fa fa-pencil"></i></a>&nbsp;
-        <a href="{{ url_for('.domain_delete', domain_name=domain.name) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>&nbsp;
-        {% endif %}
-      </td>
-      <td>
-        <a href="{{ url_for('.user_list', domain_name=domain.name) }}" title="{% trans %}Users{% endtrans %}"><i class="fa fa-envelope-o"></i></a>&nbsp;
-        <a href="{{ url_for('.alias_list', domain_name=domain.name) }}" title="{% trans %}Aliases{% endtrans %}"><i class="fa fa-at"></i></a>&nbsp;
-        <a href="{{ url_for('.manager_list', domain_name=domain.name) }}" title="{% trans %}Managers{% endtrans %}"><i class="fa fa-user"></i></a>&nbsp;
-        {% if current_user.global_admin %}
-        <a href="{{ url_for('.alternative_list', domain_name=domain.name) }}" title="{% trans %}Alternatives{% endtrans %}"><i class="fa fa-asterisk"></i></a>&nbsp;
-        {% endif %}
-      </td>
-      <td>{{ domain.name }}</td>
-      <td>{{ domain.users | count }} / {{ domain.max_users or '∞' }}</td>
-      <td>{{ domain.aliases | count }} / {{ domain.max_aliases or '∞' }}</td>
-      <td>{{ domain.comment or '' }}</td>
-      <td>{{ domain.created_at }}</td>
-      <td>{{ domain.updated_at or '' }}</td>
-    </tr>
-    {% endfor %}
-  </tbody>
-</table>
+{% block content %}
+{% call macros.table() %}
+<tr>
+  <th>{% trans %}Actions{% endtrans %}</th>
+  <th>{% trans %}Manage{% endtrans %}</th>
+  <th>{% trans %}Domain name{% endtrans %}</th>
+  <th>{% trans %}Mailbox count{% endtrans %}</th>
+  <th>{% trans %}Alias count{% endtrans %}</th>
+  <th>{% trans %}Comment{% endtrans %}</th>
+  <th>{% trans %}Created{% endtrans %}</th>
+  <th>{% trans %}Last edit{% endtrans %}</th>
+</tr>
+{% for domain in current_user.get_managed_domains() %}
+<tr>
+  <td>
+    <a href="{{ url_for('.domain_details', domain_name=domain.name) }}" title="{% trans %}Details{% endtrans %}"><i class="fa fa-list"></i></a>&nbsp;
+    {% if current_user.global_admin %}
+    <a href="{{ url_for('.domain_edit', domain_name=domain.name) }}" title="{% trans %}Edit{% endtrans %}"><i class="fa fa-pencil"></i></a>&nbsp;
+    <a href="{{ url_for('.domain_delete', domain_name=domain.name) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>&nbsp;
+    {% endif %}
+  </td>
+  <td>
+    <a href="{{ url_for('.user_list', domain_name=domain.name) }}" title="{% trans %}Users{% endtrans %}"><i class="fa fa-envelope-o"></i></a>&nbsp;
+    <a href="{{ url_for('.alias_list', domain_name=domain.name) }}" title="{% trans %}Aliases{% endtrans %}"><i class="fa fa-at"></i></a>&nbsp;
+    <a href="{{ url_for('.manager_list', domain_name=domain.name) }}" title="{% trans %}Managers{% endtrans %}"><i class="fa fa-user"></i></a>&nbsp;
+    {% if current_user.global_admin %}
+    <a href="{{ url_for('.alternative_list', domain_name=domain.name) }}" title="{% trans %}Alternatives{% endtrans %}"><i class="fa fa-asterisk"></i></a>&nbsp;
+    {% endif %}
+  </td>
+  <td>{{ domain.name }}</td>
+  <td>{{ domain.users | count }} / {{ domain.max_users or '∞' }}</td>
+  <td>{{ domain.aliases | count }} / {{ domain.max_aliases or '∞' }}</td>
+  <td>{{ domain.comment or '' }}</td>
+  <td>{{ domain.created_at }}</td>
+  <td>{{ domain.updated_at or '' }}</td>
+</tr>
+{% endfor %}
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/fetch/create.html b/admin/mailu/ui/templates/fetch/create.html
index f5d8618a..184cf668 100644
--- a/admin/mailu/ui/templates/fetch/create.html
+++ b/admin/mailu/ui/templates/fetch/create.html
@@ -1,4 +1,4 @@
-{% extends "form.html" %}
+{% extends "base.html" %}
 
 {% block title %}
 {% trans %}Add a fetched account{% endtrans %}
@@ -7,3 +7,21 @@
 {% block subtitle %}
 {{ user }}
 {% endblock %}
+
+{% block content %}
+<form class="form" method="post" role="form">
+  {{ form.hidden_tag() }}
+  {% call macros.box(title="Remote server") %}
+  {{ macros.form_field(form.protocol) }}
+  {{ macros.form_fields((form.host, form.port)) }}
+  {{ macros.form_field(form.tls) }}
+  {% endcall %}
+
+  {% call macros.box(title="Authentication") %}
+  {{ macros.form_field(form.username) }}
+  {{ macros.form_field(form.password) }}
+  {% endcall %}
+
+  {{ macros.form_field(form.submit) }}
+</form>
+{% endblock %}
diff --git a/admin/mailu/ui/templates/fetch/edit.html b/admin/mailu/ui/templates/fetch/edit.html
index 749df5b7..9d0f3918 100644
--- a/admin/mailu/ui/templates/fetch/edit.html
+++ b/admin/mailu/ui/templates/fetch/edit.html
@@ -1,4 +1,4 @@
-{% extends "form.html" %}
+{% extends "fetch/create.html" %}
 
 {% block title %}
 {% trans %}Update a fetched account{% endtrans %}
diff --git a/admin/mailu/ui/templates/fetch/list.html b/admin/mailu/ui/templates/fetch/list.html
index 54364a0f..07ab5ad8 100644
--- a/admin/mailu/ui/templates/fetch/list.html
+++ b/admin/mailu/ui/templates/fetch/list.html
@@ -12,34 +12,32 @@
 <a class="btn btn-primary" href="{{ url_for('.fetch_create', user_email=user.email) }}">{% trans %}Add an account{% endtrans %}</a>
 {% endblock %}
 
-{% block box %}
-<table class="table table-bordered">
-  <tbody>
-    <tr>
-      <th>{% trans %}Actions{% endtrans %}</th>
-      <th>{% trans %}Endpoint{% endtrans %}</th>
-      <th>{% trans %}Username{% endtrans %}</th>
-      <th>{% trans %}Keep emails{% endtrans %}</th>
-      <th>{% trans %}Last check{% endtrans %}</th>
-      <th>{% trans %}Status{% endtrans %}</th>
-      <th>{% trans %}Created{% endtrans %}</th>
-      <th>{% trans %}Last edit{% endtrans %}</th>
-    </tr>
-    {% for fetch in user.fetches %}
-    <tr>
-      <td>
-        <a href="{{ url_for('.fetch_edit', fetch_id=fetch.id) }}" title="{% trans %}Edit{% endtrans %}"><i class="fa fa-pencil"></i></a>&nbsp;
-        <a href="{{ url_for('.fetch_delete', fetch_id=fetch.id) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>
-      </td>
-      <td>{{ fetch.protocol }}{{ 's' if fetch.tls else '' }}://{{ fetch.host }}:{{ fetch.port }}</td>
-      <td>{{ fetch.username }}</td>
-      <td>{% if fetch.keep %}{% trans %}yes{% endtrans %}{% else %}{% trans %}no{% endtrans %}{% endif %}</td>
-      <td>{{ fetch.last_check or '-' }}</td>
-      <td>{{ fetch.error or '-' }}</td>
-      <td>{{ fetch.created_at }}</td>
-      <td>{{ fetch.updated_at or '' }}</td>
-    </tr>
-    {% endfor %}
-  </tbody>
-</table>
+{% block content %}
+{% call macros.table() %}
+<tr>
+  <th>{% trans %}Actions{% endtrans %}</th>
+  <th>{% trans %}Endpoint{% endtrans %}</th>
+  <th>{% trans %}Username{% endtrans %}</th>
+  <th>{% trans %}Keep emails{% endtrans %}</th>
+  <th>{% trans %}Last check{% endtrans %}</th>
+  <th>{% trans %}Status{% endtrans %}</th>
+  <th>{% trans %}Created{% endtrans %}</th>
+  <th>{% trans %}Last edit{% endtrans %}</th>
+</tr>
+{% for fetch in user.fetches %}
+<tr>
+  <td>
+    <a href="{{ url_for('.fetch_edit', fetch_id=fetch.id) }}" title="{% trans %}Edit{% endtrans %}"><i class="fa fa-pencil"></i></a>&nbsp;
+    <a href="{{ url_for('.fetch_delete', fetch_id=fetch.id) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>
+  </td>
+  <td>{{ fetch.protocol }}{{ 's' if fetch.tls else '' }}://{{ fetch.host }}:{{ fetch.port }}</td>
+  <td>{{ fetch.username }}</td>
+  <td>{% if fetch.keep %}{% trans %}yes{% endtrans %}{% else %}{% trans %}no{% endtrans %}{% endif %}</td>
+  <td>{{ fetch.last_check or '-' }}</td>
+  <td>{{ fetch.error or '-' }}</td>
+  <td>{{ fetch.created_at }}</td>
+  <td>{{ fetch.updated_at or '' }}</td>
+</tr>
+{% endfor %}
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/form.html b/admin/mailu/ui/templates/form.html
index c252e6fe..25d7e83c 100644
--- a/admin/mailu/ui/templates/form.html
+++ b/admin/mailu/ui/templates/form.html
@@ -1,5 +1,7 @@
 {% extends "base.html" %}
 
-{% block box_content %}
+{% block content %}
+{% call macros.box() %}
 {{ macros.form(form) }}
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/helpers.html b/admin/mailu/ui/templates/helpers.html
deleted file mode 100644
index 98752542..00000000
--- a/admin/mailu/ui/templates/helpers.html
+++ /dev/null
@@ -1,13 +0,0 @@
-{% macro render_field(field, label_visible=true) -%}
-     <div class="form-group {% if field.errors %}has-error{% endif %} {{ kwargs.pop('class_', '') }}">
-        {% if field.type != 'HiddenField' and label_visible %}
-            <label for="{{ field.id }}" class="control-label">{{ field.label }}</label>
-        {% endif %}
-        {{ field(class_='form-control', **kwargs) }}
-        {% if field.errors %}
-            {% for e in field.errors %}
-                <p class="help-block">{{ e }}</p>
-            {% endfor %}
-        {% endif %}
-    </div>
-{%- endmacro %}
diff --git a/admin/mailu/ui/templates/index.html b/admin/mailu/ui/templates/index.html
deleted file mode 100644
index 8d73356b..00000000
--- a/admin/mailu/ui/templates/index.html
+++ /dev/null
@@ -1,5 +0,0 @@
-{% extends "general.html" %}
-
-{% block content %}
-Test
-{% endblock %}
diff --git a/admin/mailu/ui/templates/login.html b/admin/mailu/ui/templates/login.html
index 27b63d43..7ace9802 100644
--- a/admin/mailu/ui/templates/login.html
+++ b/admin/mailu/ui/templates/login.html
@@ -21,6 +21,8 @@
 {% trans %}to access the administration tools{% endtrans %}
 {% endblock %}
 
-{% block box_content %}
+{% block content %}
+{% call macros.box() %}
 {{ macros.form(form) }}
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/macros.html b/admin/mailu/ui/templates/macros.html
index 61c797c5..d3acfb53 100644
--- a/admin/mailu/ui/templates/macros.html
+++ b/admin/mailu/ui/templates/macros.html
@@ -63,3 +63,36 @@
   {% endfor %}
 </form>
 {% endmacro %}
+
+{% macro box(title=None, theme="primary", header=True) %}
+<div class="row">
+  <div class="col-lg-12">
+    <div class="box box-{{ theme }}">
+      {% if header %}
+      <div class="box-header">
+        {% if title %}
+        <h3 class="box-title">{{ title }}</h3>
+        {% endif %}
+      </div>
+      {% endif %}
+      <div class="box-body">
+       {{ caller() }}
+      </div>
+    </div>
+  </div>
+</div>
+{% endmacro %}
+
+{% macro table(theme="primary") %}
+<div class="row">
+  <div class="col-lg-12">
+    <div class="box box-{{ theme }}">
+      <table class="table table-bordered">
+        <tbody>
+          {{ caller() }}
+        </tbody>
+      </table>
+    </div>
+  </div>
+</div>
+{% endmacro %}
diff --git a/admin/mailu/ui/templates/manager/create.html b/admin/mailu/ui/templates/manager/create.html
index 8eb386b3..31bd1566 100644
--- a/admin/mailu/ui/templates/manager/create.html
+++ b/admin/mailu/ui/templates/manager/create.html
@@ -8,7 +8,8 @@
 {{ domain }}
 {% endblock %}
 
-{% block box_content %}
+{% block content %}
+{% call macros.box() %}
 <form class="form" method="post" role="form">
   {{ form.hidden_tag() }}
   {{ macros.form_field(form.manager, id='manager') }}
@@ -17,4 +18,5 @@
     $("#manager").select2();
   </script>
 </form>
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/manager/list.html b/admin/mailu/ui/templates/manager/list.html
index 00f7ee47..d818a876 100644
--- a/admin/mailu/ui/templates/manager/list.html
+++ b/admin/mailu/ui/templates/manager/list.html
@@ -12,21 +12,19 @@
 <a class="btn btn-primary" href="{{ url_for('.manager_create', domain_name=domain.name) }}">{% trans %}Add manager{% endtrans %}</a>
 {% endblock %}
 
-{% block box %}
-<table class="table table-bordered">
-  <tbody>
-    <tr>
-      <th>{% trans %}Actions{% endtrans %}</th>
-      <th>{% trans %}Email{% endtrans %}</th>
-    </tr>
-    {% for manager in domain.managers %}
-    <tr>
-      <td>
-        <a href="{{ url_for('.manager_delete', domain_name=domain.name, user_email=manager.email) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>
-      </td>
-      <td>{{ manager }}</td>
-    </tr>
-    {% endfor %}
-  </tbody>
-</table>
+{% block content %}
+{% call macros.table() %}
+<tr>
+  <th>{% trans %}Actions{% endtrans %}</th>
+  <th>{% trans %}Email{% endtrans %}</th>
+</tr>
+{% for manager in domain.managers %}
+<tr>
+  <td>
+    <a href="{{ url_for('.manager_delete', domain_name=domain.name, user_email=manager.email) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>
+  </td>
+  <td>{{ manager }}</td>
+</tr>
+{% endfor %}
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/relay/list.html b/admin/mailu/ui/templates/relay/list.html
index ba72a227..bb00b1d9 100644
--- a/admin/mailu/ui/templates/relay/list.html
+++ b/admin/mailu/ui/templates/relay/list.html
@@ -10,30 +10,28 @@
 {% endif %}
 {% endblock %}
 
-{% block box %}
-<table class="table table-bordered">
-  <tbody>
-    <tr>
-      <th>{% trans %}Actions{% endtrans %}</th>
-      <th>{% trans %}Domain name{% endtrans %}</th>
-      <th>{% trans %}Remote host{% endtrans %}</th>
-      <th>{% trans %}Comment{% endtrans %}</th>
-      <th>{% trans %}Created{% endtrans %}</th>
-      <th>{% trans %}Last edit{% endtrans %}</th>
-    </tr>
-    {% for relay in relays %}
-    <tr>
-      <td>
-	<a href="{{ url_for('.relay_edit', relay_name=relay.name) }}" title="{% trans %}Edit{% endtrans %}"><i class="fa fa-pencil"></i></a>&nbsp;
-        <a href="{{ url_for('.relay_delete', relay_name=relay.name) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>&nbsp;
-      </td>
-      <td>{{ relay.name }}</td>
-      <td>{{ relay.smtp or '-' }}</td>
-      <td>{{ relay.comment or '' }}</td>
-      <td>{{ relay.created_at }}</td>
-      <td>{{ relay.updated_at or '' }}</td>
-    </tr>
-    {% endfor %}
-  </tbody>
-</table>
+{% block content %}
+{% call macros.table() %}
+<tr>
+  <th>{% trans %}Actions{% endtrans %}</th>
+  <th>{% trans %}Domain name{% endtrans %}</th>
+  <th>{% trans %}Remote host{% endtrans %}</th>
+  <th>{% trans %}Comment{% endtrans %}</th>
+  <th>{% trans %}Created{% endtrans %}</th>
+  <th>{% trans %}Last edit{% endtrans %}</th>
+</tr>
+{% for relay in relays %}
+<tr>
+  <td>
+<a href="{{ url_for('.relay_edit', relay_name=relay.name) }}" title="{% trans %}Edit{% endtrans %}"><i class="fa fa-pencil"></i></a>&nbsp;
+    <a href="{{ url_for('.relay_delete', relay_name=relay.name) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>&nbsp;
+  </td>
+  <td>{{ relay.name }}</td>
+  <td>{{ relay.smtp or '-' }}</td>
+  <td>{{ relay.comment or '' }}</td>
+  <td>{{ relay.created_at }}</td>
+  <td>{{ relay.updated_at or '' }}</td>
+</tr>
+{% endfor %}
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/services.html b/admin/mailu/ui/templates/services.html
index c2b65918..aee2a94e 100644
--- a/admin/mailu/ui/templates/services.html
+++ b/admin/mailu/ui/templates/services.html
@@ -4,27 +4,25 @@
 {% trans %}Services status{% endtrans %}
 {% endblock %}
 
-{% block box %}
-<table class="table table-bordered">
-  <tbody>
-    <tr>
-      <th>{% trans %}Service{% endtrans %}</th>
-      <th>{% trans %}Status{% endtrans %}</th>
-      <th>{% trans %}PID{% endtrans %}</th>
-      <th>{% trans %}Image{% endtrans %}</th>
-      <th>{% trans %}Started{% endtrans %}</th>
-      <th>{% trans %}Last update{% endtrans %}</th>
-    </tr>
-    {% for name, container in containers.items() %}
-    <tr>
-      <td>{{ name }}</td>
-      <td><span class="label label-{{ "success" if container['State']['Running'] else "danger" }}">{{ container['State']['Status'] }}</span></td>
-      <td>{{ container['State']['Pid'] }}</td>
-      <td>{{ container['Config']['Image'] }}</td>
-      <td>{{ container['State']['StartedAt'] }}</td>
-      <td>{{ container['Image']['Created'] }}
-    </tr>
-    {% endfor %}
-  </tbody>
-</table>
+{% block content %}
+{% call table() %}
+<tr>
+  <th>{% trans %}Service{% endtrans %}</th>
+  <th>{% trans %}Status{% endtrans %}</th>
+  <th>{% trans %}PID{% endtrans %}</th>
+  <th>{% trans %}Image{% endtrans %}</th>
+  <th>{% trans %}Started{% endtrans %}</th>
+  <th>{% trans %}Last update{% endtrans %}</th>
+</tr>
+{% for name, container in containers.items() %}
+<tr>
+  <td>{{ name }}</td>
+  <td><span class="label label-{{ "success" if container['State']['Running'] else "danger" }}">{{ container['State']['Status'] }}</span></td>
+  <td>{{ container['State']['Pid'] }}</td>
+  <td>{{ container['Config']['Image'] }}</td>
+  <td>{{ container['State']['StartedAt'] }}</td>
+  <td>{{ container['Image']['Created'] }}
+</tr>
+{% endfor %}
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/user/create.html b/admin/mailu/ui/templates/user/create.html
index 829b6c80..76c627f4 100644
--- a/admin/mailu/ui/templates/user/create.html
+++ b/admin/mailu/ui/templates/user/create.html
@@ -8,17 +8,24 @@
 {{ domain.name }}
 {% endblock %}
 
-{% block box_content %}
+{% block content %}
 <form class="form" method="post" role="form">
   {{ form.hidden_tag() }}
+
+  {% call macros.box("General") %}
   {{ macros.form_field(form.localpart, append='<span class="input-group-addon">@'+domain.name+'</span>') }}
   {{ macros.form_fields((form.pw, form.pw2)) }}
+  {{ macros.form_field(form.comment) }}
+  {% endcall %}
+
+  {% call macros.box("Features and quotas", theme="success") %}
   {{ macros.form_field(form.quota_bytes, step=1000000000, max=(max_quota_bytes or domain.max_quota_bytes or 50000000000),
       prepend='<span class="input-group-addon"><span id="quota">'+(form.quota_bytes.data//1000000000).__str__()+'</span> GiB</span>',
       oninput='$("#quota").text(this.value/1000000000);') }}
   {{ macros.form_field(form.enable_imap) }}
   {{ macros.form_field(form.enable_pop) }}
-  {{ macros.form_field(form.comment) }}
+  {% endcall %}
+
   {{ macros.form_field(form.submit) }}
 </form>
 {% endblock %}
diff --git a/admin/mailu/ui/templates/user/forward.html b/admin/mailu/ui/templates/user/forward.html
index 116aae2e..769d439d 100644
--- a/admin/mailu/ui/templates/user/forward.html
+++ b/admin/mailu/ui/templates/user/forward.html
@@ -8,7 +8,8 @@
 {{ user }}
 {% endblock %}
 
-{% block box_content %}
+{% block content %}
+{% call macros.box() %}
 <form class="form" method="post" role="form">
   {{ form.hidden_tag() }}
   {{ macros.form_field(form.forward_enabled,
@@ -20,4 +21,5 @@
       **{("enabled" if user.forward_enabled else "disabled"): ""}) }}
   {{ macros.form_field(form.submit) }}
 </form>
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/user/list.html b/admin/mailu/ui/templates/user/list.html
index a3ee52b1..46638b6b 100644
--- a/admin/mailu/ui/templates/user/list.html
+++ b/admin/mailu/ui/templates/user/list.html
@@ -12,42 +12,40 @@
 <a class="btn btn-primary" href="{{ url_for('.user_create', domain_name=domain.name) }}">{% trans %}Add user{% endtrans %}</a>
 {% endblock %}
 
-{% block box %}
-<table class="table table-bordered">
-  <tbody>
-    <tr>
-      <th>{% trans %}Actions{% endtrans %}</th>
-      <th>{% trans %}User settings{% endtrans %}</th>
-      <th>{% trans %}Email{% endtrans %}</th>
-      <th>{% trans %}Features{% endtrans %}</th>
-      <th>{% trans %}Quota{% endtrans %}</th>
-      <th>{% trans %}Comment{% endtrans %}</th>
-      <th>{% trans %}Created{% endtrans %}</th>
-      <th>{% trans %}Last edit{% endtrans %}</th>
-    </tr>
-    {% for user in domain.users %}
-    <tr>
-      <td>
-        <a href="{{ url_for('.user_edit', user_email=user.email) }}" title="{% trans %}Edit{% endtrans %}"><i class="fa fa-pencil"></i></a>&nbsp;
-        <a href="{{ url_for('.user_delete', user_email=user.email) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>
-      </td>
-      <td>
-        <a href="{{ url_for('.user_settings', user_email=user.email) }}" title="{% trans %}Settings{% endtrans %}"><i class="fa fa-wrench"></i></a>&nbsp;
-        <a href="{{ url_for('.user_forward', user_email=user.email) }}" title="{% trans %}Auto-forward{% endtrans %}"><i class="fa fa-share"></i></a>&nbsp;
-        <a href="{{ url_for('.user_reply', user_email=user.email) }}" title="{% trans %}Auto-reply{% endtrans %}"><i class="fa fa-plane"></i></a>&nbsp;
-        <a href="{{ url_for('.fetch_list', user_email=user.email) }}" title="{% trans %}Fetched accounts{% endtrans %}"><i class="fa fa-download"></i></a>&nbsp;
-      </td>
-      <td>{{ user }}</td>
-      <td>
-        {% if user.enable_imap %}<span class="label label-info">imap</span>{% endif %}
-        {% if user.enable_pop %}<span class="label label-info">pop3</span>{% endif %}
-      </td>
-      <td>{{ user.quota_bytes | filesizeformat }}</td>
-      <td>{{ user.comment or '-' }}</td>
-      <td>{{ user.created_at }}</td>
-      <td>{{ user.updated_at or '' }}</td>
-    </tr>
-    {% endfor %}
-  </tbody>
-</table>
+{% block content %}
+{% call macros.table() %}
+<tr>
+  <th>{% trans %}Actions{% endtrans %}</th>
+  <th>{% trans %}User settings{% endtrans %}</th>
+  <th>{% trans %}Email{% endtrans %}</th>
+  <th>{% trans %}Features{% endtrans %}</th>
+  <th>{% trans %}Quota{% endtrans %}</th>
+  <th>{% trans %}Comment{% endtrans %}</th>
+  <th>{% trans %}Created{% endtrans %}</th>
+  <th>{% trans %}Last edit{% endtrans %}</th>
+</tr>
+{% for user in domain.users %}
+<tr>
+  <td>
+    <a href="{{ url_for('.user_edit', user_email=user.email) }}" title="{% trans %}Edit{% endtrans %}"><i class="fa fa-pencil"></i></a>&nbsp;
+    <a href="{{ url_for('.user_delete', user_email=user.email) }}" title="{% trans %}Delete{% endtrans %}"><i class="fa fa-trash"></i></a>
+  </td>
+  <td>
+    <a href="{{ url_for('.user_settings', user_email=user.email) }}" title="{% trans %}Settings{% endtrans %}"><i class="fa fa-wrench"></i></a>&nbsp;
+    <a href="{{ url_for('.user_forward', user_email=user.email) }}" title="{% trans %}Auto-forward{% endtrans %}"><i class="fa fa-share"></i></a>&nbsp;
+    <a href="{{ url_for('.user_reply', user_email=user.email) }}" title="{% trans %}Auto-reply{% endtrans %}"><i class="fa fa-plane"></i></a>&nbsp;
+    <a href="{{ url_for('.fetch_list', user_email=user.email) }}" title="{% trans %}Fetched accounts{% endtrans %}"><i class="fa fa-download"></i></a>&nbsp;
+  </td>
+  <td>{{ user }}</td>
+  <td>
+    {% if user.enable_imap %}<span class="label label-info">imap</span>{% endif %}
+    {% if user.enable_pop %}<span class="label label-info">pop3</span>{% endif %}
+  </td>
+  <td>{{ user.quota_bytes | filesizeformat }}</td>
+  <td>{{ user.comment or '-' }}</td>
+  <td>{{ user.created_at }}</td>
+  <td>{{ user.updated_at or '' }}</td>
+</tr>
+{% endfor %}
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/user/reply.html b/admin/mailu/ui/templates/user/reply.html
index a80520bf..fcea28d3 100644
--- a/admin/mailu/ui/templates/user/reply.html
+++ b/admin/mailu/ui/templates/user/reply.html
@@ -8,7 +8,8 @@
 {{ user }}
 {% endblock %}
 
-{% block box_content %}
+{% block content %}
+{% call macros.box() %}
 <form class="form" method="post" role="form">
   {{ form.hidden_tag() }}
   {{ macros.form_field(form.reply_enabled,
@@ -20,4 +21,5 @@
         **{("rw" if user.reply_enabled else "readonly"): ""}) }}
   {{ macros.form_field(form.submit) }}
 </form>
+{% endcall %}
 {% endblock %}
diff --git a/admin/mailu/ui/templates/user/settings.html b/admin/mailu/ui/templates/user/settings.html
index 62cdbace..67dd4ea5 100644
--- a/admin/mailu/ui/templates/user/settings.html
+++ b/admin/mailu/ui/templates/user/settings.html
@@ -8,14 +8,19 @@
 {{ user }}
 {% endblock %}
 
-{% block box_content %}
+{% block content %}
 <form class="form" method="post" role="form">
   {{ form.hidden_tag() }}
+  {% call macros.box(title="General settings") %}
   {{ macros.form_field(form.displayed_name) }}
+  {% endcall %}
+
+  {% call macros.box(title="Antispam") %}
   {{ macros.form_field(form.spam_enabled) }}
   {{ macros.form_field(form.spam_threshold, step=1, max=100,
       prepend='<span class="input-group-addon"><span id="threshold">'+form.spam_threshold.data.__str__()+'</span>&nbsp;/&nbsp;100</span>',
       oninput='$("#threshold").text(this.value);') }}
+  {% endcall %}
   {{ macros.form_field(form.submit) }}
 </form>
 {% endblock %}