Fix responsive collapse of nav bars at 450px.

web/assets/stylesheets/application.css

@@ -41,11 +41,6 @@ h1, h2, h3, h4, h5, h6, strong {
   color: #b1003e;
 }
 
-.navbar .brand {
-  color: #b1003e;
-  text-shadow: none;
-}
-
 pre {
   font-size: 11px;
 }
@@ -95,14 +90,6 @@ header.row .pagination {
   margin: 12px 0;
 }
 
-.navbar .status {
-  position: relative;
-}
-.navbar .status i {
-  position: absolute;
-  left: -28px;
-}
-
 .summary_bar .status {
   margin-left: 10px;
 }
@@ -167,6 +154,22 @@ td form {
   margin-bottom: 0;
 }
 
+.navbar .brand {
+  color: #b1003e;
+  text-shadow: none;
+}
+
+@media (max-width: 450px) {
+  .navbar ul.nav li a {
+    padding-left: 8px;
+    padding-right: 8px;
+  }
+
+  .navbar-fixed-bottom li p {
+    font-size: 0.85em;
+  }
+}
+
 @media (max-width: 979px) {
   .navbar-fixed-top, .navbar-fixed-bottom {
     margin: 0 -20px;

web/views/_nav.slim

@@ -1,17 +1,12 @@
 .navbar-inner
   .container
-    a.btn.btn-navbar data-toggle="collapse" data-target=".nav-collapse"
-      span.icon-bar
-      span.icon-bar
-      span.icon-bar
     a.brand href='#{{root_path}}'
       = Sidekiq::NAME
-    div.nav-collapse
-      ul.nav
-        - tabs.each do |title, url|
-          - if url == ''
-            li class="#{(current_path == url) ? 'active':''}"
-              a href='#{{root_path}}#{{url}}' #{title}
-          - else
-            li class="#{(current_path =~ Regexp.new(url)) ? 'active':''}"
-              a href='#{{root_path}}#{{url}}' #{title}
+    ul.nav
+      - tabs.each do |title, url|
+        - if url == ''
+          li class="#{(current_path == url) ? 'active':''}"
+            a href='#{{root_path}}#{{url}}' #{title}
+        - else
+          li class="#{(current_path =~ Regexp.new(url)) ? 'active':''}"
+            a href='#{{root_path}}#{{url}}' #{title}