From ac80109705d1f0a696f054912367603106ec6569 Mon Sep 17 00:00:00 2001
From: David Taylor <david@taylorhq.com>
Date: Mon, 24 Aug 2020 11:02:40 +0100
Subject: [PATCH] DEV: Improve user card styling extensibility (#10508)

- Add a metadata-row class
- Remove wrapper tags from user-card-after-metadata and user-card-before-badges outlets
- Correct max-height for mobile card
---
 .../app/templates/components/user-card-contents.hbs         | 6 +++---
 app/assets/stylesheets/mobile/components/user-card.scss     | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/templates/components/user-card-contents.hbs b/app/assets/javascripts/discourse/app/templates/components/user-card-contents.hbs
index 68b1800d834..28e08da19e2 100644
--- a/app/assets/javascripts/discourse/app/templates/components/user-card-contents.hbs
+++ b/app/assets/javascripts/discourse/app/templates/components/user-card-contents.hbs
@@ -189,7 +189,7 @@
         </div>
       {{/if}}
 
-      <div class="card-row">
+      <div class="card-row metadata-row">
         {{#unless this.user.profile_hidden}}
           <div class="metadata">
             {{#if this.user.last_posted_at}}
@@ -225,7 +225,7 @@
             {{plugin-outlet name="user-card-metadata" args=(hash user=this.user)}}
           </div>
         {{/unless}}
-        {{plugin-outlet name="user-card-after-metadata" args=(hash user=this.user)}}
+        {{plugin-outlet name="user-card-after-metadata" args=(hash user=this.user) tagName=""}}
       </div>
 
       {{#if this.publicUserFields}}
@@ -243,7 +243,7 @@
         </div>
       {{/if}}
 
-      {{plugin-outlet name="user-card-before-badges" args=(hash user=this.user)}}
+      {{plugin-outlet name="user-card-before-badges" args=(hash user=this.user) tagName=""}}
 
       {{#if this.showBadges}}
         <div class="card-row">
diff --git a/app/assets/stylesheets/mobile/components/user-card.scss b/app/assets/stylesheets/mobile/components/user-card.scss
index b53613efdb1..94ec4b19e58 100644
--- a/app/assets/stylesheets/mobile/components/user-card.scss
+++ b/app/assets/stylesheets/mobile/components/user-card.scss
@@ -8,7 +8,7 @@ $avatar_width: 120px;
   z-index: z("mobile-composer") + 2;
   max-width: 95vw;
   margin: 0 2.5vw;
-  max-height: 90vh;
+  max-height: 85vh; // 2.5vh margin-top and margin-bottom. 10vh top
   // avatar - names - controls
   .first-row {
     flex-wrap: wrap;