Alternate size for artists

public/templates/artists/list.html

@@ -1,3 +1,3 @@
 <div class="stretch-to-bottom">
-    <pfm-users-list users="artists"></pfm-users-list>
+    <pfm-users-list users="artists" size="large"></pfm-users-list>
 </div>

public/templates/directives/users-list.html

@@ -1,9 +1,9 @@
-<div layout="row" layout-xs="column" layout-wrap>
+<div layout="row" layout-wrap>
     <p ng-show="!users.length" class="empty">
         No users found&hellip;
     </p>
 
-    <a ng-repeat="user in users track by user.id" ng-href="{{::user.url}}" class="clickable" flex-gt-xs="50" flex-gt-sm="25" flex-gt-md="20">
+    <a ng-repeat="user in users track by user.id" ng-href="{{::user.url}}" class="clickable" flex-xs="{{xsSize}}" flex-sm="50" flex-gt-sm="{{smSize}}" flex-gt-md="{{mdSize}}" flex-gt-lg="{{lgSize}}">
         <md-card class="user">
             <img class="md-card-image" pfm-src-loader="::user.avatars.normal" pfm-src-size="normal">
 

resources/assets/scripts/app/directives/users-list.coffee

@@ -20,10 +20,25 @@ module.exports = angular.module('ponyfm').directive 'pfmUsersList', () ->
     templateUrl: '/templates/directives/users-list.html'
     scope:
         users: '=users',
-        class: '@class'
+        class: '@class',
+        size: '@size'
 
     controller: [
         '$scope', 'auth'
         ($scope, auth) ->
+            if typeof $scope.size == 'undefined'
+                $scope.size = 'large'
+
+            if $scope.size == 'small'
+                $scope.lgSize = '20'
+                $scope.mdSize = '33'
+                $scope.smSize = '50'
+                $scope.xsSize = '100'
+            else
+                $scope.lgSize = '15'
+                $scope.mdSize = ''
+                $scope.smSize = '20'
+                $scope.xsSize = '50'
+
             $scope.auth = auth.data
     ]