From ebc70eb330b422544dc4750ffb90512232c385e0 Mon Sep 17 00:00:00 2001
From: xaviju <xaviju@gmail.com>
Date: Fri, 20 Jan 2017 12:16:11 +0100
Subject: [PATCH] Fix membership table avatars

---
 .../admin/memberships-row-avatar.jade         | 15 +++++---
 .../modules/admin/admin-membership-table.jade |  4 +-
 .../modules/admin/admin-membership-table.scss | 37 +++++++------------
 3 files changed, 25 insertions(+), 31 deletions(-)

diff --git a/app/partials/admin/memberships-row-avatar.jade b/app/partials/admin/memberships-row-avatar.jade
index 89411cb6..53c66556 100644
--- a/app/partials/admin/memberships-row-avatar.jade
+++ b/app/partials/admin/memberships-row-avatar.jade
@@ -1,10 +1,11 @@
-figure.avatar
+.avatar
     img(
+        src!="<%- imgurl %>"
+        alt!="<%- full_name %>"
         style!="background-color: <%- bg %>"
-        src!="<%- imgurl %>", alt!="<%- full_name %>"
     )
-    figcaption
-        div.name
+    .user-data
+        .name
             span(ng-non-bindable) <%- full_name %>
             <% if (isOwner) { %>
             tg-svg.owner-badge(
@@ -12,6 +13,8 @@ figure.avatar
                 svg-title-translate="COMMON.OWNER"
             )
             <% }  %>
-        div
-            span.pending <%- pending %>
+        .data
             span.email <%- email %>
+            <% if (pending) { %>
+            span.pending <%- pending %>
+            <% }  %>
diff --git a/app/partials/includes/modules/admin/admin-membership-table.jade b/app/partials/includes/modules/admin/admin-membership-table.jade
index 8ddb19f5..c88d8abc 100644
--- a/app/partials/includes/modules/admin/admin-membership-table.jade
+++ b/app/partials/includes/modules/admin/admin-membership-table.jade
@@ -1,11 +1,11 @@
 section.admin-membership-table.basic-table
-    div.row.title
+    .row.title
         div.header-member(translate="ADMIN.MEMBERSHIP.COLUMN_MEMBER")
         div.header-admin(translate="ADMIN.MEMBERSHIP.COLUMN_ADMIN")
         div.header-role(translate="ADMIN.MEMBERSHIP.COLUMN_ROLE")
         div.header-status(translate="ADMIN.MEMBERSHIP.COLUMN_STATUS")
 
-    div.row(ng-repeat="member in memberships")
+    .row(ng-repeat="member in memberships")
         div.row-member(tg-memberships-row-avatar="member")
         div.row-admin(tg-memberships-row-admin-checkbox="member")
         div.row-role(tg-memberships-row-role-selector="member")
diff --git a/app/styles/modules/admin/admin-membership-table.scss b/app/styles/modules/admin/admin-membership-table.scss
index 0312b8f1..126f3a23 100644
--- a/app/styles/modules/admin/admin-membership-table.scss
+++ b/app/styles/modules/admin/admin-membership-table.scss
@@ -5,32 +5,23 @@
     .avatar {
         align-items: center;
         display: flex;
-        justify-content: flex-start;
-        figcaption {
-            margin-left: 1rem;
-            width: 75%;
-            span {
-                overflow: hidden;
-                text-overflow: ellipsis;
-                white-space: nowrap;
-                width: 100%;
-            }
-        }
         img {
-            flex-basis: 35px;
-            flex-grow: 1;
-            max-width: 35px;
+            border-radius: 4px;
+            flex-grow: 0;
+            margin: 0 .5rem 0 .3rem;
+            width: 50px;
         }
-        .name,
-        .email {
-            display: block;
-            width: 100%;
+        .data {
+            @include font-type(light);
+            @include font-size(small);
+            color: $gray;
+            margin-top: .2rem;
         }
-        .name {
-            @include font-type(bold);
-        }
-        .email {
-            color: $gray-light;
+        .pending {
+            @include font-type(normal);
+            color: $red-light;
+            display: inline-block;
+            padding-left: .3rem;
         }
     }
     .header-role,