diff --git a/apps/accounts/forms.py b/apps/accounts/forms.py index 1ba4645a..181b0091 100644 --- a/apps/accounts/forms.py +++ b/apps/accounts/forms.py @@ -3,10 +3,9 @@ from allauth.account.forms import LoginForm from allauth.utils import get_request_param -from crispy_bootstrap5.bootstrap5 import FloatingField from crispy_forms.bootstrap import FormActions from crispy_forms.helper import FormHelper -from crispy_forms.layout import Field, Layout, Submit +from crispy_forms.layout import Field, Layout, Submit, Div class SignInForm(LoginForm): @@ -15,11 +14,23 @@ def __init__(self, *args, **kwargs): redirect_field_value = get_request_param(self.request, REDIRECT_FIELD_NAME) if redirect_field_value: self.fields[REDIRECT_FIELD_NAME] = forms.Field(initial=redirect_field_value) + + # Add Tailwind classes to form fields + self.fields['login'].widget.attrs.update({ + 'class': 'appearance-none rounded-md relative block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 placeholder-gray-500 dark:placeholder-gray-400 text-gray-900 dark:text-white bg-white dark:bg-gray-800 focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm', + 'placeholder': 'Email address' + }) + self.fields['password'].widget.attrs.update({ + 'class': 'appearance-none rounded-md relative block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 placeholder-gray-500 dark:placeholder-gray-400 text-gray-900 dark:text-white bg-white dark:bg-gray-800 focus:outline-none focus:ring-blue-500 focus:border-blue-500 focus:z-10 sm:text-sm', + 'placeholder': 'Password' + }) + self.helper = FormHelper() + self.helper.form_show_labels = False self.helper.layout = Layout( - FloatingField("login"), - FloatingField("password"), - Field("remember"), + Field("login"), + Field("password"), + Field("remember", css_class="rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50"), Field(REDIRECT_FIELD_NAME, type="hidden"), - FormActions(Submit(name="sign-in", value="Sign In", css_class="btn btn-primary w-100 py-2")), + FormActions(Submit(name="sign-in", value="Sign In", css_class="group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500")), ) diff --git a/apps/base/templates/account/base_entrance.html b/apps/base/templates/account/base_entrance.html index 8b9554a7..ee69a788 100755 --- a/apps/base/templates/account/base_entrance.html +++ b/apps/base/templates/account/base_entrance.html @@ -12,28 +12,22 @@ {% endblock content_class %} {% block content %} -

{% trans "Account Settings" %}

- +
+

{% trans "Account Settings" %}

+ +
{% block account_content %} {% endblock account_content %} {% endblock content %} diff --git a/apps/base/templates/account/login.html b/apps/base/templates/account/login.html index 08ca6ad1..60df03a9 100755 --- a/apps/base/templates/account/login.html +++ b/apps/base/templates/account/login.html @@ -10,25 +10,6 @@ {% block style %} {{ block.super }} - {% endblock style %} {% block base_header %} @@ -38,36 +19,53 @@ {% block body_id %}login-form{% endblock body_id %} {# djlint:on #} {% block content_class %} - w-100 m-auto + flex items-center justify-center min-h-screen py-12 px-4 sm:px-6 lg:px-8 {% endblock content_class %} {% block content %} -

{% trans "Sign In" %}

- {% if socialaccount.providers %} -

- {% blocktrans with site.name as site_name %}Please sign in with one -of your existing third party accounts. Or, sign up -for a {{site_name}} account and sign in -below:{% endblocktrans %} -

-
- -
{% trans "or" %}
+
+
+

{% trans "Sign In" %}

+ {% if socialaccount.providers %} +

+ {% blocktrans with site.name as site_name %}Please sign in with one + of your existing third party accounts. Or, sign up + for a {{site_name}} account and sign in + below:{% endblocktrans %} +

+
+
+ {% include "socialaccount/snippets/provider_list.html" with process="login" %} +
+
+
+
+
+
+
+ {% trans "or" %} +
+
+
+
+ {% include "socialaccount/snippets/login_extra.html" %} + {% endif %}
- {% include "socialaccount/snippets/login_extra.html" %} - {% endif %} - +
+ {% csrf_token %} +
+ {% crispy form %} +
+ {% if redirect_field_value %} + + {% endif %} +
+

+ {% blocktrans %}Don't have an account? Sign up{% endblocktrans %} +

+
+
+
{% endblock content %} diff --git a/apps/base/templates/account/name_change.html b/apps/base/templates/account/name_change.html index 450fecbd..73f65242 100644 --- a/apps/base/templates/account/name_change.html +++ b/apps/base/templates/account/name_change.html @@ -4,12 +4,12 @@ {# djlint:off #} {% block head_title %}Name{% endblock head_title %} -{% block account_nav_name %}active{% endblock account_nav_name %} +{% block account_nav_name %}border-blue-500 text-blue-600 dark:border-blue-400 dark:text-blue-400{% endblock account_nav_name %} {# djlint:on #} {% block account_content %} -
+ {% csrf_token %} {{ form|crispy }} - +
{% endblock account_content %} diff --git a/apps/base/templates/blocks/color_mode_picker.html b/apps/base/templates/blocks/color_mode_picker.html index 3749e353..16307d7e 100644 --- a/apps/base/templates/blocks/color_mode_picker.html +++ b/apps/base/templates/blocks/color_mode_picker.html @@ -1,5 +1,5 @@ {# djlint:off H021 #} - +
+ + + + {# djlint:on #} diff --git a/apps/base/templates/blocks/nav.html b/apps/base/templates/blocks/nav.html index 092c89a2..8139d9fd 100644 --- a/apps/base/templates/blocks/nav.html +++ b/apps/base/templates/blocks/nav.html @@ -1,62 +1,90 @@ -
-