From bf61592b567f949ea65c0454e42a884dd065ab6e Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shpuld@gmail.com>
Date: Wed, 23 Aug 2017 20:33:20 +0300
Subject: Round the edge of the user profile user card, make sure 'follows you'
 stays in the right, fix avatar class conflict.

---
 src/components/user_card/user_card.vue | 30 ++++++++++++++++++------------
 1 file changed, 18 insertions(+), 12 deletions(-)

(limited to 'src/components/user_card/user_card.vue')

diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
index 5e886eb8..cc2f3978 100644
--- a/src/components/user_card/user_card.vue
+++ b/src/components/user_card/user_card.vue
@@ -7,14 +7,14 @@
       <user-card-content :user="user" :switcher="false"></user-card-content>
     </div>
     <div class="name-and-screen-name" v-else>
-      <div class="user-name">{{ user.name }}</div>
-      <a href="user.statusnet_profile_url"><div class="user-screen-name">@{{ user.screen_name }}</div></a>
-    </div>
-    <span class="follows-you" v-if="!userExpanded && showFollows">
-      <div class="follows" v-if="user.follows_you">
-        Follows you!
+      <div class="user-name">
+        {{ user.name }}
+        <span class="follows-you" v-if="!userExpanded && showFollows && user.follows_you">
+            Follows you!
+        </span>
       </div>
-    </span>
+      <a :href="user.statusnet_profile_url" target="blank"><div class="user-screen-name">@{{ user.screen_name }}</div></a>
+    </div>
   </div>
 </template>
 
@@ -23,21 +23,19 @@
 <style lang="scss">
   .name-and-screen-name {
     margin-left: 0.7em;
-    min-width: 16em;
-    display:block;
     margin-top:0.0em;
     margin-right: 2em;
     text-align: left;
+    width: 100%;
   }
 
   .follows-you {
     margin-left: 2em;
-    width:-webkit-fill-available;
-    width: -moz-webkit-fill-available;
+    float: right;
   }
 
   .follows {
-    float: right;
+
   }
 
   .card {
@@ -50,6 +48,14 @@
     border-bottom: 1px solid;
     margin: 0;
     border-bottom-color: inherit;
+
+
+    .avatar {
+      margin-top: 0.2em;
+      width:32px;
+      height: 32px;
+      border-radius: 50%;
+    }
   }
 
   .usercard {
-- 
cgit v1.2.3-70-g09d2

