Use same html syntax for buddyPicture.

src/styles/components/_contactsmanager.scss

@@ -45,22 +45,6 @@
   .uploadbtn {
     margin-top: 7px;
   }
-  .buddyPicture {
-    position: relative;
-    width: 46px;
-    height: 46px;
-    background: $actioncolor1;
-    border-radius: 2px;
-    margin: 0 auto;
-    &:after {
-        content: "\f007";
-        color: $actioncolor2;
-        font-family: fontAwesome;
-        font-size: 3em;
-        position: relative;
-        top: -6px;
-    }
-  }
   .editlist {
     max-height: 250px;
     overflow-y: auto;
@@ -71,10 +55,8 @@
       border-top: none;
     }
     .picture {
-      width: 15%;
+      border-bottom: 0;
       min-height: 46px;
-      text-align: center;
-      vertical-align: middle;
     }
     .name {
       width: 70%;

static/partials/contactsmanager.html

@@ -10,9 +10,10 @@
         <table class="table table-hover table-condensed">
           <tbody>
             <tr ng-repeat="contact in contacts">
-              <td class="picture">
+              <td class="picture buddy">
-                <img ng-show="contact.Status.buddyPicture" ng-src="{{contact.Status.buddyPicture}}">
+                <div class="buddyPicture"><i class="fa fa-user"/><img ng-show="contact.Status.buddyPicture" alt ng-src="{{contact.Status.buddyPicture}}"/></div>
-                <div ng-show="!contact.Status.buddyPicture" class="buddyPicture"></div>
+                <!-- <img ng-show="contact.Status.buddyPicture" ng-src="{{contact.Status.buddyPicture}}"> -->
+                <!-- <div ng-show="!contact.Status.buddyPicture" class="buddyPicture"></div> -->
               </td>
               <td class="name">
                 <span>{{contact.Status.displayName}}</span>