Rename .buddy1 to .display-name and .buddy2 to .browser.

src/styles/components/_buddylist.scss

@@ -126,13 +126,13 @@
 }
 
 .buddy {
-  &.withSubline > .buddy1 {
+  &.withSubline > .display-name {
     top: 15px;
   }
   &.hovered .buddyactions {
     right: 0;
   }
-  > .buddyimage {
+  .buddyimage {
     background: $actioncolor1;
     border-radius: 2px;
     float: left;
@@ -142,11 +142,11 @@
     position: relative;
     text-align: center;
     width: 46px;
-    > i {
+    i {
       color: $actioncolor2;
       line-height: 46px;
     }
-    > img {
+    img {
       bottom: 0;
       display: block;
       left: 0;
@@ -155,7 +155,7 @@
       top: 0;
     }
   }
-  > .buddy1 {
+  .display-name {
     color: $componentfg1;
     font-weight: bold;
     font-size: 14px;
@@ -168,7 +168,7 @@
     top: 24px;
     white-space: nowrap;
   }
-  > .buddy2 {
+  .browser {
     color: $componentfg2;
     left: 65px;
     overflow: hidden;

static/partials/buddy.html

@@ -1,5 +1,5 @@
 <div class="buddy withSubline" ng-click="doDefault(user.Id)">
     <div class="buddyimage"><i class="fa fa-user fa-3x"/><img ng-show="status.buddyPicture" alt ng-src="{{status.buddyPicture}}" width="46" height="46"/></div>
-    <div class="buddy1">{{user.Id|displayName}}</div>
+    <div class="display-name">{{user.Id|displayName}}</div>
-    <div class="buddy2">{{user.Ua}}</div>
+    <div class="browser">{{user.Ua}}</div>
 </div>