From c3762bb7ad1d503893b7ff8d660edc83da5fcffc Mon Sep 17 00:00:00 2001
From: Josef Citrine <josefcitrine@googlemail.com>
Date: Tue, 12 Jul 2016 00:26:13 +0100
Subject: [PATCH] Sizing updates

---
 public/templates/directives/player.html         |  2 +-
 public/templates/directives/playlists-list.html |  2 +-
 resources/assets/styles/content.less            | 13 ++++++++++---
 resources/assets/styles/mobile.less             | 12 ++++++------
 4 files changed, 18 insertions(+), 11 deletions(-)

diff --git a/public/templates/directives/player.html b/public/templates/directives/player.html
index ee3ab036..057ac42f 100644
--- a/public/templates/directives/player.html
+++ b/public/templates/directives/player.html
@@ -25,7 +25,7 @@
     <div class="image">
         <div class="loader" ng-class="{showing: player.currentTrack.loadingProgress == 0}"><i class="fa fa-spin fa-rotate-right"></i></div>
         <a colorbox ng-href="{{player.currentTrack.covers.original}}" pfm-eat-click>
-            <img pfm-src-loader="player.currentTrack.covers.thumbnail" pfm-src-size="thumbnail" />
+            <img pfm-src-loader="player.currentTrack.covers.small" pfm-src-size="small" />
         </a>
     </div>
     <div class="inner">
diff --git a/public/templates/directives/playlists-list.html b/public/templates/directives/playlists-list.html
index 39574345..a0d90f73 100644
--- a/public/templates/directives/playlists-list.html
+++ b/public/templates/directives/playlists-list.html
@@ -1,7 +1,7 @@
 <ul class="playlists-listing {{::class}}">
     <li ng-repeat="playlist in playlists track by playlist.id">
         <a ng-href="{{::playlist.url}}">
-            <img class="image" pfm-src-loader="::playlist.covers.small" pfm-src-size="small" />
+            <img class="image" pfm-src-loader="::playlist.covers.normal" pfm-src-size="normal" />
             <span class="info">
                 <span class="title">{{::playlist.title}}</span>
                 <span class="published">
diff --git a/resources/assets/styles/content.less b/resources/assets/styles/content.less
index 903c2497..9736983e 100644
--- a/resources/assets/styles/content.less
+++ b/resources/assets/styles/content.less
@@ -29,7 +29,7 @@
       }
 
       li {
-        width: 33.33333%;
+        width: 30%;
       }
     }
   }
@@ -44,8 +44,7 @@
       }
 
       li {
-        width: auto;
-        float: none;
+        width: 44%;
       }
     }
   }
@@ -133,6 +132,10 @@
         background: #ddd;
       }
     }
+
+    &.empty {
+      box-shadow: 0 0 0 transparent;
+    }
   }
 }
 
@@ -187,6 +190,10 @@
     &.x-archived {
       background: #eee;
     }
+
+    .albums-listing li {
+      width: 22%;
+    }
   }
 
   .share-buttons {
diff --git a/resources/assets/styles/mobile.less b/resources/assets/styles/mobile.less
index 53574375..e55383de 100644
--- a/resources/assets/styles/mobile.less
+++ b/resources/assets/styles/mobile.less
@@ -293,9 +293,10 @@
 
   .notification-pullout {
     left: 0;
+    top: 108px;
     width: 100%;
-    height: ~"calc(100% - 128px)";
-    transform: translateY(-105%) translateZ(0);
+    height: ~"calc(100% - 172px)";
+    transform: translateY(-120%) translateZ(0);
 
     &.active {
       transform: translateY(0) translateZ(0);
@@ -387,10 +388,6 @@
   .secondary-content {
     margin-top: 5px;
   }
-
-  .albums-listing {
-    width: 50% !important;
-  }
 }
 
 // Super small phones like the iPhone 5
@@ -435,6 +432,9 @@
     width: 100% !important;
 
     li {
+      width: 97% !important;
+      margin: 5px;
+
       a img {
         width: 60px;
         float: left;