Add djLint for HTML formatting and linting (#4389)

* Add djLint for HTML formatting and linting

* Remove djLint pre-commit hook

* Bump djLint from 1.31.0 to 1.31.1

pyproject.toml

@@ -27,3 +27,24 @@ known_first_party = [
     "scripts",
     "hooks",
 ]
+
+
+# ==== djLint ====
+[tool.djlint]
+blank_line_after_tag = "load,extends"
+close_void_tags = true
+format_css = true
+format_js = true
+# TODO: remove T002 when fixed https://github.com/Riverside-Healthcare/djLint/issues/687
+ignore = "H006,H030,H031,T002,T028"
+ignore_blocks = "raw"
+include = "H017,H035"
+indent = 2
+max_line_length = 119
+profile = "jinja"
+
+[tool.djlint.css]
+indent_size = 2
+
+[tool.djlint.js]
+indent_size = 2

requirements.txt

@@ -8,6 +8,7 @@ black==23.3.0
 isort==5.12.0
 flake8==6.0.0
 django-upgrade==1.14.0
+djlint==1.31.1
 pre-commit==3.3.3
 
 # Testing

tests/test_cookiecutter_generation.py

@@ -239,6 +239,32 @@ def test_django_upgrade_passes(cookies, context_override):
         pytest.fail(e.stdout.decode())
 
 
+@pytest.mark.parametrize("context_override", SUPPORTED_COMBINATIONS, ids=_fixture_id)
+def test_djlint_lint_passes(cookies, context_override):
+    """Check whether generated project passes djLint --lint."""
+    result = cookies.bake(extra_context=context_override)
+
+    autofixable_rules = "H014,T001"
+    # TODO: remove T002 when fixed https://github.com/Riverside-Healthcare/djLint/issues/687
+    ignored_rules = "H006,H030,H031,T002"
+    try:
+        sh.djlint("--lint", "--ignore", f"{autofixable_rules},{ignored_rules}", ".", _cwd=str(result.project_path))
+    except sh.ErrorReturnCode as e:
+        pytest.fail(e.stdout.decode())
+
+
+@auto_fixable
+@pytest.mark.parametrize("context_override", SUPPORTED_COMBINATIONS, ids=_fixture_id)
+def test_djlint_check_passes(cookies, context_override):
+    """Check whether generated project passes djLint --check."""
+    result = cookies.bake(extra_context=context_override)
+
+    try:
+        sh.djlint("--check", ".", _cwd=str(result.project_path))
+    except sh.ErrorReturnCode as e:
+        pytest.fail(e.stdout.decode())
+
+
 @pytest.mark.parametrize(
     ["use_docker", "expected_test_script"],
     [

{{cookiecutter.project_slug}}/.pre-commit-config.yaml

@@ -51,6 +51,12 @@ repos:
     hooks:
       - id: flake8
 
+  - repo: https://github.com/Riverside-Healthcare/djLint
+    rev: v1.31.1
+    hooks:
+      - id: djlint-reformat-django
+      - id: djlint-django
+
 # sets up .pre-commit-ci.yaml to ensure pre-commit dependencies stay up to date
 ci:
   autoupdate_schedule: weekly

{{cookiecutter.project_slug}}/pyproject.toml

@@ -90,3 +90,23 @@ generated-members = [
     "save",
     "delete",
 ]
+
+
+# ==== djLint ====
+[tool.djlint]
+blank_line_after_tag = "load,extends"
+close_void_tags = true
+format_css = true
+format_js = true
+# TODO: remove T002 when fixed https://github.com/Riverside-Healthcare/djLint/issues/687
+ignore = "H006,H030,H031,T002"
+include = "H017,H035"
+indent = 2
+max_line_length = 119
+profile = "django"
+
+[tool.djlint.css]
+indent_size = 2
+
+[tool.djlint.js]
+indent_size = 2

{{cookiecutter.project_slug}}/requirements/local.txt

@@ -32,6 +32,7 @@ flake8==6.0.0  # https://github.com/PyCQA/flake8
 flake8-isort==6.0.0  # https://github.com/gforcada/flake8-isort
 coverage==7.2.7  # https://github.com/nedbat/coveragepy
 black==23.3.0  # https://github.com/psf/black
+djlint==1.31.1  # https://github.com/Riverside-Healthcare/djLint
 pylint-django==2.5.3  # https://github.com/PyCQA/pylint-django
 {%- if cookiecutter.use_celery == 'y' %}
 pylint-celery==0.3  # https://github.com/PyCQA/pylint-celery

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/403.html

@@ -1,10 +1,14 @@
 {% raw %}{% extends "base.html" %}
 
-{% block title %}Forbidden (403){% endblock %}
+{% block title %}Forbidden (403){% endblock title %}
-
 {% block content %}
   <h1>Forbidden (403)</h1>
-
+  <p>
-<p>{% if exception %}{{ exception }}{% else %}You're not allowed to access this page.{% endif %}</p>
+    {% if exception %}
+      {{ exception }}
+    {% else %}
+      You're not allowed to access this page.
+    {% endif %}
+  </p>
 {% endblock content %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/404.html

@@ -1,10 +1,14 @@
 {% raw %}{% extends "base.html" %}
 
-{% block title %}Page not found{% endblock %}
+{% block title %}Page not found{% endblock title %}
-
 {% block content %}
   <h1>Page not found</h1>
-
+  <p>
-<p>{% if exception %}{{ exception }}{% else %}This is not the page you were looking for.{% endif %}</p>
+    {% if exception %}
+      {{ exception }}
+    {% else %}
+      This is not the page you were looking for.
+    {% endif %}
+  </p>
 {% endblock content %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/500.html

@@ -1,12 +1,11 @@
 {% raw %}{% extends "base.html" %}
 
-{% block title %}Server Error{% endblock %}
+{% block title %}Server Error{% endblock title %}
-
 {% block content %}
   <h1>Ooops!!! 500</h1>
-
   <h3>Looks like something went wrong!</h3>
-
+  <p>
-<p>We track these errors automatically, but if the problem persists feel free to contact us. In the meantime, try refreshing.</p>
+    We track these errors automatically, but if the problem persists feel free to contact us. In the meantime, try refreshing.
+  </p>
 {% endblock content %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/account_inactive.html

@@ -2,11 +2,11 @@
 
 {% load i18n %}
 
-{% block head_title %}{% translate "Account Inactive" %}{% endblock %}
+{% block head_title %}
-
+  {% translate "Account Inactive" %}
+{% endblock head_title %}
 {% block inner %}
   <h1>{% translate "Account Inactive" %}</h1>
-
   <p>{% translate "This account is inactive." %}</p>
-{% endblock %}
+{% endblock inner %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/base.html

@@ -1,11 +1,14 @@
 {% raw %}{% extends "base.html" %}
-{% block title %}{% block head_title %}{% endblock head_title %}{% endblock title %}
 
+{% block title %}
+  {% block head_title %}
+  {% endblock head_title %}
+{% endblock title %}
 {% block content %}
   <div class="row">
     <div class="col-md-6 offset-md-3">
-    {% block inner %}{% endblock %}
+      {% block inner %}{% endblock inner %}
     </div>
   </div>
-{% endblock %}
+{% endblock content %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/email.html

@@ -4,61 +4,62 @@
 {% load i18n %}
 {% load crispy_forms_tags %}
 
-{% block head_title %}{% translate "Account" %}{% endblock %}
+{% block head_title %}
-
+  {% translate "Account" %}
+{% endblock head_title %}
 {% block inner %}
   <h1>{% translate "E-mail Addresses" %}</h1>
-
   {% if user.emailaddress_set.all %}
-<p>{% translate 'The following e-mail addresses are associated with your account:' %}</p>
+    <p>{% translate "The following e-mail addresses are associated with your account:" %}</p>
-
     <form action="{% url 'account_email' %}" class="email_list" method="post">
       {% csrf_token %}
       <fieldset class="blockLabels">
-
         {% for emailaddress in user.emailaddress_set.all %}
           <div class="radio">
-  <label for="email_radio_{{forloop.counter}}" class="{% if emailaddress.primary %}primary_email{%endif%}">
+            <label for="email_radio_{{ forloop.counter }}"
-
+                   class="{% if emailaddress.primary %}primary_email{% endif %}">
-    <input id="email_radio_{{forloop.counter}}" type="radio" name="email" {% if emailaddress.primary or user.emailaddress_set.count == 1 %}checked="checked"{%endif %} value="{{emailaddress.email}}"/>
+              <input id="email_radio_{{ forloop.counter }}"
-
+                     type="radio"
+                     name="email"
+                     {% if emailaddress.primary or user.emailaddress_set.count == 1 %}checked="checked"{% endif %}
+                     value="{{ emailaddress.email }}" />
               {{ emailaddress.email }}
               {% if emailaddress.verified %}
                 <span class="verified">{% translate "Verified" %}</span>
               {% else %}
                 <span class="unverified">{% translate "Unverified" %}</span>
               {% endif %}
-    {% if emailaddress.primary %}<span class="primary">{% translate "Primary" %}</span>{% endif %}
+              {% if emailaddress.primary %}
+                <span class="primary">{% translate "Primary" %}</span>
+              {% endif %}
             </label>
           </div>
         {% endfor %}
-
         <div class="form-group">
-      <button class="secondaryAction btn btn-primary" type="submit" name="action_primary" >{% translate 'Make Primary' %}</button>
+          <button class="secondaryAction btn btn-primary"
-      <button class="secondaryAction btn btn-primary" type="submit" name="action_send" >{% translate 'Re-send Verification' %}</button>
+                  type="submit"
-      <button class="primaryAction btn btn-primary" type="submit" name="action_remove" >{% translate 'Remove' %}</button>
+                  name="action_primary">{% translate "Make Primary" %}</button>
+          <button class="secondaryAction btn btn-primary"
+                  type="submit"
+                  name="action_send">{% translate "Re-send Verification" %}</button>
+          <button class="primaryAction btn btn-primary"
+                  type="submit"
+                  name="action_remove">{% translate "Remove" %}</button>
         </div>
-
       </fieldset>
     </form>
-
   {% else %}
-<p><strong>{% translate 'Warning:'%}</strong> {% translate "You currently do not have any e-mail address set up. You should really add an e-mail address so you can receive notifications, reset your password, etc." %}</p>
+    <p>
-
+      <strong>{% translate "Warning:" %}</strong> {% translate "You currently do not have any e-mail address set up. You should really add an e-mail address so you can receive notifications, reset your password, etc." %}
+    </p>
   {% endif %}
-
-
   <h2>{% translate "Add E-mail Address" %}</h2>
-
   <form method="post" action="{% url 'account_email' %}" class="add_email">
     {% csrf_token %}
     {{ form|crispy }}
     <button class="btn btn-primary" name="action_add" type="submit">{% translate "Add E-mail" %}</button>
   </form>
-
+{% endblock inner %}
-{% endblock %}
-
-
 {% block inline_javascript %}
   {{ block.super }}
   <script type="text/javascript">
@@ -75,5 +76,5 @@ window.addEventListener('DOMContentLoaded',function() {
       Array.from(document.getElementsByClassName('form-group')).forEach(x => x.classList.remove('row'));
     });
   </script>
-{% endblock %}
+{% endblock inline_javascript %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/email_confirm.html

@@ -3,30 +3,26 @@
 {% load i18n %}
 {% load account %}
 
-{% block head_title %}{% translate "Confirm E-mail Address" %}{% endblock %}
+{% block head_title %}
-
+  {% translate "Confirm E-mail Address" %}
-
+{% endblock head_title %}
 {% block inner %}
   <h1>{% translate "Confirm E-mail Address" %}</h1>
-
   {% if confirmation %}
-
     {% user_display confirmation.email_address.user as user_display %}
-
+    <p>
-<p>{% blocktranslate with confirmation.email_address.email as email %}Please confirm that <a href="mailto:{{ email }}">{{ email }}</a> is an e-mail address for user {{ user_display }}.{% endblocktranslate %}</p>
+      {% blocktranslate with confirmation.email_address.email as email %}Please confirm that <a href="mailto:{{ email }}">{{ email }}</a> is an e-mail address for user {{ user_display }}.{% endblocktranslate %}
-
+    </p>
-<form method="post" action="{% url 'account_confirm_email' confirmation.key %}">
+    <form method="post"
+          action="{% url 'account_confirm_email' confirmation.key %}">
       {% csrf_token %}
-    <button class="btn btn-primary" type="submit">{% translate 'Confirm' %}</button>
+      <button class="btn btn-primary" type="submit">{% translate "Confirm" %}</button>
     </form>
-
   {% else %}
-
     {% url 'account_email' as email_url %}
-
+    <p>
-<p>{% blocktranslate %}This e-mail confirmation link expired or is invalid. Please <a href="{{ email_url }}">issue a new e-mail confirmation request</a>.{% endblocktranslate %}</p>
+      {% blocktranslate %}This e-mail confirmation link expired or is invalid. Please <a href="{{ email_url }}">issue a new e-mail confirmation request</a>.{% endblocktranslate %}
-
+    </p>
   {% endif %}
-
+{% endblock inner %}
-{% endblock %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/login.html

@@ -4,14 +4,12 @@
 {% load account socialaccount %}
 {% load crispy_forms_tags %}
 
-{% block head_title %}{% translate "Sign In" %}{% endblock %}
+{% block head_title %}
-
+  {% translate "Sign In" %}
+{% endblock head_title %}
 {% block inner %}
-
   <h1>{% translate "Sign In" %}</h1>
-
   {% get_providers as socialaccount_providers %}
-
   {% if socialaccount_providers %}
     <p>
       {% translate "Please sign in with one of your existing third party accounts:" %}
@@ -22,19 +20,13 @@
         {% endblocktranslate %}
       {% endif %}
     </p>
-
     <div class="socialaccount_ballot">
-
       <ul class="socialaccount_providers">
         {% include "socialaccount/snippets/provider_list.html" with process="login" %}
       </ul>
-
       <div class="login-or">{% translate "or" %}</div>
-
     </div>
-
     {% include "socialaccount/snippets/login_extra.html" %}
-
   {% else %}
     {% if ACCOUNT_ALLOW_REGISTRATION %}
       <p>
@@ -45,16 +37,17 @@
       </p>
     {% endif %}
   {% endif %}
-
+  <form class="login" method="post" action="{% url 'account_login' %}">
-<form class="login" method="POST" action="{% url 'account_login' %}">
     {% csrf_token %}
     {{ form|crispy }}
     {% if redirect_field_value %}
-  <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
+      <input type="hidden"
+             name="{{ redirect_field_name }}"
+             value="{{ redirect_field_value }}" />
     {% endif %}
-  <a class="button secondaryAction" href="{% url 'account_reset_password' %}">{% translate "Forgot Password?" %}</a>
+    <a class="button secondaryAction"
+       href="{% url 'account_reset_password' %}">{% translate "Forgot Password?" %}</a>
     <button class="primaryAction btn btn-primary" type="submit">{% translate "Sign In" %}</button>
   </form>
-
+{% endblock inner %}
-{% endblock %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/logout.html

@@ -2,19 +2,20 @@
 
 {% load i18n %}
 
-{% block head_title %}{% translate "Sign Out" %}{% endblock %}
+{% block head_title %}
-
+  {% translate "Sign Out" %}
+{% endblock head_title %}
 {% block inner %}
   <h1>{% translate "Sign Out" %}</h1>
-
+  <p>{% translate "Are you sure you want to sign out?" %}</p>
-<p>{% translate 'Are you sure you want to sign out?' %}</p>
-
   <form method="post" action="{% url 'account_logout' %}">
     {% csrf_token %}
     {% if redirect_field_value %}
-  <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}"/>
+      <input type="hidden"
+             name="{{ redirect_field_name }}"
+             value="{{ redirect_field_value }}" />
     {% endif %}
-  <button class="btn btn-danger" type="submit">{% translate 'Sign Out' %}</button>
+    <button class="btn btn-danger" type="submit">{% translate "Sign Out" %}</button>
   </form>
-{% endblock %}
+{% endblock inner %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/password_change.html

@@ -3,15 +3,17 @@
 {% load i18n %}
 {% load crispy_forms_tags %}
 
-{% block head_title %}{% translate "Change Password" %}{% endblock %}
+{% block head_title %}
-
+  {% translate "Change Password" %}
+{% endblock head_title %}
 {% block inner %}
   <h1>{% translate "Change Password" %}</h1>
-
+  <form method="post"
-    <form method="POST" action="{% url 'account_change_password' %}" class="password_change">
+        action="{% url 'account_change_password' %}"
+        class="password_change">
     {% csrf_token %}
     {{ form|crispy }}
     <button class="btn btn-primary" type="submit" name="action">{% translate "Change Password" %}</button>
   </form>
-{% endblock %}
+{% endblock inner %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/password_reset.html

@@ -4,23 +4,26 @@
 {% load account %}
 {% load crispy_forms_tags %}
 
-{% block head_title %}{% translate "Password Reset" %}{% endblock %}
+{% block head_title %}
-
+  {% translate "Password Reset" %}
+{% endblock head_title %}
 {% block inner %}
-
   <h1>{% translate "Password Reset" %}</h1>
   {% if user.is_authenticated %}
     {% include "account/snippets/already_logged_in.html" %}
   {% endif %}
-
+  <p>
-    <p>{% translate "Forgotten your password? Enter your e-mail address below, and we'll send you an e-mail allowing you to reset it." %}</p>
+    {% translate "Forgotten your password? Enter your e-mail address below, and we'll send you an e-mail allowing you to reset it." %}
-
+  </p>
-    <form method="POST" action="{% url 'account_reset_password' %}" class="password_reset">
+  <form method="post"
+        action="{% url 'account_reset_password' %}"
+        class="password_reset">
     {% csrf_token %}
     {{ form|crispy }}
-        <input class="btn btn-primary" type="submit" value="{% translate 'Reset My Password' %}" />
+    <input class="btn btn-primary"
+           type="submit"
+           value="{% translate 'Reset My Password' %}" />
   </form>
-
   <p>{% blocktranslate %}Please contact us if you have any trouble resetting your password.{% endblocktranslate %}</p>
-{% endblock %}
+{% endblock inner %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/password_reset_done.html

@@ -3,15 +3,16 @@
 {% load i18n %}
 {% load account %}
 
-{% block head_title %}{% translate "Password Reset" %}{% endblock %}
+{% block head_title %}
-
+  {% translate "Password Reset" %}
+{% endblock head_title %}
 {% block inner %}
   <h1>{% translate "Password Reset" %}</h1>
-
   {% if user.is_authenticated %}
     {% include "account/snippets/already_logged_in.html" %}
   {% endif %}
-
+  <p>
-    <p>{% blocktranslate %}We have sent you an e-mail. Please contact us if you do not receive it within a few minutes.{% endblocktranslate %}</p>
+    {% blocktranslate %}We have sent you an e-mail. Please contact us if you do not receive it within a few minutes.{% endblocktranslate %}
-{% endblock %}
+  </p>
+{% endblock inner %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/password_reset_from_key.html

@@ -2,24 +2,36 @@
 
 {% load i18n %}
 {% load crispy_forms_tags %}
-{% block head_title %}{% translate "Change Password" %}{% endblock %}
 
+{% block head_title %}
+  {% translate "Change Password" %}
+{% endblock head_title %}
 {% block inner %}
-    <h1>{% if token_fail %}{% translate "Bad Token" %}{% else %}{% translate "Change Password" %}{% endif %}</h1>
+  <h1>
-
+    {% if token_fail %}
+      {% translate "Bad Token" %}
+    {% else %}
+      {% translate "Change Password" %}
+    {% endif %}
+  </h1>
   {% if token_fail %}
     {% url 'account_reset_password' as passwd_reset_url %}
-        <p>{% blocktranslate %}The password reset link was invalid, possibly because it has already been used.  Please request a <a href="{{ passwd_reset_url }}">new password reset</a>.{% endblocktranslate %}</p>
+    <p>
+      {% blocktranslate %}The password reset link was invalid, possibly because it has already been used.  Please request a <a href="{{ passwd_reset_url }}">new password reset</a>.{% endblocktranslate %}
+    </p>
   {% else %}
     {% if form %}
-            <form method="POST" action=".">
+      <form method="post" action=".">
         {% csrf_token %}
         {{ form|crispy }}
-                <input class="btn btn-primary" type="submit" name="action" value="{% translate 'change password' %}"/>
+        <input class="btn btn-primary"
+               type="submit"
+               name="action"
+               value="{% translate 'change password' %}" />
       </form>
     {% else %}
-            <p>{% translate 'Your password is now changed.' %}</p>
+      <p>{% translate "Your password is now changed." %}</p>
     {% endif %}
   {% endif %}
-{% endblock %}
+{% endblock inner %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/password_reset_from_key_done.html

@@ -1,10 +1,12 @@
 {% raw %}{% extends "account/base.html" %}
 
 {% load i18n %}
-{% block head_title %}{% translate "Change Password" %}{% endblock %}
 
+{% block head_title %}
+  {% translate "Change Password" %}
+{% endblock head_title %}
 {% block inner %}
   <h1>{% translate "Change Password" %}</h1>
-    <p>{% translate 'Your password is now changed.' %}</p>
+  <p>{% translate "Your password is now changed." %}</p>
-{% endblock %}
+{% endblock inner %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/password_set.html

@@ -3,15 +3,20 @@
 {% load i18n %}
 {% load crispy_forms_tags %}
 
-{% block head_title %}{% translate "Set Password" %}{% endblock %}
+{% block head_title %}
-
+  {% translate "Set Password" %}
+{% endblock head_title %}
 {% block inner %}
   <h1>{% translate "Set Password" %}</h1>
-
+  <form method="post"
-    <form method="POST" action="{% url 'account_set_password' %}" class="password_set">
+        action="{% url 'account_set_password' %}"
+        class="password_set">
     {% csrf_token %}
     {{ form|crispy }}
-        <input class="btn btn-primary" type="submit" name="action" value="{% translate 'Set Password' %}"/>
+    <input class="btn btn-primary"
+           type="submit"
+           name="action"
+           value="{% translate 'Set Password' %}" />
   </form>
-{% endblock %}
+{% endblock inner %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/signup.html

@@ -3,21 +3,26 @@
 {% load i18n %}
 {% load crispy_forms_tags %}
 
-{% block head_title %}{% translate "Signup" %}{% endblock %}
+{% block head_title %}
-
+  {% translate "Signup" %}
+{% endblock head_title %}
 {% block inner %}
   <h1>{% translate "Sign Up" %}</h1>
-
+  <p>
-<p>{% blocktranslate %}Already have an account? Then please <a href="{{ login_url }}">sign in</a>.{% endblocktranslate %}</p>
+    {% blocktranslate %}Already have an account? Then please <a href="{{ login_url }}">sign in</a>.{% endblocktranslate %}
-
+  </p>
-<form class="signup" id="signup_form" method="post" action="{% url 'account_signup' %}">
+  <form class="signup"
+        id="signup_form"
+        method="post"
+        action="{% url 'account_signup' %}">
     {% csrf_token %}
     {{ form|crispy }}
     {% if redirect_field_value %}
-  <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
+      <input type="hidden"
+             name="{{ redirect_field_name }}"
+             value="{{ redirect_field_value }}" />
     {% endif %}
-  <button class="btn btn-primary" type="submit">{% translate "Sign Up" %} &raquo;</button>
+    <button class="btn btn-primary" type="submit">{% translate "Sign Up" %} »</button>
   </form>
-
+{% endblock inner %}
-{% endblock %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/signup_closed.html

@@ -2,11 +2,11 @@
 
 {% load i18n %}
 
-{% block head_title %}{% translate "Sign Up Closed" %}{% endblock %}
+{% block head_title %}
-
+  {% translate "Sign Up Closed" %}
+{% endblock head_title %}
 {% block inner %}
   <h1>{% translate "Sign Up Closed" %}</h1>
-
   <p>{% translate "We are sorry, but the sign up is currently closed." %}</p>
-{% endblock %}
+{% endblock inner %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/verification_sent.html

@@ -2,12 +2,13 @@
 
 {% load i18n %}
 
-{% block head_title %}{% translate "Verify Your E-mail Address" %}{% endblock %}
+{% block head_title %}
-
+  {% translate "Verify Your E-mail Address" %}
+{% endblock head_title %}
 {% block inner %}
   <h1>{% translate "Verify Your E-mail Address" %}</h1>
-
+  <p>
-    <p>{% blocktranslate %}We have sent an e-mail to you for verification. Follow the link provided to finalize the signup process. Please contact us if you do not receive it within a few minutes.{% endblocktranslate %}</p>
+    {% blocktranslate %}We have sent an e-mail to you for verification. Follow the link provided to finalize the signup process. Please contact us if you do not receive it within a few minutes.{% endblocktranslate %}
-
+  </p>
-{% endblock %}
+{% endblock inner %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/account/verified_email_required.html

@@ -2,21 +2,24 @@
 
 {% load i18n %}
 
-{% block head_title %}{% translate "Verify Your E-mail Address" %}{% endblock %}
+{% block head_title %}
-
+  {% translate "Verify Your E-mail Address" %}
+{% endblock head_title %}
 {% block inner %}
   <h1>{% translate "Verify Your E-mail Address" %}</h1>
-
   {% url 'account_email' as email_url %}
-
+  <p>
-<p>{% blocktranslate %}This part of the site requires us to verify that
+    {% blocktranslate %}This part of the site requires us to verify that
 you are who you claim to be. For this purpose, we require that you
-verify ownership of your e-mail address. {% endblocktranslate %}</p>
+verify ownership of your e-mail address. {% endblocktranslate %}
-
+  </p>
-<p>{% blocktranslate %}We have sent an e-mail to you for
+  <p>
+    {% blocktranslate %}We have sent an e-mail to you for
 verification. Please click on the link inside this e-mail. Please
-contact us if you do not receive it within a few minutes.{% endblocktranslate %}</p>
+contact us if you do not receive it within a few minutes.{% endblocktranslate %}
-
+  </p>
-<p>{% blocktranslate %}<strong>Note:</strong> you can still <a href="{{ email_url }}">change your e-mail address</a>.{% endblocktranslate %}</p>
+  <p>
-{% endblock %}
+    {% blocktranslate %}<strong>Note:</strong> you can still <a href="{{ email_url }}">change your e-mail address</a>.{% endblocktranslate %}
+  </p>
+{% endblock inner %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/base.html

@@ -1,87 +1,130 @@
-{% raw %}{% load static i18n {% endraw %}
+{% raw %}
-{%- if cookiecutter.frontend_pipeline == 'Django Compressor' %}compress
+{% load static i18n {% endraw %}
-{%- endif %}{% raw %}%}{% endraw %}
+
-{%- if cookiecutter.frontend_pipeline == 'Webpack' %}{% raw %}{% load render_bundle from webpack_loader %}{% endraw %}
+{%- if cookiecutter.frontend_pipeline == 'Django Compressor' %}compress{%- endif %}{% raw %}%}{% endraw %}
+  {%- if cookiecutter.frontend_pipeline == 'Webpack' %}{% raw %}
+    {% load render_bundle from webpack_loader %}
+
+  {% endraw %}
 {%- endif %}{% raw %}<!DOCTYPE html>
 {% get_current_language as LANGUAGE_CODE %}
 <html lang="{{ LANGUAGE_CODE }}">
   <head>
-    <meta charset="utf-8">
+    <meta charset="utf-8" />
-    <meta http-equiv="x-ua-compatible" content="ie=edge">
+    <meta http-equiv="x-ua-compatible" content="ie=edge" />
-    <title>{% block title %}{% endraw %}{{ cookiecutter.project_name }}{% raw %}{% endblock title %}</title>
+    <title>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+      {% block title %}
-    <meta name="description" content="{% endraw %}{{ cookiecutter.description }}{% raw %}">
+      {% endraw %}{{ cookiecutter.project_name }}{% raw %}
-    <meta name="author" content="{% endraw %}{{ cookiecutter.author_name }}{% raw %}">
+    {% endblock title %}
-
+  </title>
-    <link rel="icon" href="{% static 'images/favicons/favicon.ico' %}">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-
+  <meta name="description"
+        content="{% endraw %}{{ cookiecutter.description }}{% raw %}" />
+  <meta name="author"
+        content="{% endraw %}{{ cookiecutter.author_name }}{% raw %}" />
+  <link rel="icon" href="{% static 'images/favicons/favicon.ico' %}" />
   {% block css %}
   {%- endraw %}
   {%- if cookiecutter.frontend_pipeline in ['None', 'Django Compressor'] %}
     {%- raw %}
     <!-- Latest compiled and minified Bootstrap CSS -->
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.2.3/css/bootstrap.min.css" integrity="sha512-SbiR/eusphKoMVVXysTKG/7VseWii+Y3FdHrt0EpKgpToZeemhqHeZeLWLhJutz/2ut2Vw1uQEj2MbRF+TVBUA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+    <link rel="stylesheet"
+          href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.2.3/css/bootstrap.min.css"
+          integrity="sha512-SbiR/eusphKoMVVXysTKG/7VseWii+Y3FdHrt0EpKgpToZeemhqHeZeLWLhJutz/2ut2Vw1uQEj2MbRF+TVBUA=="
+          crossorigin="anonymous"
+          referrerpolicy="no-referrer" />
   {%- endraw %}
 {%- endif %}
 {%- raw %}
 <!-- Your stuff: Third-party CSS libraries go here -->
-
 <!-- This file stores project-specific CSS -->
-    {%- endraw %}{% if cookiecutter.frontend_pipeline == 'None' %}{% raw %}
+{%- endraw %}
-    <link href="{% static 'css/project.css' %}" rel="stylesheet">
+{% if cookiecutter.frontend_pipeline == 'None' %}
-    {%- endraw %}{% elif cookiecutter.frontend_pipeline == 'Django Compressor' %}{% raw %}
+  {% raw %}
+  <link href="{% static 'css/project.css' %}" rel="stylesheet" />
+{%- endraw %}
+{% elif cookiecutter.frontend_pipeline == 'Django Compressor' %}
+{% raw %}
 {% compress css %}
-    <link href="{% static 'css/project.css' %}" rel="stylesheet">
+  <link href="{% static 'css/project.css' %}" rel="stylesheet" />
 {% endcompress %}
-    {%- endraw %}{% elif cookiecutter.frontend_pipeline == 'Gulp' %}{% raw %}
+{%- endraw %}
-    <link href="{% static 'css/project.min.css' %}" rel="stylesheet">
+{% elif cookiecutter.frontend_pipeline == 'Gulp' %}
-    {%- endraw %}{% elif cookiecutter.frontend_pipeline == "Webpack" %}{% raw %}
+{% raw %}
+<link href="{% static 'css/project.min.css' %}" rel="stylesheet" />
+{%- endraw %}
+{% elif cookiecutter.frontend_pipeline == "Webpack" %}
+{% raw %}
 {% render_bundle 'project' 'css' %}
-    {%- endraw %}{% endif %}{% raw %}
+{%- endraw %}
-    {% endblock %}
+{% endif %}
+{% raw %}
+{% endblock css %}
 <!-- Le javascript
     ================================================== -->
 {# Placed at the top of the document so pages load faster with defer #}
 {% block javascript %}
-      {%- endraw %}{% if cookiecutter.frontend_pipeline == 'Gulp' %}{% raw %}
+{%- endraw %}
+{% if cookiecutter.frontend_pipeline == 'Gulp' %}
+  {% raw %}
   <!-- Vendor dependencies bundled as one file -->
   <script defer src="{% static 'js/vendors.min.js' %}"></script>
-      {%- endraw %}{% elif cookiecutter.frontend_pipeline == "Webpack" %}{% raw %}
+{%- endraw %}
+{% elif cookiecutter.frontend_pipeline == "Webpack" %}
+{% raw %}
 <!-- Vendor dependencies bundled as one file -->
 {% render_bundle 'vendors' 'js' attrs='defer' %}
-      {%- endraw %}{% else %}{% raw %}
+{%- endraw %}
+{% else %}
+{% raw %}
 <!-- Bootstrap JS -->
-      <script defer src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.2.3/js/bootstrap.min.js" integrity="sha512-1/RvZTcCDEUjY/CypiMz+iqqtaoQfAITmNSJY17Myp4Ms5mdxPS5UV7iOfdZoxcGhzFbOm6sntTKJppjvuhg4g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script defer
+        src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.2.3/js/bootstrap.min.js"
+        integrity="sha512-1/RvZTcCDEUjY/CypiMz+iqqtaoQfAITmNSJY17Myp4Ms5mdxPS5UV7iOfdZoxcGhzFbOm6sntTKJppjvuhg4g=="
+        crossorigin="anonymous"
+        referrerpolicy="no-referrer"></script>
 <!-- Your stuff: Third-party javascript libraries go here -->
-      {%- endraw %}{% endif %}{% raw %}
+{%- endraw %}
-
+{% endif %}
+{% raw %}
 <!-- place project specific Javascript in this file -->
-      {%- endraw %}{% if cookiecutter.frontend_pipeline == 'None' %}{% raw %}
+{%- endraw %}
+{% if cookiecutter.frontend_pipeline == 'None' %}
+  {% raw %}
   <script defer src="{% static 'js/project.js' %}"></script>
-      {%- endraw %}{% elif cookiecutter.frontend_pipeline == 'Django Compressor' %}{% raw %}
+{%- endraw %}
+{% elif cookiecutter.frontend_pipeline == 'Django Compressor' %}
+{% raw %}
 {% compress js %}
   <script defer src="{% static 'js/project.js' %}"></script>
 {% endcompress %}
-      {%- endraw %}{% elif cookiecutter.frontend_pipeline == 'Gulp' %}{% raw %}
+{%- endraw %}
+{% elif cookiecutter.frontend_pipeline == 'Gulp' %}
+{% raw %}
 <script defer src="{% static 'js/project.min.js' %}"></script>
-      {%- endraw %}{% elif cookiecutter.frontend_pipeline == "Webpack" %}{% raw %}
+{%- endraw %}
+{% elif cookiecutter.frontend_pipeline == "Webpack" %}
+{% raw %}
 {% render_bundle 'project' 'js' attrs='defer' %}
-      {%- endraw %}{% endif %}{% raw %}
+{%- endraw %}
-
+{% endif %}
+{% raw %}
 {% endblock javascript %}
-
 </head>
-
 <body>
-
   <div class="mb-1">
     <nav class="navbar navbar-expand-md navbar-light bg-light">
       <div class="container-fluid">
-          <button class="navbar-toggler navbar-toggler-right" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+        <button class="navbar-toggler navbar-toggler-right"
+                type="button"
+                data-bs-toggle="collapse"
+                data-bs-target="#navbarSupportedContent"
+                aria-controls="navbarSupportedContent"
+                aria-expanded="false"
+                aria-label="Toggle navigation">
           <span class="navbar-toggler-icon"></span>
         </button>
         <a class="navbar-brand" href="{% url 'home' %}">{% endraw %}{{ cookiecutter.project_name }}{% raw %}</a>
-
         <div class="collapse navbar-collapse" id="navbarSupportedContent">
           <ul class="navbar-nav mr-auto">
             <li class="nav-item active">
@@ -92,7 +135,8 @@
             </li>
             {% if request.user.is_authenticated %}
               <li class="nav-item">
-                  <a class="nav-link" href="{% endraw %}{% if cookiecutter.username_type == "email" %}{% raw %}{% url 'users:detail' request.user.pk %}{% endraw %}{% else %}{% raw %}{% url 'users:detail' request.user.username %}{% endraw %}{% endif %}{% raw %}">{% translate "My Profile" %}</a>
+                <a class="nav-link"
+                   href="{% endraw %}{% if cookiecutter.username_type == "email" %}{% raw %}{% url 'users:detail' request.user.pk %}{% endraw %}{% else %}{% raw %}{% url 'users:detail' request.user.username %}{% endraw %}{% endif %}{% raw %}">{% translate "My Profile" %}</a>
               </li>
               <li class="nav-item">
                 {# URL provided by django-allauth/account/urls.py #}
@@ -114,34 +158,34 @@
         </div>
       </div>
     </nav>
-
   </div>
-
   <div class="container">
-
     {% if messages %}
       {% for message in messages %}
         <div class="alert alert-dismissible {% if message.tags %}alert-{{ message.tags }}{% endif %}">
           {{ message }}
-            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+          <button type="button"
+                  class="btn-close"
+                  data-bs-dismiss="alert"
+                  aria-label="Close"></button>
         </div>
       {% endfor %}
     {% endif %}
-
     {% block content %}
       <p>Use this document as a way to quick start any new project.</p>
     {% endblock content %}
-
+  </div>
-    </div> <!-- /container -->
+  <!-- /container -->
-
+  {% block modal %}
-    {% block modal %}{% endblock modal %}
+  {% endblock modal %}
-
   {% block inline_javascript %}
     {% comment %}
     Script tags with only code, no src (defer by default). To run
     with a "defer" so that you run inline code:
     <script>
-      window.addEventListener('DOMContentLoaded', () => {/* Run whatever you want */});
+      window.addEventListener('DOMContentLoaded', () => {
+        /* Run whatever you want */
+      });
     </script>
     {% endcomment %}
   {% endblock inline_javascript %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/pages/about.html

@@ -1 +1,3 @@
-{% raw %}{% extends "base.html" %}{% endraw %}
+{% raw %}{% extends "base.html" %}
+
+{% endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/pages/home.html

@@ -1 +1,3 @@
-{% raw %}{% extends "base.html" %}{% endraw %}
+{% raw %}{% extends "base.html" %}
+
+{% endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/users/user_detail.html

@@ -1,35 +1,45 @@
 {% raw %}{% extends "base.html" %}
+
 {% load static %}
 
-{% block title %}User: {% endraw %}{% if cookiecutter.username_type == "email" %}{% raw %}{{ object.name }}{% endraw %}{% else %}{% raw %}{{ object.username }}{% endraw %}{% endif %}{% raw %}{% endblock %}
+{% block title %}
-
+  User: {% endraw %}
+  {% if cookiecutter.username_type == "email" %}
+    {% raw %}{{ object.name }}{% endraw %}
+  {% else %}
+    {% raw %}{{ object.username }}{% endraw %}
+  {% endif %}
+  {% raw %}
+{% endblock title %}
 {% block content %}
   <div class="container">
-
     <div class="row">
       <div class="col-sm-12">
-
+        <h2>
-      <h2>{% endraw %}{% if cookiecutter.username_type == "email" %}{% raw %}{{ object.name }}{% endraw %}{% else %}{% raw %}{{ object.username }}{% endraw %}{% endif %}{% raw %}</h2>
+        {% endraw %}
-      {% if object.name %}
+        {% if cookiecutter.username_type == "email" %}
-        <p>{{ object.name }}</p>
+          {% raw %}{{ object.name }}{% endraw %}
+        {% else %}
+          {% raw %}{{ object.username }}{% endraw %}
         {% endif %}
+        {% raw %}
+      </h2>
+      {% if object.name %}<p>{{ object.name }}</p>{% endif %}
     </div>
   </div>
-
   {% if object == request.user %}
     <!-- Action buttons -->
     <div class="row">
-
       <div class="col-sm-12">
         <a class="btn btn-primary" href="{% url 'users:update' %}" role="button">My Info</a>
-    <a class="btn btn-primary" href="{% url 'account_email' %}" role="button">E-Mail</a>
+        <a class="btn btn-primary"
+           href="{% url 'account_email' %}"
+           role="button">E-Mail</a>
         <!-- Your Stuff: Custom user template urls -->
       </div>
-
     </div>
     <!-- End Action buttons -->
   {% endif %}
-
 </div>
 {% endblock content %}
 {%- endraw %}

{{cookiecutter.project_slug}}/{{cookiecutter.project_slug}}/templates/users/user_form.html

@@ -1,11 +1,29 @@
 {% raw %}{% extends "base.html" %}
+
 {% load crispy_forms_tags %}
 
-{% block title %}{% endraw %}{% if cookiecutter.username_type == "email" %}{% raw %}{{ user.name }}{% endraw %}{% else %}{% raw %}{{ user.username }}{% endraw %}{% endif %}{% raw %}{% endblock %}
+{% block title %}
-
+{% endraw %}
+{% if cookiecutter.username_type == "email" %}
+  {% raw %}{{ user.name }}{% endraw %}
+{% else %}
+  {% raw %}{{ user.username }}{% endraw %}
+{% endif %}
+{% raw %}
+{% endblock title %}
 {% block content %}
-  <h1>{% endraw %}{% if cookiecutter.username_type == "email" %}{% raw %}{{ user.name }}{% endraw %}{% else %}{% raw %}{{ user.username }}{% endraw %}{% endif %}{% raw %}</h1>
+  <h1>
-  <form class="form-horizontal" method="post" action="{% url 'users:update' %}">
+  {% endraw %}
+  {% if cookiecutter.username_type == "email" %}
+    {% raw %}{{ user.name }}{% endraw %}
+  {% else %}
+    {% raw %}{{ user.username }}{% endraw %}
+  {% endif %}
+  {% raw %}
+</h1>
+<form class="form-horizontal"
+      method="post"
+      action="{% url 'users:update' %}">
   {% csrf_token %}
   {{ form|crispy }}
   <div class="control-group">
@@ -14,5 +32,5 @@
     </div>
   </div>
 </form>
-{% endblock %}
+{% endblock content %}
 {%- endraw %}