Clean fallback mode.

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

@@ -60,20 +60,16 @@
 }
 
 
-#fallback-bar {
+#fallback-hints {
     display: none;
     overflow: hidden;
-
-    padding: 6px;
-    background: @col-lightgray;
     box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);
-
-    color: #999;
     text-align: right;
-    line-height: 36px;
+    background: @col-lightgray;
 
     a, a:active, a:visited {
-        margin: 0 8px;
+        display: inline-block;
+        line-height: 48px;
         color: @col-text-secondary-black;
         text-decoration: none;
         .transition(all 0.2s ease-in-out);
@@ -84,16 +80,13 @@
         }
     }
 
+    .backlink {
+        margin: 0 16px;
+    }
+
     .noJsMsg, .noBrowserMsg {
-        margin: 0 8px;
+        margin: 0 16px;
         color: @col-error;
-        a, a:active, a:visited {
-            color: @col-error;
-            text-decoration: underline;
-            &:hover {
-                color: @col-hover;
-            }
-        }
     }
 }
 
@@ -105,7 +98,7 @@ html.no-js, html.no-browser {
         background: #fff;
     }
 
-    #fallback, #fallback-bar {
+    #fallback, #fallback-hints {
         display: block;
     }
 }

src/_h5ai/client/js/inc/view/ensure.js

@@ -20,6 +20,7 @@ modulejs.define('view/ensure', ['$', 'config', 'core/event'], function ($, confi
 
     function init() {
 
+        $('#fallback, #fallback-hints').remove();
         $(templateTopbar).appendTo('body');
         $(templateMainRow).appendTo('body');
         $(templateBacklink).appendTo('#topbar');

src/_h5ai/index.html.jade

@@ -14,15 +14,15 @@ head
 
 body#h5ai-info
 
-    div#fallback-bar
+    div#fallback-hints
         span.noJsMsg
             | JavaScript disabled!
         span.noBrowserMsg
             | Works best in 
             a( href="http://browsehappy.com" ) modern browsers
             | !
-        a( href="#{pkg.homepage}", title="#{pkg.name} #{pkg.version} · #{pkg.description}" )
-            | powered by #{pkg.name}
+        span.backlink
+            a( href="#{pkg.homepage}", title="#{pkg.name} #{pkg.version} · #{pkg.description}" ) powered by #{pkg.name}
 
     div#content
         h1#header

src/_h5ai/server/php/inc/page.php.jade

@@ -19,15 +19,15 @@ head
 
 body
 
-    div#fallback-bar
+    div#fallback-hints
         span.noJsMsg
             | JavaScript disabled!
         span.noBrowserMsg
             | Works best in 
             a( href="http://browsehappy.com" ) modern browsers
             | !
-        a( href="#{pkg.homepage}", title="#{pkg.name} #{pkg.version} · #{pkg.description}" )
-            | powered by #{pkg.name}
+        span.backlink
+            a( href="#{pkg.homepage}", title="#{pkg.name} #{pkg.version} · #{pkg.description}" ) powered by #{pkg.name}
 
     div#fallback !{fallback}