feat: change password design (#1631)

Author: lukasvinclav

src/unfold/static/unfold/css/styles.css

@@ -1,12 +1,11 @@
 {% extends "admin/base_site.html" %}
 {% load admin_urls i18n static %}
 
-{% block extrastyle %}{{ block.super }}">{% endblock %}
+{% block extrastyle %}{{ block.super }}{% endblock %}
 
 {% block content %}
     <div id="content-main">
-        <p class="bg-primary-100 mb-8 text-primary-600 px-3 py-3 rounded-default text-sm">
-            {% translate 'Your password was changed.' %}
-        </p>
+        {% translate 'Your password was changed.' as message %}
+        {% include "unfold/helpers/messages/success.html" with message=message %}
     </div>
 {% endblock %}

src/unfold/templates/registration/password_change_done.html

@@ -19,15 +19,19 @@
 
                 {% include "unfold/helpers/messages/info.html" with message=message %}
 
-                {% include "unfold/helpers/field.html" with field=form.old_password %}
+                <fieldset class="fieldset group border border-base-200 mb-6 rounded-default shadow-xs p-3 dark:border-base-800 *:last:mb-0">
+                    {% include "unfold/helpers/field.html" with field=form.old_password %}
 
-                {% include "unfold/helpers/field.html" with field=form.new_password1 %}
+                    {% include "unfold/helpers/field.html" with field=form.new_password1 %}
 
-                {% include "unfold/helpers/field.html" with field=form.new_password2 %}
+                    {% include "unfold/helpers/field.html" with field=form.new_password2 %}
+                </fieldset>
 
-                <button type="submit" class="bg-primary-600 border border-transparent font-medium px-3 py-2 rounded-default text-sm text-white">
-                    {% translate 'Change password' %}
-                </button>
+                <div class="flex justify-end">
+                    <button type="submit" class="bg-primary-600 border border-transparent font-medium px-3 py-2 rounded-default text-sm text-white">
+                        {% translate 'Change password' %}
+                    </button>
+                </div>
             </div>
         </form>
     </div>