From 81baf940f4da682b23f8b08849d430b38f2558cd Mon Sep 17 00:00:00 2001
From: meli-imelda <meliimelda@traleor.com>
Date: Thu, 19 Oct 2023 18:47:47 +0100
Subject: [PATCH] Accounts settings panels - refine spacing and classes

---
 client/scss/layouts/_account.scss                           | 2 +-
 wagtail/admin/templates/wagtailadmin/account/account.html   | 4 +++-
 .../wagtailadmin/account/settings_panels/avatar.html        | 6 +++---
 3 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/client/scss/layouts/_account.scss b/client/scss/layouts/_account.scss
index cb08b39cd9..9f072d5420 100644
--- a/client/scss/layouts/_account.scss
+++ b/client/scss/layouts/_account.scss
@@ -1,4 +1,4 @@
-.avatar-panel {
+.w-avatar-panel {
   &__image {
     // do not display the user image if the clearing image is checked
     .avatar-clear:checked ~ .avatar.avatar-span {
diff --git a/wagtail/admin/templates/wagtailadmin/account/account.html b/wagtail/admin/templates/wagtailadmin/account/account.html
index 3e39992fbd..402d5c774e 100644
--- a/wagtail/admin/templates/wagtailadmin/account/account.html
+++ b/wagtail/admin/templates/wagtailadmin/account/account.html
@@ -32,7 +32,9 @@
                     >
                         {% for panel in panels %}
                             {% panel id=panel.name heading=panel.title heading_size="label" %}
-                                {{ panel.render }}
+                                <div class="w-account-settings-panel w-mt-5">
+                                    {{ panel.render }}
+                                </div>
                             {% endpanel %}
                         {% endfor %}
 
diff --git a/wagtail/admin/templates/wagtailadmin/account/settings_panels/avatar.html b/wagtail/admin/templates/wagtailadmin/account/settings_panels/avatar.html
index f98046cfee..772b7ecd06 100644
--- a/wagtail/admin/templates/wagtailadmin/account/settings_panels/avatar.html
+++ b/wagtail/admin/templates/wagtailadmin/account/settings_panels/avatar.html
@@ -1,7 +1,7 @@
 {% load i18n wagtailadmin_tags %}
 {% block content %}
-    <div class="avatar-panel w-flex w-flex-wrap w-items-center w-mt-5">
-        <div class="avatar-panel__image w-mr-9 w-mb-5">
+    <div class="w-avatar-panel w-flex w-flex-wrap w-items-center">
+        <div class="w-avatar-panel__image w-mr-9 w-mb-5">
             {% if form.avatar.value %}
                 <input class="avatar-clear" type="checkbox" name="avatar-avatar-clear" id="avatar-avatar-clear_id">
                 <label for="avatar-avatar-clear_id">{% trans "Reset to default" %}</label>
@@ -9,7 +9,7 @@
             {% endif %}
             {% avatar user=request.user classname="avatar-span w-block w-mt-3" size="large" %}
         </div>
-        <div class="avatar-panel__form">
+        <div class="w-avatar-panel__form">
             <label for="id_avatar-avatar">{% trans "Upload a profile picture:" %}</label>
             <input type="file" name="avatar-avatar" accept="image/*" id="id_avatar-avatar">
         </div>