Change layout of the admin dashboard

2013-03-14 12:28:35 -04:00 · 2013-03-14 12:28:35 -04:00 · 4f42110e39
parent 1715220d77
commit 4f42110e39
3 changed files with 137 additions and 125 deletions
--- a/app/assets/javascripts/admin/models/github_commit.js
+++ b/app/assets/javascripts/admin/models/github_commit.js
@ -11,7 +11,7 @@ Discourse.GithubCommit = Discourse.Model.extend({
    if( this.get('author') && this.get('author.gravatar_id') ){
      return("https://www.gravatar.com/avatar/" + this.get('author.gravatar_id') + ".png?s=38&r=pg&d=identicon");
    } else {
-      return "https://www.gravatar.com/avatar/b30fff48d257cdd17c4437afac19fd30.png?s=38&r=pg&d=identicon";  
+      return "https://www.gravatar.com/avatar/b30fff48d257cdd17c4437afac19fd30.png?s=38&r=pg&d=identicon";
    }
  }.property("commit"),

@ -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) );
--- a/app/assets/javascripts/admin/templates/dashboard.js.handlebars
+++ b/app/assets/javascripts/admin/templates/dashboard.js.handlebars
@ -1,80 +1,78 @@
-{{#if Discourse.SiteSettings.version_checks}}
+<div class="dashboard-left">
  <div {{bindAttr class=":version-check versionCheck.critical_updates:critical:normal"}}>
-    {{#if loading }}
-      <p>{{i18n loading}}</p>
-    {{else}}
-      <p>
-        {{i18n admin.dashboard.version}}: <span class="version-number">{{ versionCheck.installed_version }}</span>
+    {{#if Discourse.SiteSettings.version_checks}}
+      {{#if loading }}
+        <p>{{i18n loading}}</p>
+      {{else}}
+        <p>
+          {{i18n admin.dashboard.version}}: <span class="version-number">{{ versionCheck.installed_version }}</span>

-        {{#if versionCheck.installed_sha}}
-          <span class="git-version">(<a {{bindAttr href="versionCheck.gitLink"}} target="_blank">{{versionCheck.shortSha}}</a>)</span>
-        {{/if}}
-      </p>
+          {{#if versionCheck.installed_sha}}
+            <span class="git-version">(<a {{bindAttr href="versionCheck.gitLink"}} target="_blank">{{versionCheck.shortSha}}</a>)</span>
+          {{/if}}
+        </p>

-      <p class="version-notes">
-        {{i18n admin.dashboard.latest_version}}: <span class="version-number">{{ versionCheck.latest_version }}</span>
-        {{#if versionCheck.upToDate }}
-          <span class='icon update-to-date'>☻</span> {{i18n admin.dashboard.up_to_date}}
-        {{else}}
-          <span {{bindAttr class=":icon versionCheck.critical_updates:critical-updates-available:updates-available"}}>
-            {{#if versionCheck.behindByOneVersion}}
-              ☺
-            {{else}}
-              ☹
-            {{/if}}
-          </span>
-          <span class="critical-note">{{i18n admin.dashboard.critical_available}}</span>
-          <span class="normal-note">{{i18n admin.dashboard.updates_available}}</span>
-          {{i18n admin.dashboard.please_upgrade}}
-        {{/if}}
-      </p>
-
-      <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>
+        <p class="version-notes">
+          {{i18n admin.dashboard.latest_version}}: <span class="version-number">{{ versionCheck.latest_version }}</span>
+          {{#if versionCheck.upToDate }}
+            <span class='icon update-to-date'>☻</span> {{i18n admin.dashboard.up_to_date}}
+          {{else}}
+            <span {{bindAttr class=":icon versionCheck.critical_updates:critical-updates-available:updates-available"}}>
+              {{#if versionCheck.behindByOneVersion}}
+                ☺
+              {{else}}
+                ☹
+              {{/if}}
+            </span>
+            <span class="critical-note">{{i18n admin.dashboard.critical_available}}</span>
+            <span class="normal-note">{{i18n admin.dashboard.updates_available}}</span>
+            {{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>
  </div>

-  <div class="version-check-right">
-    {{ render admin_github_commits githubCommits }}
+  <div class="dashboard-stats">
+    <table class="table table-condensed table-hover">
+      <thead>
+        <tr>
+          <th>&nbsp;</th>
+          <th>{{i18n admin.dashboard.reports.today}}</th>
+          <th>{{i18n admin.dashboard.reports.yesterday}}</th>
+          <th>{{i18n admin.dashboard.reports.last_7_days}}</th>
+          <th>{{i18n admin.dashboard.reports.last_30_days}}</th>
+        </tr>
+      </thead>
+      {{ render 'admin_report_signups' signups }}
+      {{ render 'admin_report_topics' topics }}
+      {{ render 'admin_report_posts' posts }}
+      {{ render 'admin_report_flags' flags }}
+    </table>
  </div>

-  <div class='clearfix'></div>
-{{/if}}
-
-<div class="dashboard-stats">
-  <table class="table table-condensed table-hover">
-    <thead>
-      <tr>
-        <th>&nbsp;</th>
-        <th>{{i18n admin.dashboard.reports.today}}</th>
-        <th>{{i18n admin.dashboard.reports.yesterday}}</th>
-        <th>{{i18n admin.dashboard.reports.last_7_days}}</th>
-        <th>{{i18n admin.dashboard.reports.last_30_days}}</th>
-      </tr>
-    </thead>
-    {{ render 'admin_report_signups' signups }}
-    {{ render 'admin_report_topics' topics }}
-    {{ render 'admin_report_posts' posts }}
-    {{ render 'admin_report_flags' flags }}
-  </table>
+  <div class="dashboard-stats">
+    <table class="table table-condensed table-hover">
+      <thead>
+        <tr>
+          <th>&nbsp;</th>
+          <th>{{i18n admin.dashboard.reports.today}}</th>
+          <th>{{i18n admin.dashboard.reports.yesterday}}</th>
+          <th>{{i18n admin.dashboard.reports.7_days_ago}}</th>
+          <th>{{i18n admin.dashboard.reports.30_days_ago}}</th>
+        </tr>
+      </thead>
+      {{ render 'admin_report_total_users' total_users }}
+      {{ render 'admin_report_visits' visits }}
+    </table>
+  </div>
 </div>
-
-<div class="dashboard-stats">
-  <table class="table table-condensed table-hover">
-    <thead>
-      <tr>
-        <th>&nbsp;</th>
-        <th>{{i18n admin.dashboard.reports.today}}</th>
-        <th>{{i18n admin.dashboard.reports.yesterday}}</th>
-        <th>{{i18n admin.dashboard.reports.7_days_ago}}</th>
-        <th>{{i18n admin.dashboard.reports.30_days_ago}}</th>
-      </tr>
-    </thead>
-    {{ render 'admin_report_total_users' total_users }}
-    {{ render 'admin_report_visits' visits }}
-  </table>
+<div class="dashboard-right">
+  {{ render admin_github_commits githubCommits }}
 </div>
-
-<div class="clearfix"></div>
+<div class='clearfix'></div>
--- a/app/assets/stylesheets/admin/admin_base.scss
+++ b/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;
+  }
 }