From 0ef70cb568337b27ecd9cd256d8ffc381a99e149 Mon Sep 17 00:00:00 2001
From: Peter Zimon <zimo@ghost.org>
Date: Mon, 8 Feb 2021 15:35:08 +0100
Subject: [PATCH] Updated member details page

---
 ghost/admin/app/components/gh-member-activity-feed.hbs | 2 +-
 ghost/admin/app/components/gh-member-settings-form.hbs | 7 ++++---
 ghost/admin/app/styles/layouts/main.css                | 5 +++--
 ghost/admin/app/templates/member.hbs                   | 4 ++--
 4 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/ghost/admin/app/components/gh-member-activity-feed.hbs b/ghost/admin/app/components/gh-member-activity-feed.hbs
index c03390d88f..7a523aaed0 100644
--- a/ghost/admin/app/components/gh-member-activity-feed.hbs
+++ b/ghost/admin/app/components/gh-member-activity-feed.hbs
@@ -1,7 +1,7 @@
 <div class="gh-member-feed gh-main-section-content pr" ...attributes>
     <h4 class="gh-main-section-heading no-border">Member activity</h4>
     
-    <div class="gh-content-box flex-auto flex flex-column justify-between items-stretch">
+    <div class="gh-content-box grey flex-auto flex flex-column justify-between items-stretch">
         <div>
             {{#if this.activities}}
                 {{#each this.firstActivities as |activity|}}
diff --git a/ghost/admin/app/components/gh-member-settings-form.hbs b/ghost/admin/app/components/gh-member-settings-form.hbs
index df14193d08..1a3dba8e05 100644
--- a/ghost/admin/app/components/gh-member-settings-form.hbs
+++ b/ghost/admin/app/components/gh-member-settings-form.hbs
@@ -63,8 +63,9 @@
         </div>
     </section>
 
-    <section class="gh-main-section flex items-start">
-        <div class="width-67 gh-main-section-content pt pr">
+    <h4 class="gh-main-section-heading no-border">Basic info</h4>
+    <section class="gh-main-section gh-content-box grey flex items-start">
+        <div class="width-67 gh-main-section-content pa prx2">
             <div>
                 <GhFormGroup @errors={{this.member.errors}} @hasValidated={{this.member.hasValidated}} @property="name" @classNames="max-width">
                     <label for="member-name">Name</label>
@@ -98,7 +99,7 @@
                 </div>
             </GhFormGroup>
         </div>
-        <div class="gh-main-section-content pt width-34">
+        <div class="gh-main-section-content pa width-34">
             <div class="flex-auto flex flex-column items-stretch">
                 <div>
                     <GhFormGroup @classNames="gh-member-labels">
diff --git a/ghost/admin/app/styles/layouts/main.css b/ghost/admin/app/styles/layouts/main.css
index 8c176fb309..6f6a7bca27 100644
--- a/ghost/admin/app/styles/layouts/main.css
+++ b/ghost/admin/app/styles/layouts/main.css
@@ -949,10 +949,11 @@
     padding: 0 var(--main-layout-content-sidepadding);
 }
 
+.gh-main-section-content.pa { padding: 20px 24px 24px; }
 .gh-main-section-content.pt { padding-top: 10px; }
-.gh-main-section-content.pr { padding-right: 54px; }
+.gh-main-section-content.pr { padding-right: 24px; }
 .gh-main-section-content.pb { padding-bottom: 10px; }
-.gh-main-section-content.pl { padding-left: 54px; }
+.gh-main-section-content.pl { padding-left: 24px; }
 
 .gh-main-white .gh-canvas-header {
     background: var(--white);
diff --git a/ghost/admin/app/templates/member.hbs b/ghost/admin/app/templates/member.hbs
index 9d98d7c1b5..3eb90e13e3 100644
--- a/ghost/admin/app/templates/member.hbs
+++ b/ghost/admin/app/templates/member.hbs
@@ -35,10 +35,10 @@
         </form>
 
         {{#unless this.member.isNew}}
-            <div class="w-60">
+            <div class="gh-main-section">
                 <button
                     type="button"
-                    class="gh-btn gh-btn-red gh-btn-icon mt14"
+                    class="gh-btn gh-btn-red gh-btn-icon"
                     {{on "click" this.toggleDeleteMemberModal}}
                     data-test-button="delete-member"
                 >