4 files changed, 38 insertions, 21 deletions

diff --git a/webapp/sass/layout/_headers.scss b/webapp/sass/layout/_headers.scss
index dd8440d19..9a4d6771e 100644
--- a/webapp/sass/layout/_headers.scss
+++ b/webapp/sass/layout/_headers.scss
@@ -128,15 +128,15 @@
         white-space: nowrap;
 
         .move--left & {
-            max-width: calc(100vw - 830px);
+            max-width: calc(100vw - 850px);
 
             .multi-teams & {
-                max-width: calc(100vw - 880px);
+                max-width: calc(100vw - 905px);
             }
         }
 
         .multi-teams & {
-            max-width: calc(100vw - 830px);
+            max-width: calc(100vw - 850px);
         }
     }
 
@@ -195,12 +195,15 @@
 
     .channel-header__description {
         display: inline-block;
-        height: 22px;
-        margin-top: 3px;
-        max-width: calc(100vw - 730px);
+        height: 35px;
+        margin-top: -10px;
+        max-width: calc(100vw - 740px);
         overflow: hidden;
+        padding: 3px 0 0;
+        position: relative;
         text-overflow: ellipsis;
-        white-space: nowrap;
+        top: 10px;
+        white-space: pre;
         word-break: break-word;
 
         .markdown__heading {
@@ -209,7 +212,7 @@
         }
 
         .multi-teams & {
-            max-width: calc(100vw - 780px);
+            max-width: calc(100vw - 810px);
         }
 
         &.light {
@@ -223,7 +226,11 @@
         }
 
         .move--left & {
-            max-width: calc(100vw - 780px);
+            max-width: calc(100vw - 810px);
+
+            .multi-teams & {
+                max-width: calc(100vw - 860px);
+            }
         }
 
         .markdown-inline-img {
@@ -311,7 +318,7 @@
         @include legacy-pie-clearfix;
         @include display-flex();
         @include flex-direction(row-reverse);
-        padding: 16px 47px 12px 12px;
+        padding: 16px 40px 12px 12px;
         position: relative;
 
         &:before {
@@ -426,9 +433,9 @@
         .team__name,
         .user__name {
             display: block;
-            font-size: 16px;
+            font-size: 14px;
             font-weight: 600;
-            max-width: 85%;
+            max-width: 100%;
             overflow: hidden;
             text-decoration: none;
             text-overflow: ellipsis;
diff --git a/webapp/sass/layout/_navigation.scss b/webapp/sass/layout/_navigation.scss
index 09b6534b0..f1bce335c 100644
--- a/webapp/sass/layout/_navigation.scss
+++ b/webapp/sass/layout/_navigation.scss
@@ -104,13 +104,13 @@
             padding: 0 .5em;
 
             .heading {
-                color: $white;
                 display: inline-block;
                 font-weight: 600;
                 line-height: 50px;
                 margin-right: 5px;
                 max-width: calc(100% - 200px);
                 overflow: hidden;
+                text-overflow: ellipsis;
                 vertical-align: top;
             }
 
diff --git a/webapp/sass/layout/_sidebar-left.scss b/webapp/sass/layout/_sidebar-left.scss
index cc0c4920f..4be608803 100644
--- a/webapp/sass/layout/_sidebar-left.scss
+++ b/webapp/sass/layout/_sidebar-left.scss
@@ -37,7 +37,7 @@
 
     .sidebar-item__name {
         display: inline-block;
-        max-width: 167px;
+        max-width: 160px;
         overflow: hidden;
         text-overflow: ellipsis;
         vertical-align: top;
@@ -81,8 +81,8 @@
             @include single-transition(all, .15s, ease-in);
             display: block;
             font-weight: 600;
-            height: 50px;
-            line-height: 50px;
+            height: 45px;
+            line-height: 40px;
             padding: 0;
             text-decoration: none;
             width: 100%;
@@ -144,7 +144,7 @@
 
     .nav-pills__container {
         -webkit-overflow-scrolling: touch;
-        height: calc(100% - 120px);
+        height: calc(100% - 115px);
         overflow: auto;
         position: relative;
     }
@@ -215,6 +215,10 @@
 
                 &.has-close {
                     &:hover {
+                        .sidebar-item__name {
+                            max-width: 152px;
+                        }
+
                         .btn-close {
                             @include opacity(.8);
                             display: block;
@@ -228,7 +232,7 @@
                         font-size: 21px;
                         font-weight: 600;
                         position: absolute;
-                        right: 18px;
+                        right: 15px;
                         top: 0px;
 
                         &:hover {
diff --git a/webapp/sass/layout/_sidebar-right.scss b/webapp/sass/layout/_sidebar-right.scss
index 8181ac270..6d31c1606 100644
--- a/webapp/sass/layout/_sidebar-right.scss
+++ b/webapp/sass/layout/_sidebar-right.scss
@@ -128,7 +128,7 @@
         color: inherit;
         display: inline-block;
         font-size: 26px;
-        margin: 0 0 0 -14px;
+        margin-left: -14px;
         text-align: center;
         vertical-align: top;
         width: 30px;
@@ -207,6 +207,11 @@
         }
     }
 
+    .sidebar--right__title {
+        @include clearfix;
+        padding-left: 15px;
+    }
+
     .sidebar--right__header {
         @include flex(0 0 44px);
         border-bottom: 1px solid;
@@ -214,13 +219,14 @@
         font-size: 1em;
         height: 44px;
         line-height: 44px;
-        padding: 0 5px 0 15px;
+        overflow: hidden;
+        padding: 0 5px 0 0;
         text-transform: uppercase;
     }
 
     .sidebar--right__subheader {
         font-size: 1em;
-        padding: 0.5em 1em 0;
+        padding: .5em 1em 0;
 
         h4 {
             font-size: 1em;