From 7993ce149e687f165c15e6bbb8bdd098cf91baf3 Mon Sep 17 00:00:00 2001
From: Dave Conway-Jones <conway@uk.ibm.com>
Date: Thu, 6 Dec 2018 17:31:50 +0000
Subject: [PATCH] sort out page title arrangement when sidebar always open

to close #453
---
 nodes/locales/en-US/ui_base.json |  2 +-
 src/partials/main.html           |  4 ++--
 src/theme.less                   | 10 ++++++++++
 3 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/nodes/locales/en-US/ui_base.json b/nodes/locales/en-US/ui_base.json
index 63887e5a..f3efc257 100644
--- a/nodes/locales/en-US/ui_base.json
+++ b/nodes/locales/en-US/ui_base.json
@@ -86,7 +86,7 @@
         },
         "temp" : {
             "allow-theme" : "Node-RED theme everywhere",
-            "no-theme" : "Angular theme in ui_template",
+            "no-theme" : "Use Angular theme in ui_template",
             "none" : "Angular theme everywhere"
         }
     }
diff --git a/src/partials/main.html b/src/partials/main.html
index 81b9b0f7..0adf13f0 100644
--- a/src/partials/main.html
+++ b/src/partials/main.html
@@ -4,14 +4,14 @@
             <ng-md-icon icon="menu"></ng-md-icon>
         </md-button>
         <h1 ng-show="main.len <= 1" style="width:30px"> </h1>
-        <h1 ng-show="!main.lock && main.loaded">{{main.selectedTab.header || main.selectedTab.name}}</h1>
         <h1 ng-show="main.lockMenu">{{main.name}}</h1>
+        <h1 ng-show="!main.lockMenu && main.loaded">{{main.selectedTab.header || main.selectedTab.name}}</h1>
     </div>
 </md-toolbar>
 <section layout="row" flex>
     <md-sidenav ng-hide="main.len <= 1" class="md-sidenav-left" md-component-id="left" md-is-locked-open="main.lockMenu">
         <md-list>
-            <md-list-item ng-repeat="obj in main.menu" ng-click="main.open(obj, $index)">
+            <md-list-item ng-repeat="obj in main.menu" ng-click="main.open(obj, $index)" ng-class="{ 'nr-menu-item-active': obj.id == main.selectedTab.id }">
                 <ui-icon icon="{{obj.icon}}" style="margin:5px"></ui-icon>
                 <p>{{main.getMenuName(obj)}}</p>
             </md-list-item>
diff --git a/src/theme.less b/src/theme.less
index 934d996e..19926b6c 100644
--- a/src/theme.less
+++ b/src/theme.less
@@ -16,6 +16,12 @@
 @nrTemplateTheme: true;
 @nrUnitHeight: 24px;
 
+& when (@nrTheme = false) {
+    .nr-menu-item-active div button {
+        border-right: 4px solid #888;
+    }
+}
+
 & when (@nrTheme = true) {
 
 .nr-dashboard-disabled {
@@ -66,6 +72,7 @@ body.nr-dashboard-theme .nr-dashboard-dim { opacity: 0.5 !important; }
 */
 body.nr-dashboard-theme md-toolbar {
     background-color: @pageTitlebarBackgroundColor;
+    color: #fff;
 }
 
 /*
@@ -79,6 +86,9 @@ body.nr-dashboard-theme md-sidenav {
 a.md-no-style, button.md-no-style {
     background-color: transparent;
 }
+.nr-menu-item-active div button {
+    border-right: 4px solid @groupTextColor;
+}
 
 /*
     GROUP SPECIFIC