Change layout of the admin dashboard

app/assets/javascripts/admin/models/github_commit.js

@@ -31,7 +31,7 @@ Discourse.GithubCommit.reopenClass({
     $.ajax( "https://api.github.com/repos/discourse/discourse/commits?callback=callback", {
       dataType: 'jsonp',
       type: 'get',
-      data: { per_page: 10 },
+      data: { per_page: 25 },
       success: function(response, textStatus, jqXHR) {
         response.data.each(function(commit) {
           result.pushObject( Discourse.GithubCommit.create(commit) );

app/assets/javascripts/admin/templates/dashboard.js.handlebars

@@ -1,5 +1,6 @@
-{{#if Discourse.SiteSettings.version_checks}}
+<div class="dashboard-left">
   <div {{bindAttr class=":version-check versionCheck.critical_updates:critical:normal"}}>
+    {{#if Discourse.SiteSettings.version_checks}}
       {{#if loading }}
         <p>{{i18n loading}}</p>
       {{else}}
@@ -28,21 +29,15 @@
             {{i18n admin.dashboard.please_upgrade}}
           {{/if}}
         </p>
+      {{/if}}
+    {{/if}}
 
     <p class="update-nag">
       <i class="icon icon-github"></i>
       <a href="https://github.com/discourse/discourse" target="_blank">{{i18n admin.dashboard.update_often}}</a>
     </p>
-    {{/if}}
   </div>
 
-  <div class="version-check-right">
-    {{ render admin_github_commits githubCommits }}
-  </div>
-
-  <div class='clearfix'></div>
-{{/if}}
-
   <div class="dashboard-stats">
     <table class="table table-condensed table-hover">
       <thead>
@@ -76,5 +71,8 @@
       {{ render 'admin_report_visits' visits }}
     </table>
   </div>
-
-<div class="clearfix"></div>
+</div>
+<div class="dashboard-right">
+  {{ render admin_github_commits githubCommits }}
+</div>
+<div class='clearfix'></div>

app/assets/stylesheets/admin/admin_base.scss

@@ -76,55 +76,6 @@
   }
 }
 
-.version-check {
-  float: left;
-  width: 500px;
-}
-.version-check-right {
-  float:right;
-  width: 500px;
-  margin-right: 15px;
-}
-
-.version-check {
-  .version-number {
-    font-size: 18px;
-    font-weight: bold
-  }
-
-  .version-notes .icon {
-    margin-left: 20px;
-    vertical-align: bottom;
-  }
-
-  &.critical .version-notes .normal-note {
-    display: none;
-  }
-  &.normal .version-notes .critical-note {
-    display: none;
-  }
-
-  .icon {
-    font-size: 26px;
-  }
-
-  .update-to-date {
-    color: green;
-  }
-  .updates-available {
-    color: #FF9500;
-  }
-  .critical-updates-available {
-    color: red;
-  }
-}
-
-.update-nag {
-  i.icon {
-    font-size: 20px;
-  }
-}
-
 .settings {
   .setting {
     padding-bottom: 20px;
@@ -304,10 +255,60 @@ table {
   .last-flagged { padding: 0 10px; }
 }
 
+/* Dashboard */
+
+.dashboard-left {
+  float: left;
+  width: 500px;
+}
+.dashboard-right {
+  float: right;
+  width: 500px;
+  margin-right: 15px;
+}
+
+.version-check {
+  .version-number {
+    font-size: 18px;
+    font-weight: bold
+  }
+
+  .version-notes .icon {
+    margin-left: 20px;
+    vertical-align: bottom;
+  }
+
+  &.critical .version-notes .normal-note {
+    display: none;
+  }
+  &.normal .version-notes .critical-note {
+    display: none;
+  }
+
+  .icon {
+    font-size: 26px;
+  }
+
+  .update-to-date {
+    color: green;
+  }
+  .updates-available {
+    color: #FF9500;
+  }
+  .critical-updates-available {
+    color: red;
+  }
+}
+
+.update-nag {
+  i.icon {
+    font-size: 20px;
+  }
+}
+
 .dashboard-stats {
   margin-top: 30px;
   width: 450px;
-  float: left;
   margin-left: 40px;
 
   table {
@@ -328,8 +329,9 @@ table {
 
 .commits-widget {
   border: solid 1px #ccc;
+  margin-top: 10px;
   width: 500px;
-  height: 160px;
+  height: 380px;
 
   ul, li {
     margin: 0;
@@ -340,7 +342,7 @@ table {
   }
   a {
     color: #222;
-    text-decoration: none
+    text-decoration: none;
   }
   a:hover {
     text-decoration: underline;
@@ -375,7 +377,7 @@ table {
   }
 
   .commits-list {
-    height: 129px;
+    height: 349px;
     overflow-y:auto;
 
     li {
@@ -426,4 +428,16 @@ table {
       border: none;
     }
   }
+
+  // Always show the scrollbar:
+  ::-webkit-scrollbar {
+    width: 6px;
+  }
+  ::-webkit-scrollbar-thumb {
+    background-color: #d1d1d1;
+    -webkit-border-radius: 3px;
+  }
+  ::-webkit-scrollbar-track {
+    border-left: solid 1px #ddd;
+  }
 }