Fix info page.

src/_h5ai/client/css/inc/filter.less

@@ -5,10 +5,11 @@
     input {
         border: none;
         font-family: @font-family;
+        font-weight: lighter;
         color: @col;
-        background-color: rgba(0,0,0,0);
+        background: transparent;
         width: 30px;
-        outline: none;
+        outline: 0;
     }
 
     &.current {

src/_h5ai/client/css/inc/h5ai-info.less

@@ -1,20 +1,15 @@
 
 body#h5ai-info {
-    margin: 2em auto 4em auto;
-    // font-size: 20px;
+
+    #content {
+        flex: 1 1 auto;
+        order: 50;
         color: @col;
-    max-width: 600px;
         text-align: center;
-
-    a, a:active, a:visited {
-        color: @col;
-        text-decoration: none;
-        .transition(all 0.2s ease-in-out);
-
-        &:hover {
-            color: @col-hover;
-        }
+        background: #fff;
+        overflow-y: scroll;
     }
+
     code {
         margin: 0 0.2em;
         padding: 2px 4px;
@@ -23,21 +18,33 @@ body#h5ai-info {
         letter-spacing: 0.1em;
         background-color: @col-widget-back;
         border: @border-widget;
+        font-size: 0.8em;
     }
+
     h1 {
         font-size: 3.6em;
-        margin: 0;
+        margin: 0.8em 0 0 0;
     }
+
     h2 {
         font-size: 1.15em;
         margin: 2.6em 0 0 0;
     }
 
+    #header a {
+        color: @col;
+        text-decoration: none;
+        .transition(all 0.2s ease-in-out);
+
+        &:hover {
+            color: @col-hover;
+        }
+    }
 
     #support {
         margin: 12px auto 24px auto;
         padding: 6px 18px;
-        width: 164px;
+        width: 180px;
         background: @col-widget-back;
         border: @border-widget;
         border-radius: 4px;
@@ -47,11 +54,6 @@ body#h5ai-info {
         }
     }
 
-
-    #login-wrapper {
-        font-size: 14px;
-    }
-
     #pass {
         -moz-appearance: none;
         -ms-appearance: none;
@@ -82,34 +84,29 @@ body#h5ai-info {
         text-decoration: none;
         .transition(all 0.2s ease-in-out);
 
-        &:hover, &.hover {
-            background-color: @col-widget-back-highlight;
+        &:hover {
             color: @col-hover;
         }
     }
 
     #hint {
         margin: 12px auto;
-        width: 360px;
+        width: 380px;
         color: @col;
     }
 
-
-    #tests-wrapper {
-        margin: 96px 0;
-    }
-
     #tests {
         display: inline-block;
-        list-style-type: none;
         text-align: left;
-        margin: 0;
+        list-style-type: none;
+        margin: 96px 0;
         padding: 0;
+        font-size: 1.4em;
 
         .test {
             margin: 12px 0 0 0;
             padding: 6px;
-
+        }
         .label {
             display: inline-block;
             width: 250px;
@@ -130,15 +127,10 @@ body#h5ai-info {
         .info {
             margin: 4px 0 12px 12px;
             font-size: 0.7em;
+            font-weight: lighter;
             color: #aaa;
             width: 460px;
             line-height: 1.2em;
         }
     }
 }
-
-
-    #bottombar {
-
-    }
-}

src/_h5ai/client/css/inc/topbar.less

@@ -25,7 +25,7 @@
 
 .topbar-right {
     float: right;
-    border-left: @border-widget-sep;
+    // border-left: @border-widget-sep;
 }
 
 
@@ -57,6 +57,8 @@
     .current {
         font-weight: bold;
     }
+    .element {
+    }
     img {
         position: relative;
         top: -1px;

src/_h5ai/client/js/inc/ext/thumbnails.js

@@ -1,4 +1,4 @@
-modulejs.define('ext/thumbnails', ['_', 'core/settings', 'core/event', 'core/server'], function (_, allsettings, event, server) {
+modulejs.define('ext/thumbnails', ['_', 'core/settings', 'core/event', 'core/server', 'core/resource'], function (_, allsettings, event, server, resource) {
 
     var settings = _.extend({
             enabled: false,

src/_h5ai/client/js/inc/info.js

@@ -1,9 +1,7 @@
 modulejs.define('info', ['$', 'config'], function ($, config) {
 
     var testsTemp =
-            '<div id="tests-wrapper">' +
-                '<ul id="tests">' +
-            '</div>';
+            '<ul id="tests">';
     var testTemp =
             '<li class="test">' +
                 '<span class="label"></span>' +
@@ -41,7 +39,7 @@ modulejs.define('info', ['$', 'config'], function ($, config) {
 
     function addTests() {
 
-        $(testsTemp).appendTo('body');
+        $(testsTemp).appendTo('#content');
 
         addTest(
             'Index file found', 'Add <code>' + setup.INDEX_HREF + '</code> to your index file list',
@@ -147,7 +145,7 @@ modulejs.define('info', ['$', 'config'], function ($, config) {
 
     function addLogin() {
 
-        $(loginTemp).appendTo('body');
+        $(loginTemp).appendTo('#content');
 
         if (setup.AS_ADMIN) {
             $('#pass').remove();

src/_h5ai/index.html.jade

@@ -14,8 +14,8 @@ head
 
 body#h5ai-info
 
-    div#main-row
-        h1
+    div#content
+        h1#header
             a( href="#{pkg.homepage}" ) #{pkg.name}
 
         div#support