Merge pull request #691 from asaadmahmoodspin/ui-changes

UI Updates for multiple tickets

3 files changed, 19 insertions, 2 deletions

diff --git a/web/sass-files/sass/partials/_headers.scss b/web/sass-files/sass/partials/_headers.scss
index e83981397..702f0fd60 100644
--- a/web/sass-files/sass/partials/_headers.scss
+++ b/web/sass-files/sass/partials/_headers.scss
@@ -133,7 +133,7 @@
 		.navbar-right {
 			font-size: 0.85em;
 			position: absolute;
-			top: 10px;
+			top: 11px;
 			right: 22px;
 			z-index: 5;
 			.dropdown-toggle {
@@ -171,7 +171,6 @@
 		}
 		.team__name, .user__name {
 			display: block;
-			line-height: 18px;
 			font-weight: 600;
 			font-size: 16px;
 			max-width: 80%;
@@ -180,9 +179,14 @@
 			text-overflow: ellipsis;
 			text-decoration: none;
 		}
+		.team__name {
+			line-height: 22px;
+			margin-top: -2px;
+		}
 		.user__name {
 			@include single-transition(all, 0.1s, linear);
 			font-size: 14px;
+			line-height: 18px;
 			font-weight: 400;
 			color: #eee;
 			color: rgba(#fff, 0.8);
diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss
index a30782dd0..d29c653ff 100644
--- a/web/sass-files/sass/partials/_responsive.scss
+++ b/web/sass-files/sass/partials/_responsive.scss
@@ -584,6 +584,9 @@
         &.move--right {
             @include translate3d(0, 0, 0);
         }
+        .badge {
+            top: 13px;
+        }
         > div {
             padding-bottom: 105px;
         }
diff --git a/web/sass-files/sass/partials/_sidebar--left.scss b/web/sass-files/sass/partials/_sidebar--left.scss
index 514d22f24..f714a23f8 100644
--- a/web/sass-files/sass/partials/_sidebar--left.scss
+++ b/web/sass-files/sass/partials/_sidebar--left.scss
@@ -30,6 +30,9 @@
     }
     .badge {
         background-color: $primary-color;
+        position: absolute;
+        right: 10px;
+        top: 5px;
     }
     .status {
         position:relative;
@@ -90,6 +93,12 @@
                 line-height: 1.5;
                 border-radius: 0;
                 color: #999;
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                &.has-badge {
+                    padding-right: 30px;
+                }
                 &.nav-more {
                     text-decoration: underline;
                 }
@@ -104,6 +113,7 @@
             &.active {
                 a, a:hover, a:focus {
                     color: #111;
+                    padding-right: 10px;
                     background-color: #e1e1e1;
                     border-radius: 0;
                     font-weight: 400;