Bootstrap upgrade

web/assets/javascripts/dashboard.js

@@ -6,7 +6,9 @@ n){return arguments.length?(t=+n,e):t},e.translate=function(t){return arguments.
 
 // Match width of graphs with summary bar
 var responsiveWidth = function() {
-  return document.getElementsByClassName('summary_bar')[0].clientWidth;
+  //Bootstrap now uses padding instead of margin for gutters. 30px (15 on each side)
+  //http://getbootstrap.com/css/#grid
+  return document.getElementsByClassName('summary_bar')[0].clientWidth - 30;
 };
 
 // Richshaw

web/assets/stylesheets/application.css

@@ -32,7 +32,7 @@ h1, h2, h3, h4, h5, h6, strong {
   font-weight: 700;
 }
 
-.brand, .navbar .brand, h5, h4, h3, h2, h1 {
+.navbar-brand, .navbar .navbar-brand, h5, h4, h3, h2, h1 {
   font-family: Armata;
   font-weight: 400;
 }
@@ -113,8 +113,13 @@ header.row .pagination {
   margin-bottom: 10px;
   border-width: 0px;
 }
+.poll-wrapper {
+  padding: 9px 0 0 0;
+}
 .nav #live-poll {
+  height: 25px;
   line-height: 25px;
+  width: 195px;
 }
 #live-poll.active {
   background-color: #009300;
@@ -144,21 +149,21 @@ header.row .pagination {
   }
 }
 @media (max-width: 979px) and (min-width: 768px) {
-  .summary_bar ul li.span2 {
+  .summary_bar ul li.col-sm-2 {
     margin: 0px 10px;
     width: 96px !important;
   }
 }
-@media (max-width: 1199px) and (min-width: 980px) {
+/*@media (max-width: 1199px) and (min-width: 980px) {
-  .summary_bar ul li.span2 {
+  .summary_bar ul li.col-sm-2 {
     width: 130px !important;
   }
 }
 @media (min-width: 1200px) {
-  .summary_bar ul li.span2 {
+  .summary_bar ul li.col-sm-2 {
     width: 154px !important;
   }
-}
+}*/
 .summary_bar ul .desc {
   display: block;
   font-size: 1em;
@@ -191,12 +196,13 @@ td form {
   margin-bottom: 0;
 }
 
-.navbar .brand {
+.navbar .navbar-brand {
   color: #b1003e;
+  padding: 13px;
   text-shadow: none;
 }
 
-.navbar .brand .status {
+.navbar .navbar-brand .status {
   color: #585454;
 }
 
@@ -210,7 +216,7 @@ td form {
   padding: 15px;
 }
 
-.navbar-footer .navbar ul.nav a.brand {
+.navbar-footer .navbar ul.nav a.navbar-brand {
   font-weight: 400;
   padding: 0 15px 0 0;
 }
@@ -323,8 +329,11 @@ img.smallogo {
   font-size: 0.9em;
 }
 @media (max-width: 767px) {
+  .stats-container {
+    display: block;
+  }
   .stat {
-    float: none;
+    float: left;
     margin-right: 10px;
     width: 100%;
     text-align: left;
@@ -516,13 +525,14 @@ img.smallogo {
   text-decoration: none;
 }
 
-@media (max-width: 550px) {
+@media (max-width: 768px) {
   .navbar .container {
     text-align: center
   }
 
-  .navbar .brand {
+  .navbar .navbar-brand {
     float: none;
+    display: block;
   }
 
   .navbar ul.nav li a {
@@ -540,6 +550,11 @@ img.smallogo {
     margin-right: 0;
   }
 
+  .poll-wrapper {
+    padding: 0px 20px 5px 0px;
+    width: 20%;
+  }
+
   .navbar.navbar-fixed-bottom ul {
     float: none;
     margin-right: 0;
@@ -551,6 +566,7 @@ img.smallogo {
   }
 
   .navbar-text {
+    float:none;
     line-height: 30px;
   }
 }
@@ -566,7 +582,7 @@ img.smallogo {
 }
 
 @media (max-width: 500px) {
-  .navbar-footer .navbar ul.nav a.brand {
+  .navbar-footer .navbar ul.nav a.navbar-brand {
     padding-right: 5px;
   }
 }
@@ -887,3 +903,21 @@ img.smallogo {
   overflow-y: scroll;
   max-height: 500px;
 }
+
+
+/* BOOTSTRAP 3 FIXES */
+/* @grid-float-breakpoint -1 */
+.container {
+  padding: 0;
+}
+@media (min-width: 979px) {
+    body {
+      padding-bottom: 50px;
+    }
+}
+@media (max-width: 979px) {
+    .navbar-fixed-top, .navbar-fixed-bottom {
+      position: relative;
+      top: auto;
+    }
+}

web/views/_nav.erb

@@ -1,10 +1,10 @@
 <div class="navbar-inner">
   <div class="container">
-    <a class="brand" href="<%= root_path %>">
+    <a class="navbar-brand" href="<%= root_path %>">
       <%= Sidekiq::NAME %>
       <%= erb :_status %>
     </a>
-    <ul class="nav">
+    <ul class="nav navbar-nav">
       <% tabs.each do |title, url| %>
         <% if url == '' %>
           <li class="<%= current_path == url ? 'active' : '' %>">
@@ -26,10 +26,8 @@
 
     </ul>
 
-    <ul class="nav pull-right">
+    <div class="col-sm-2 pull-right poll-wrapper">
-      <li>
+      <%= erb :_poll %>
-        <%= erb :_poll %>
+    </div>
-      </li>
-    </ul>
   </div>
 </div>

web/views/_poll.erb

@@ -3,8 +3,8 @@
     setInterval("window.location.reload(true)", 2000);
   </script>
 <% end %>
-<% unless current_path == '' %>
+<% unless false %>
-  <div class="span2 pull-right actions">
+  <div class="actions">
     <% if params[:poll] %>
       <a id="live-poll" class="btn btn-block btn-primary active" href="<%= root_path %><%= current_path %>"><%= t('StopPolling') %></a>
     <% else %>

web/views/_summary.erb

@@ -1,31 +1,31 @@
-<ul class="unstyled summary row">
+<ul class="list-unstyled summary row">
-  <li class="processed span2">
+  <li class="processed col-sm-2">
     <span class="count"><%= number_with_delimiter(stats.processed) %></span>
     <span class="desc"><%= t('Processed') %></span>
   </li>
-  <li class="failed span2">
+  <li class="failed col-sm-2">
     <span class="count"><%= number_with_delimiter(stats.failed) %></span>
     <span class="desc"><%= t('Failed') %></span>
   </li>
-  <li class="busy span2">
+  <li class="busy col-sm-2">
     <a href="<%= root_path %>workers">
       <span class="count"><%= number_with_delimiter(workers_size) %></span>
       <span class="desc"><%= t('Busy') %></span>
     </a>
   </li>
-  <li class="scheduled span2">
+  <li class="scheduled col-sm-2">
     <a href="<%= root_path %>scheduled">
       <span class="count"><%= number_with_delimiter(stats.scheduled_size) %></span>
       <span class="desc"><%= t('Scheduled') %></span>
     </a>
   </li>
-  <li class="retries span2">
+  <li class="retries col-sm-2">
     <a href="<%= root_path %>retries">
       <span class="count"><%= number_with_delimiter(stats.retry_size) %></span>
       <span class="desc"><%= t('Retries') %></span>
     </a>
   </li>
-  <li class="enqueued span2">
+  <li class="enqueued col-sm-2">
     <a href="<%= root_path %>queues">
       <span class="count"><%= number_with_delimiter(stats.enqueued) %></span>
       <span class="desc"><%= t('Enqueued') %></span>

web/views/_workers.erb

@@ -17,7 +17,7 @@
       <td>
         <% if msg['payload']['args'].to_s.size > 100 %>
           <%= msg['payload']['args'].inspect[0..100] + "... " %>
-          <button data-toggle="collapse" data-target="#worker_<%= index %>" class="btn btn-mini"><%= t('ShowAll') %></button>
+          <button data-toggle="collapse" data-target="#worker_<%= index %>" class="btn btn-default btn-xs"><%= t('ShowAll') %></button>
           <div class="toggle" id="worker_<%= index %>" style="display: none;max-width: 750px;"><%= msg['payload']['args'] %></div>
         <% else %>
           <%= msg['payload']['args'] %>

web/views/index.erb

@@ -1,5 +1,5 @@
 <div class="row header">
-  <div class="span7">
+  <div class="col-sm-7">
     <h3><%= t('Workers') %></h3>
   </div>
 </div>
@@ -7,7 +7,7 @@
 <%= erb :_workers %>
 <% if workers_size > 0 %>
   <div class="row">
-    <div class="span2 pull-right">
+    <div class="col-sm-2 pull-right">
       <form action="<%= root_path %>reset" method="post">
         <button class="btn btn-primary btn-block" type="submit"><%= t('ClearWorkerList') %></button>
       </form>

web/views/layout.erb

@@ -9,18 +9,18 @@
     <script type="text/javascript" src="<%= root_path %>javascripts/locales/jquery.timeago.<%= locale %>.js"></script>
   </head>
   <body class="admin">
-    <div class="navbar navbar-fixed-top">
+    <div class="navbar navbar-default navbar-fixed-top">
       <%= erb :_nav %>
     </div>
 
     <div id="page">
       <div class="container">
         <div class="row">
-          <div class="span12 summary_bar">
+          <div class="col-sm-12 summary_bar">
             <%= erb :_summary %>
           </div>
 
-          <div class="span12">
+          <div class="col-sm-12">
             <%= yield %>
           </div>
         </div>

web/views/queue.erb

@@ -1,10 +1,10 @@
 <header class="row">
-  <div class="span5">
+  <div class="col-sm-5">
     <h3>
       <%= t('CurrentMessagesInQueue', :queue => @name) %>
     </h3>
   </div>
-  <div class="span4 pull-right">
+  <div class="col-sm-4 pull-right">
     <%= erb :_paging, :locals => { :url => "#{root_path}queues/#{@name}" } %>
   </div>
 </header>
@@ -20,7 +20,7 @@
       <td>
         <% if msg['args'] and msg['args'].to_s.size > 100 %>
           <%= msg['args'].inspect[0..100] + "... " %>
-          <button data-toggle="collapse" data-target="#worker_<%= index %>" class="btn btn-mini"><%= t('ShowAll') %></button>
+          <button data-toggle="collapse" data-target="#worker_<%= index %>" class="btn btn-default btn-xs"><%= t('ShowAll') %></button>
           <div class="toggle" id="worker_<%= index %>" style="display: none;"><%= msg['args'] %></div>
         <% else %>
           <%= msg['args'] %>
@@ -29,7 +29,7 @@
       <td>
         <form action="<%= root_path %>queues/<%= @name %>/delete" method="post">
           <input name="key_val" value="<%= h Sidekiq.dump_json(msg) %>" type="hidden" />
-          <input class="btn btn-danger btn-mini" type="submit" name="delete" value="<%= t('Delete') %>" data-confirm="<%= t('AreYouSure') %>" />
+          <input class="btn btn-danger btn-xs" type="submit" name="delete" value="<%= t('Delete') %>" data-confirm="<%= t('AreYouSure') %>" />
         </form>
       </td>
     </tr>

web/views/queues.erb

@@ -14,7 +14,7 @@
       <td><%= number_with_delimiter(queue.size) %> </td>
       <td width="20%">
         <form action="<%=root_path %>queues/<%= queue.name %>" method="post">
-          <input class="btn btn-danger btn-small" type="submit" name="delete" value="<%= t('Delete') %>" data-confirm="<%= t('AreYouSureDeleteQueue', :queue => queue.name) %>" />
+          <input class="btn btn-danger btn-xs" type="submit" name="delete" value="<%= t('Delete') %>" data-confirm="<%= t('AreYouSureDeleteQueue', :queue => queue.name) %>" />
         </form>
       </td>
     </tr>

web/views/retries.erb

@@ -1,8 +1,8 @@
 <header class="row">
-  <div class="span5">
+  <div class="col-sm-5">
     <h3><%= t('Retries') %></h3>
   </div>
-  <div class="span4">
+  <div class="col-sm-4">
     <% if @retries.size > 0 %>
       <%= erb :_paging, :locals => { :url => "#{root_path}retries" } %>
     <% end %>
@@ -45,15 +45,15 @@
         </tr>
       <% end %>
     </table>
-    <input class="btn btn-primary btn-small pull-left" type="submit" name="retry" value="<%= t('RetryNow') %>" />
+    <input class="btn btn-primary btn-xs pull-left" type="submit" name="retry" value="<%= t('RetryNow') %>" />
-    <input class="btn btn-danger btn-small pull-left" type="submit" name="delete" value="<%= t('Delete') %>" />
+    <input class="btn btn-danger btn-xs pull-left" type="submit" name="delete" value="<%= t('Delete') %>" />
   </form>
 
   <form action="<%= root_path %>retries/all/delete" method="post">
-    <input class="btn btn-danger btn-small pull-right" type="submit" name="delete" value="<%= t('DeleteAll') %>" data-confirm="<%= t('AreYouSure') %>" />
+    <input class="btn btn-danger btn-xs pull-right" type="submit" name="delete" value="<%= t('DeleteAll') %>" data-confirm="<%= t('AreYouSure') %>" />
   </form>
   <form action="<%= root_path %>retries/all/retry" method="post">
-    <input class="btn btn-danger btn-small pull-right" type="submit" name="retry" value="<%= t('RetryAll') %>" data-confirm="<%= t('AreYouSure') %>" />
+    <input class="btn btn-danger btn-xs pull-right" type="submit" name="retry" value="<%= t('RetryAll') %>" data-confirm="<%= t('AreYouSure') %>" />
   </form>
 
 <% else %>

web/views/retry.erb

@@ -24,7 +24,7 @@
   </tbody>
 </table>
 <form class="form-horizontal" action="<%= root_path %>retries/<%= job_params(@retry, @retry.score) %>" method="post">
-  <a class="btn" href="<%= root_path %>retries"><%= t('GoBack') %></a>
+  <a class="btn btn-default" href="<%= root_path %>retries"><%= t('GoBack') %></a>
   <input class="btn btn-primary" type="submit" name="retry" value="<%= t('RetryNow') %>" />
   <input class="btn btn-danger" type="submit" name="delete" value="<%= t('Delete') %>" />
 </form>

web/views/scheduled.erb

@@ -1,8 +1,8 @@
 <header class="row">
-  <div class="span5">
+  <div class="col-sm-5">
     <h3><%= t('ScheduledJobs') %></h3>
   </div>
-  <div class="span4">
+  <div class="col-sm-4">
     <% if @scheduled.size > 0 %>
       <%= erb :_paging, :locals => { :url => "#{root_path}scheduled" } %>
     <% end %>

web/views/scheduled_job_info.erb

@@ -1,7 +1,7 @@
 <%= erb :_job_info, :locals => {:job => @job, :type => :scheduled} %>
 
 <form class="form-horizontal" action="<%= root_path %>scheduled/<%= job_params(@job, @job.score) %>" method="post">
-  <a class="btn" href="<%= root_path %>scheduled"><%= t('GoBack') %></a>
+  <a class="btn btn-default" href="<%= root_path %>scheduled"><%= t('GoBack') %></a>
   <input class="btn btn-primary" type="submit" name="add_to_queue" value="<%= t('AddToQueue') %>" />
   <input class="btn btn-danger" type="submit" name="delete" value="<%= t('Delete') %>" />
 </form>