From 2eece87206a7d5edfd01fc6df641af0443226756 Mon Sep 17 00:00:00 2001
From: Arpit Jalan <arpit@techapj.com>
Date: Wed, 14 Oct 2015 19:02:57 +0530
Subject: [PATCH] UX: clip long category names in suggested topics

---
 app/assets/stylesheets/common/base/topic.scss            | 5 +++++
 app/assets/stylesheets/common/components/badges.css.scss | 2 ++
 2 files changed, 7 insertions(+)

diff --git a/app/assets/stylesheets/common/base/topic.scss b/app/assets/stylesheets/common/base/topic.scss
index a75a428a38f..93a634f55a8 100644
--- a/app/assets/stylesheets/common/base/topic.scss
+++ b/app/assets/stylesheets/common/base/topic.scss
@@ -61,6 +61,11 @@
   line-height: 0.8;
 }
 
+#suggested-topics .badge-wrapper.bullet span.badge-category,
+#suggested-topics .badge-wrapper.bar span.badge-category {
+  max-width: 150px;
+}
+
 .topic-unsubscribe {
   .notification-options {
     display: inline-block;
diff --git a/app/assets/stylesheets/common/components/badges.css.scss b/app/assets/stylesheets/common/components/badges.css.scss
index 6cad8c10294..3f5239d1fe8 100644
--- a/app/assets/stylesheets/common/components/badges.css.scss
+++ b/app/assets/stylesheets/common/components/badges.css.scss
@@ -32,6 +32,8 @@
       vertical-align: text-top;
       margin-top: -3px; //vertical alignment fix
       display: inline-block;
+      overflow: hidden;
+      text-overflow: ellipsis;
 
       .extra-info-wrapper & {
         color: $header-primary !important;