Merge pull request #2429 from asaadmahmoodspin/ui-improvements

PLT-963 - Improving scss structure

1 files changed, 72 insertions, 0 deletions

diff --git a/web/sass-files/sass/layout/_sidebar-menu.scss b/web/sass-files/sass/layout/_sidebar-menu.scss
new file mode 100644
index 000000000..167b24ba0
--- /dev/null
+++ b/web/sass-files/sass/layout/_sidebar-menu.scss
@@ -0,0 +1,72 @@
+@charset 'UTF-8';
+
+.sidebar--menu {
+    position: absolute;
+    width: 220px;
+    right: 0;
+    height: 100%;
+    border-right: $border-gray;
+    padding: 0 0 2em 0;
+    background: #fafafa;
+    display: none;
+    .nav-pills__container {
+        padding-top: 5px;
+    }
+    .team__header {
+        display: none;
+        padding: 0 15px;
+        @include legacy-pie-clearfix;
+        a {
+            color: #fff;
+        }
+        .navbar-right {
+            font-size: .85em;
+            margin: 16px -5px 0;
+            .dropdown-toggle {
+                padding: 0 10px;
+            }
+            .dropdown-menu {
+                li a {
+                    padding: 3 20px;
+                    color: #555;
+                }
+            }
+            .dropdown__icon {
+                background: url('../images/dropdown-icon.png');
+                width: 4px;
+                height: 16px;
+                @include background-size(100% 100%);
+                display: inline-block;
+            }
+        }
+        .team__name {
+            float: left;
+            line-height: 50px;
+            font-weight: 600;
+            font-size: 1.2em;
+            max-width: 80%;
+            overflow: hidden;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+            text-decoration: none;
+        }
+    }
+    .nav {
+        > li {
+            > a {
+                font-size: 15px;
+                background: none !important;
+                color: inherit;
+                line-height: 40px;
+                padding: 0 15px;
+                .fa,
+                .glyphicon {
+                    width: 25px;
+                    text-align: center;
+                    left: -5px;
+                    position: relative;
+                }
+            }
+        }
+    }
+}