From 277e4db2cbaf701f0136f8e41d5db5f9878d1be5 Mon Sep 17 00:00:00 2001
From: Neil Lalonde <neillalonde@gmail.com>
Date: Tue, 30 Jul 2013 14:45:03 -0400
Subject: [PATCH] Use ellipsis in dashboard referred topics table. Add
 .overflow-ellipsis css helper.

---
 .../javascripts/admin/templates/dashboard.js.handlebars  | 8 +++++++-
 .../discourse/controllers/composer_controller.js         | 4 ++--
 app/assets/stylesheets/admin/admin_base.scss             | 6 ++++++
 app/assets/stylesheets/application/modal.css.scss        | 3 ---
 app/assets/stylesheets/foundation/helpers.css.scss       | 9 +++++++++
 5 files changed, 24 insertions(+), 6 deletions(-)

diff --git a/app/assets/javascripts/admin/templates/dashboard.js.handlebars b/app/assets/javascripts/admin/templates/dashboard.js.handlebars
index e955c16c902..a3c5c2bd0d4 100644
--- a/app/assets/javascripts/admin/templates/dashboard.js.handlebars
+++ b/app/assets/javascripts/admin/templates/dashboard.js.handlebars
@@ -214,7 +214,13 @@
         {{#each data in top_referred_topics.data}}
           <tbody>
             <tr>
-              <td class="title"><a href="/t/{{unbound data.topic_slug}}/{{unbound data.topic_id}}">{{shorten data.topic_title}}</a></td>
+              <td class="title">
+                <div class="referred-topic-title">
+                  <div class="overflow-ellipsis">
+                    <a href="/t/{{unbound data.topic_slug}}/{{unbound data.topic_id}}">{{data.topic_title}}</a>
+                  </div>
+                </div>
+              </td>
               <td class="value">{{data.num_clicks}}</td>
             </tr>
           </tbody>
diff --git a/app/assets/javascripts/discourse/controllers/composer_controller.js b/app/assets/javascripts/discourse/controllers/composer_controller.js
index 7544b5c76ee..b1799fd4ee7 100644
--- a/app/assets/javascripts/discourse/controllers/composer_controller.js
+++ b/app/assets/javascripts/discourse/controllers/composer_controller.js
@@ -62,7 +62,7 @@ Discourse.ComposerController = Discourse.Controller.extend({
 
         if(topic) {
           buttons.push({
-            "label": I18n.t("composer.reply_here") + "<br/><div class='topic-title'>" + topic.get('title') + "</div>",
+            "label": I18n.t("composer.reply_here") + "<br/><div class='topic-title overflow-ellipsis'>" + topic.get('title') + "</div>",
             "class": "btn btn-reply-here",
             "callback": function(){
               composer.set('topic', topic);
@@ -73,7 +73,7 @@ Discourse.ComposerController = Discourse.Controller.extend({
         }
 
         buttons.push({
-          "label": I18n.t("composer.reply_original") + "<br/><div class='topic-title'>" + this.get('model.topic.title') + "</div>",
+          "label": I18n.t("composer.reply_original") + "<br/><div class='topic-title overflow-ellipsis'>" + this.get('model.topic.title') + "</div>",
           "class": "btn-primary btn-reply-on-original",
           "callback": function(){
             composerController.save(true);
diff --git a/app/assets/stylesheets/admin/admin_base.scss b/app/assets/stylesheets/admin/admin_base.scss
index 78ba9867a47..c3580bc0690 100644
--- a/app/assets/stylesheets/admin/admin_base.scss
+++ b/app/assets/stylesheets/admin/admin_base.scss
@@ -489,6 +489,12 @@ table {
       width: 45px;
     }
   }
+
+  .referred-topic-title {
+    width: 410px;
+    @include medium-width { width: 360px; }
+    @include small-width  { width: 320px; }
+  }
 }
 
 
diff --git a/app/assets/stylesheets/application/modal.css.scss b/app/assets/stylesheets/application/modal.css.scss
index 62ac58ade20..17028569e3a 100644
--- a/app/assets/stylesheets/application/modal.css.scss
+++ b/app/assets/stylesheets/application/modal.css.scss
@@ -279,9 +279,6 @@
       .topic-title {
         font-size: 13px;
         font-weight: normal;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
       }
       &.btn-reply-here {
         @include linear-gradient(#ddd, #ddd);
diff --git a/app/assets/stylesheets/foundation/helpers.css.scss b/app/assets/stylesheets/foundation/helpers.css.scss
index 8602991434d..f4e1d7629aa 100644
--- a/app/assets/stylesheets/foundation/helpers.css.scss
+++ b/app/assets/stylesheets/foundation/helpers.css.scss
@@ -49,3 +49,12 @@
     clear: both;
   }
 }
+
+// Overflow
+// --------------------------------------------------
+
+.overflow-ellipsis {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}