From 722afe8c1249e24366bef92bafab2bced95bf928 Mon Sep 17 00:00:00 2001
From: sonny <sonnyba871@gmail.com>
Date: Tue, 16 Jun 2020 20:56:38 +0200
Subject: [PATCH] Fix sidebar category overflow

---
 .../pages/homepage/components/sidebar/CategoryItem.js  |  4 ++--
 src/newsreader/scss/components/category/_category.scss | 10 ++++++----
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/newsreader/js/pages/homepage/components/sidebar/CategoryItem.js b/src/newsreader/js/pages/homepage/components/sidebar/CategoryItem.js
index 7c0268c..563f8ad 100644
--- a/src/newsreader/js/pages/homepage/components/sidebar/CategoryItem.js
+++ b/src/newsreader/js/pages/homepage/components/sidebar/CategoryItem.js
@@ -40,8 +40,8 @@ class CategoryItem extends React.Component {
           </div>
 
           <div className="category__info" onClick={() => this.handleSelect()}>
-            <span>{this.props.category.name}</span>
-            <span className="badge">{this.props.category.unread}</span>
+            <span className="category__name">{this.props.category.name}</span>
+            <span className="badge category__badge">{this.props.category.unread}</span>
           </div>
         </div>
 
diff --git a/src/newsreader/scss/components/category/_category.scss b/src/newsreader/scss/components/category/_category.scss
index 683ed0b..e8e1ba9 100644
--- a/src/newsreader/scss/components/category/_category.scss
+++ b/src/newsreader/scss/components/category/_category.scss
@@ -14,16 +14,18 @@
     overflow: hidden;
     white-space: nowrap;
 
-    & h4 {
-      overflow: hidden;
-      text-overflow: ellipsis;
-    }
 
     &:hover {
       cursor: pointer;
     }
   }
 
+  &__name {
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+
   &__menu {
     display: flex;
     align-items: center;