Multiple Ui improvements (#7029)

* PLT-7119 - Updating headings on compact view

* PLT-7103 - Removing line below channel intro

* PLT-7112 - Fixing system console banner

* PLT-7144 - Adding ellipsis to system console boxes

* PLT-7181 - Changing channel header opacity

* PLT-6899 - Updating unread bar

* Updating margin for new messages indicator

5 files changed, 28 insertions, 6 deletions

diff --git a/webapp/sass/layout/_headers.scss b/webapp/sass/layout/_headers.scss
index 9a4d6771e..44b8ab4f0 100644
--- a/webapp/sass/layout/_headers.scss
+++ b/webapp/sass/layout/_headers.scss
@@ -249,8 +249,7 @@
 }
 
 .channel-intro {
-    border-bottom: 1px solid $light-gray;
-    margin: 0 auto 15px;
+    margin: 0 auto 10px;
     padding: 0 15px;
 
     &.channel-intro--centered {
diff --git a/webapp/sass/layout/_post.scss b/webapp/sass/layout/_post.scss
index 272d22479..cb2431555 100644
--- a/webapp/sass/layout/_post.scss
+++ b/webapp/sass/layout/_post.scss
@@ -284,7 +284,7 @@
         bottom: 0;
         font-size: 13.5px;
         left: 0;
-        margin: 0 auto;
+        margin: 5px auto;
         position: absolute;
         right: 0;
         text-align: center;
@@ -299,11 +299,15 @@
             top: 1px;
         }
 
+        .icon {
+            margin-left: 5px;
+        }
+
         div {
             @include border-radius(50px);
             cursor: pointer;
             display: inline-block;
-            padding: 5px 10px;
+            padding: 4px 20px 3px;
         }
 
         &.visible {
@@ -774,6 +778,7 @@
         }
 
         .markdown__heading {
+            clear: both;
             font-size: 1em;
             margin: 0;
         }
diff --git a/webapp/sass/layout/_sidebar-left.scss b/webapp/sass/layout/_sidebar-left.scss
index 4be608803..515f87a87 100644
--- a/webapp/sass/layout/_sidebar-left.scss
+++ b/webapp/sass/layout/_sidebar-left.scss
@@ -154,15 +154,25 @@
         font-size: 13.5px;
         left: 15px;
         margin: 0 auto;
-        padding: 3px 0 4px;
+        padding: 4px 0 3px;
         position: fixed;
         text-align: center;
         width: 190px;
         z-index: 1;
+
+        .icon {
+            margin-left: 5px;
+        }
     }
 
     .nav-pills__unread-indicator-top {
         top: 80px;
+
+        .icon {
+            svg {
+                @include transform(rotate(180deg));
+            }
+        }
     }
 
     .nav-pills__unread-indicator-bottom {
diff --git a/webapp/sass/routes/_admin-console.scss b/webapp/sass/routes/_admin-console.scss
index 7b449e2c8..9e8c74484 100644
--- a/webapp/sass/routes/_admin-console.scss
+++ b/webapp/sass/routes/_admin-console.scss
@@ -183,7 +183,7 @@
         border: 1px solid #ddd;
         font-size: .95em;
         margin: 2em 0;
-        padding: .7em 1.5em;
+        padding: .8em 1.5rem;
 
         .banner__heading {
             font-size: 1.5em;
diff --git a/webapp/sass/routes/_statistics.scss b/webapp/sass/routes/_statistics.scss
index 5a35039e7..85232708a 100644
--- a/webapp/sass/routes/_statistics.scss
+++ b/webapp/sass/routes/_statistics.scss
@@ -16,6 +16,14 @@
             padding: 7px 10px;
             text-align: left;
 
+            span {
+                display: inline-block;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+                width: calc(100% - 20px);
+            }
+
             .fa {
                 color: #555555;
                 float: right;