theme changes

client/res/templates/site/navbar.tpl

@@ -1,8 +1,5 @@
 <div class="navbar navbar-inverse" role="navigation">
     <div class="navbar-header">
-        <a class="minimizer" href="javascript:">
-            <span class="glyphicon glyphicon-menu-hamburger"></span>
-        </a>
         <a class="navbar-brand nav-link" href="#"><img src="{{logoSrc}}" class="logo"><span class="home-icon glyphicon glyphicon-th-large" title="{{translate 'Home'}}"></span></a>
         <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-body">
             <span class="icon-bar"></span>
@@ -62,5 +59,9 @@
                 </ul>
             </li>
         </ul>
+        <a class="minimizer" href="javascript:">
+            <span class="glyphicon glyphicon glyphicon-menu-right right"></span>
+            <span class="glyphicon glyphicon glyphicon-menu-left left"></span>
+        </a>
     </div>
 </div>

client/src/views/site/navbar.js

@@ -60,7 +60,7 @@ Espo.define('views/site/navbar', 'view', function (Dep) {
                 var scope = $(e.currentTarget).data('name');
                 this.quickCreate(scope);
             },
-            'click .navbar-header a.minimizer': function () {
+            'click a.minimizer': function () {
                 var $body = $('body');
                 if ($body.hasClass('minimized')) {
                     $body.removeClass('minimized');
@@ -247,6 +247,8 @@ Espo.define('views/site/navbar', 'view', function (Dep) {
             } else {
                 var $tabs = this.$el.find('ul.tabs');
 
+                console.log(navbarStaticItemsHeight);
+
                 var minHeight = $tabs.height() + navbarStaticItemsHeight;
 
                 var $more = $tabs.find('li.more > ul');

frontend/less/espo-vertical/layout.less

@@ -12,7 +12,7 @@
 }
 
 @media screen and (max-width: @screen-sm-min) {
-  #header .navbar-header > a.minimizer {
+  #header a.minimizer {
     display: none;
   }
 
@@ -65,6 +65,21 @@ body > #header .navbar-brand span.home-icon {
     overflow-y: hidden;
   }
 
+  #header a.minimizer {
+    color: @navbar-inverse-link-color;
+    text-decoration: none;
+    margin-top: 5px;
+    display: inline-block;
+    margin-left: 3px;
+  }
+
+  #header a.minimizer > span.left {
+    display: inline;
+  }
+  #header a.minimizer > span.right {
+    display: none;
+  }
+
   body.minimized {
     #header {
       width: @navbar-minimized-width;
@@ -80,7 +95,7 @@ body > #header .navbar-brand span.home-icon {
 
     #header a.navbar-brand {
       position: fixed;
-      top: 30px;
+      top: 0;
       height: 35px;
       width: @navbar-minimized-width;
       padding-top: 8px;
@@ -102,15 +117,11 @@ body > #header .navbar-brand span.home-icon {
         height: 30px;
     }
 
-    #header .navbar-header > a.minimizer {
-      width: 30px;
-      height: 30px;
-      float: none;
-      display: block;
+    #header a.minimizer > span.left {
+      display: none;
     }
-
-    #header .navbar-header > a.minimizer span {
-      margin-left: 12px;
+    #header a.minimizer > span.right {
+      display: inline;
     }
 
     #content {
@@ -127,7 +138,7 @@ body > #header .navbar-brand span.home-icon {
 
     #header ul.tabs {
       width: @navbar-minimized-width;
-      margin-top: 35px;
+      margin-top: 5px;
     }
 
     #header .navbar-right {
@@ -159,13 +170,13 @@ body > #header .navbar-brand span.home-icon {
   }
 
   #header .navbar-brand img {
-    max-width: @navbar-width - 30px;
-    height: 30px;
+    max-width: @navbar-width - 10px;
+    height: 35px;
   }
 
   #header a.navbar-brand {
-    max-width: @navbar-width - 30px;
-    height: 30px;
+    max-width: @navbar-width - 10px;
+    height: 35px;
   }
 
   #header .navbar-header {

frontend/less/espo/layout.less

@@ -76,7 +76,7 @@ body > footer {
     }
 }
 
-#header .navbar-header > a.minimizer {
+#header a.minimizer {
   display: none;
 }