Better mobile styles and spacing for user list and fix mobile Back button

Closes #69

ghost/admin/assets/sass/layouts/modals.scss

@@ -30,6 +30,11 @@
             margin-top: 1px;
             width: 100%;
         }
+
+        .gh-select {
+            padding-right: 1px;
+        }
+
     } // .form-group
     .button-add {
         width: 100%;

ghost/admin/assets/sass/layouts/settings.scss

@@ -275,7 +275,8 @@
                 top: 5px;
                 left: 14px;
                 min-height: 0;
-                height: 30px;
+                padding-top: 8px;
+                padding-bottom: 8px;
                 display: block;
 
                 &:before {
@@ -341,11 +342,11 @@
             @media (max-width: 650px) {
                 height: 30px;
                 min-height: 30px;
-                padding: 7px 10px 7px 40px;
+                padding: 6px 10px 8px 40px;
                 &:before {
                     padding-top: 7px;
-                    left: 6px;
-                    width: 24px;
+                    left: 8px;
+                    width: 22px;
                 }
             }
         }
@@ -366,8 +367,7 @@
         &:before {
             display: block;
             content: "";
-            height: 77px; //30px + 17px title + 30px
-            @media (max-height: 600px) { display: none; }
+            height: 87px;
         }
 
         &.no-padding {
@@ -376,6 +376,7 @@
 
         @media (max-width: 1000px) {
             padding-left: 15px;
+            padding-right: 15px;
         }
         @media (max-width: 550px) {
             padding: 0 15px 40px;

ghost/admin/assets/sass/modules/objectlist.scss

@@ -11,7 +11,7 @@
    Object List
    ========================================================================== */
 
-.object-list + .object-list {
+.object-list:not(:first-of-type) {
     margin-top: 34px;
 }
 
@@ -24,12 +24,18 @@
 
 .object-list-item {
 
-    @include display(flex);
-    @include justify-content(start);
-    @include align-items(center);
+    @media (max-width: 500px) {
+        display: block;
+        padding: 15px 0;
+        @include clearfix;
+    }
 
-    padding-left: 15px;
-    padding-right: 15px;
+    @media (min-width: 501px) {
+        @include display(flex);
+        @include justify-content(start);
+        @include align-items(center);
+        padding: 0 15px;
+    }
 
     border-top: 1px solid $lightbrown;
     min-height: 68px;
@@ -75,6 +81,14 @@ a.object-list-item {
     border: 1px solid #979797;
 } // .object-list-item-figure
 
+.object-list-item-icon,
+.object-list-item-figure {
+    @media (max-width: 500px) {
+        float: left;
+        margin-right: 15px;
+    }
+}
+
 .object-list-item-body {
 
     @include flex(1);
@@ -83,6 +97,10 @@ a.object-list-item {
     padding-left: 15px;
     line-height: 1;
 
+    @media (max-width: 500px) {
+        margin-top: 3px;
+    }
+
     .name {
         display: inline-block;
         font-size: 15px;
@@ -99,8 +117,16 @@ a.object-list-item {
 } // .object-list-item-body
 
 .object-list-item-aside {
-    .object-list-action + .object-list-action {
+    @media (max-width: 500px) {
+        float: left;
+        width: 100%;
+        margin-top: 15px;
+    }
+    .object-list-action:not(:first-of-type) {
         margin-left: 20px;
+        @media (min-width: 501px) {
+            margin-left: 50px;
+        }
     }
     .role-label {
         float: left;