From aa4b1a8acd1ccb645e68143c1b32e29c797d1830 Mon Sep 17 00:00:00 2001
From: Lars Jung <lrsjng@gmail.com>
Date: Fri, 5 Dec 2014 21:44:13 +0100
Subject: [PATCH] Clean styles.

---
 src/_h5ai/client/css/inc/bottombar.less    |  9 +++-----
 src/_h5ai/client/css/inc/view-details.less |  4 ++--
 src/_h5ai/client/css/inc/view-grid.less    |  7 +++---
 src/_h5ai/client/css/inc/view-icons.less   |  7 +++---
 src/_h5ai/client/css/inc/view.less         | 25 +++++-----------------
 src/_h5ai/client/js/inc/ext/thumbnails.js  |  4 ++--
 src/_h5ai/client/js/inc/view/items.js      |  2 +-
 7 files changed, 21 insertions(+), 37 deletions(-)

diff --git a/src/_h5ai/client/css/inc/bottombar.less b/src/_h5ai/client/css/inc/bottombar.less
index 11c23727..9c61fb25 100644
--- a/src/_h5ai/client/css/inc/bottombar.less
+++ b/src/_h5ai/client/css/inc/bottombar.less
@@ -4,9 +4,8 @@
     flex: 0 0 auto;
     order: 99;
 
-    height: 18px;
     padding: 6px;
-    // background: #fafafa;
+    background: #fafafa;
     background: #eee;
     box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);
     z-index: 1;
@@ -14,11 +13,8 @@
     color: #999;
     text-align: right;
 
-    > * {
-        margin: 0 8px;
-    }
-
     a, a:active, a:visited {
+        margin: 0 8px;
         color: #999;
         text-decoration: none;
         .transition(all 0.2s ease-in-out);
@@ -30,6 +26,7 @@
     }
 
     .noJsMsg, .noBrowserMsg {
+        margin: 0 8px;
         color: @col-error;
         a, a:active, a:visited {
             color: @col-error;
diff --git a/src/_h5ai/client/css/inc/view-details.less b/src/_h5ai/client/css/inc/view-details.less
index e38c7d73..68248f0a 100644
--- a/src/_h5ai/client/css/inc/view-details.less
+++ b/src/_h5ai/client/css/inc/view-details.less
@@ -7,7 +7,7 @@
         }
     }
 
-    .icon.square {
+    .square {
         width: @size;
 
         img {
@@ -66,7 +66,7 @@
         }
     }
 
-    .icon.square {
+    .square {
         display: inline-block;
         position: absolute;
         left: 16px;
diff --git a/src/_h5ai/client/css/inc/view-grid.less b/src/_h5ai/client/css/inc/view-grid.less
index 656bbd31..e48572f7 100644
--- a/src/_h5ai/client/css/inc/view-grid.less
+++ b/src/_h5ai/client/css/inc/view-grid.less
@@ -2,10 +2,10 @@
 .view-grid-sized(@size) {
 
     .label {
-        padding: (@size/2 - 9px) 8px;
+        line-height: @size;
     }
 
-    .icon.square {
+    .square {
         width: @size;
 
         img {
@@ -30,7 +30,7 @@
         }
     }
 
-    .icon.square {
+    .square {
         display: inline-block;
         vertical-align: top;
         background: #fafafa;
@@ -40,6 +40,7 @@
         display: inline-block;
         vertical-align: top;
         width: 180px;
+        padding: 0 8px;
     }
 
     .date, .size {
diff --git a/src/_h5ai/client/css/inc/view-icons.less b/src/_h5ai/client/css/inc/view-icons.less
index af26a033..f6b6913b 100644
--- a/src/_h5ai/client/css/inc/view-icons.less
+++ b/src/_h5ai/client/css/inc/view-icons.less
@@ -5,7 +5,7 @@
         width: @size * 4/3;
     }
 
-    .icon.rational {
+    .landscape {
 
         img {
             width: @size;
@@ -33,13 +33,14 @@
         }
     }
 
-    .icon.rational {
+    .landscape {
         display: block;
         background: #fafafa;
     }
 
     .label {
-        padding: 4px 6px;
+        padding: 0 6px;
+        line-height: 24px;
     }
 
     .date, .size {
diff --git a/src/_h5ai/client/css/inc/view.less b/src/_h5ai/client/css/inc/view.less
index 39007781..8a754ea3 100644
--- a/src/_h5ai/client/css/inc/view.less
+++ b/src/_h5ai/client/css/inc/view.less
@@ -1,5 +1,4 @@
 
-
 @item-col-hover: @col-hover;
 @item-background-col-hover: #fafafa;
 @item-border-col-hover: @col-border;
@@ -67,10 +66,7 @@
 
             .selector {
                 display: block;
-
-                img {
-                    opacity: 1;
-                }
+                opacity: 1;
             }
         }
     }
@@ -88,19 +84,12 @@
 
         img {
             vertical-align: top;
-            // max-width: 64px;
             max-width: 32px;
         }
 
         .thumb {
             max-width: none;
         }
-
-        &.rational {
-            img {
-                min-width: 32px;
-            }
-        }
     }
 
     .label {
@@ -123,26 +112,22 @@
     .selector {
         display: none;
         position: absolute;
-        // left: 0;
-        // top: 0;
-        // width: 18px;
-        // height: 18px;
-        left: 4px;
+        left: -4px;
         top: 4px;
         width: 24px;
         height: 24px;
         background-color: #fff;
         cursor: pointer;
-        .transition(all 0.2s ease-in-out);
         box-shadow: 0 0 3px 0 rgba(0,0,0,0.3);
-        border-radius: 40px;
+        border-radius: 0 20px 20px 0;
+        opacity: 0.6;
 
         &:hover {
+            opacity: 0.8;
             box-shadow: 0 0 16px 0 rgba(0,0,0,0.3);
         }
 
         img {
-            opacity: 0.2;
             width: 100%;
             height: 100%;
         }
diff --git a/src/_h5ai/client/js/inc/ext/thumbnails.js b/src/_h5ai/client/js/inc/ext/thumbnails.js
index 39c1b7d6..ed0bd584 100644
--- a/src/_h5ai/client/js/inc/ext/thumbnails.js
+++ b/src/_h5ai/client/js/inc/ext/thumbnails.js
@@ -50,13 +50,13 @@ modulejs.define('ext/thumbnails', ['_', 'core/settings', 'core/event', 'core/ser
                 });
             }
             if (item.thumbRational) {
-                item.$view.find('.icon.rational img').addClass('thumb').attr('src', item.thumbRational);
+                item.$view.find('.icon.landscape img').addClass('thumb').attr('src', item.thumbRational);
             } else {
                 requestThumb(type, item.absHref, 4/3, function (src) {
 
                     if (src && item.$view) {
                         item.thumbRational = src;
-                        item.$view.find('.icon.rational img').addClass('thumb').attr('src', src);
+                        item.$view.find('.icon.landscape img').addClass('thumb').attr('src', src);
                     }
                 });
             }
diff --git a/src/_h5ai/client/js/inc/view/items.js b/src/_h5ai/client/js/inc/view/items.js
index f833e6fb..771154fb 100644
--- a/src/_h5ai/client/js/inc/view/items.js
+++ b/src/_h5ai/client/js/inc/view/items.js
@@ -10,7 +10,7 @@ modulejs.define('view/items', ['_', '$', 'core/settings', 'core/resource', 'core
             '<li class="item">' +
                 '<a>' +
                     '<span class="icon square"><img/></span>' +
-                    '<span class="icon rational"><img/></span>' +
+                    '<span class="icon landscape"><img/></span>' +
                     '<span class="label"/>' +
                     '<span class="date"/>' +
                     '<span class="size"/>' +