Header nav menu responsiveness improvements

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/uuf-template-app/app/units/uuf.unit.navbar/navbar.hbs

@@ -30,13 +30,11 @@
                 </button>
                 {{defineZone "navbarHeader"}}
             </div>
-            <div class="navbar-collapse collapse" aria-expanded="false">
+            <div id="navbar" class="navbar-collapse collapse" aria-expanded="false">
                 <ul class="nav navbar-nav">
                     {{defineZone "navbarCollapsableLeftItems"}}
                 </ul>
-                <ul class="nav navbar-nav navbar-right">
                 {{defineZone "navbarCollapsableRightItems"}}
-                </ul>
             </div>
         </div>
         {{defineZone "navbarBelow"}}

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/uuf-template-app/app/units/uuf.unit.theme/public/css/theme-wso2.css

@@ -3054,7 +3054,7 @@ tbody.collapse.in {
     right: auto;
   }
 }
-@media (max-width : 480px) {
+@media (max-width : 768px) {
     .navbar-right .dropdown-menu-right {
         left: auto;
         right: 0;
@@ -3901,6 +3901,33 @@ tbody.collapse.in {
     margin-right: 0;
   }
 }
+@media (max-width: 768px) {
+  .navbar-right {
+    margin-right: -15px;
+  }
+  .navbar-default .navbar-toggle{
+
+  }
+  .navbar-default .navbar-toggle .icon-bar{
+    background-color:#fff!important;
+  }
+  .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus{
+    background-color:#526a84!important;
+  }
+  .navbar-default .navbar-toggle:hover .icon-bar, .navbar-default .navbar-toggle:focus .icon-bar{
+    background-color:#798EA5!important;
+  }
+  .navbar-toggle {
+    margin-right: 10px;
+    padding: 13px;
+    margin-top: 0px;
+    margin-bottom: 0px;
+  }
+  #navbar .navbar-nav{
+    margin:0px;
+    border-bottom:1px solid #798EA5;
+  }
+}
 .navbar-default {
   background-color: #f8f8f8;
   border-color: #e7e7e7;