Expand and highlight parent menu item when active page sidebar navigation item is a sub menu

This commit is contained in:
Bernd Bestel
2018-07-14 10:28:33 +02:00
parent f018696219
commit 909949a9e1
3 changed files with 14 additions and 7 deletions

View File

@@ -59,12 +59,12 @@ a.discrete-link:focus {
.navbar-sidenav { .navbar-sidenav {
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
border-top: 2px solid !important;
} }
.navbar-sidenav, .navbar-sidenav,
.sidenav-second-level { .sidenav-second-level {
background-color: #e5e5e5 !important; background-color: #e5e5e5 !important;
border-top: 2px solid !important;
border-right: 2px solid !important; border-right: 2px solid !important;
border-color: #d6d6d6 !important; border-color: #d6d6d6 !important;
} }

View File

@@ -23,7 +23,14 @@ if (!Grocy.ActiveNav.isEmpty())
{ {
var menuItem = $('#sidebarResponsive').find("[data-nav-for-page='" + Grocy.ActiveNav + "']"); var menuItem = $('#sidebarResponsive').find("[data-nav-for-page='" + Grocy.ActiveNav + "']");
menuItem.addClass('active-page'); menuItem.addClass('active-page');
}
var parentMenuSelector = menuItem.data("sub-menu-of");
if (typeof parentMenuSelector !== "undefined")
{
$(parentMenuSelector).collapse("show");
$(parentMenuSelector).prev(".nav-link-collapse").addClass("active-page");
}
}
$.timeago.settings.allowFuture = true; $.timeago.settings.allowFuture = true;
RefreshContextualTimeago = function() RefreshContextualTimeago = function()

View File

@@ -113,31 +113,31 @@
<span class="nav-link-text">{{ $L('Manage master data') }}</span> <span class="nav-link-text">{{ $L('Manage master data') }}</span>
</a> </a>
<ul id="top-nav-manager-master-data" class="sidenav-second-level collapse"> <ul id="top-nav-manager-master-data" class="sidenav-second-level collapse">
<li data-nav-for-page="products"> <li data-nav-for-page="products" data-sub-menu-of="#top-nav-manager-master-data">
<a class="nav-link discrete-link" href="{{ $U('/products') }}"> <a class="nav-link discrete-link" href="{{ $U('/products') }}">
<i class="fab fa-product-hunt"></i> <i class="fab fa-product-hunt"></i>
<span class="nav-link-text">{{ $L('Products') }}</span> <span class="nav-link-text">{{ $L('Products') }}</span>
</a> </a>
</li> </li>
<li data-nav-for-page="locations"> <li data-nav-for-page="locations" data-sub-menu-of="#top-nav-manager-master-data">
<a class="nav-link discrete-link" href="{{ $U('/locations') }}"> <a class="nav-link discrete-link" href="{{ $U('/locations') }}">
<i class="fas fa-map-marker-alt"></i> <i class="fas fa-map-marker-alt"></i>
<span class="nav-link-text">{{ $L('Locations') }}</span> <span class="nav-link-text">{{ $L('Locations') }}</span>
</a> </a>
</li> </li>
<li data-nav-for-page="quantityunits"> <li data-nav-for-page="quantityunits" data-sub-menu-of="#top-nav-manager-master-data">
<a class="nav-link discrete-link" href="{{ $U('/quantityunits') }}"> <a class="nav-link discrete-link" href="{{ $U('/quantityunits') }}">
<i class="fas fa-balance-scale"></i> <i class="fas fa-balance-scale"></i>
<span class="nav-link-text">{{ $L('Quantity units') }}</span> <span class="nav-link-text">{{ $L('Quantity units') }}</span>
</a> </a>
</li> </li>
<li data-nav-for-page="habits"> <li data-nav-for-page="habits" data-sub-menu-of="#top-nav-manager-master-data">
<a class="nav-link discrete-link" href="{{ $U('/habits') }}"> <a class="nav-link discrete-link" href="{{ $U('/habits') }}">
<i class="fas fa-sync-alt"></i> <i class="fas fa-sync-alt"></i>
<span class="nav-link-text">{{ $L('Habits') }}</span> <span class="nav-link-text">{{ $L('Habits') }}</span>
</a> </a>
</li> </li>
<li data-nav-for-page="batteries"> <li data-nav-for-page="batteries" data-sub-menu-of="#top-nav-manager-master-data">
<a class="nav-link discrete-link" href="{{ $U('/batteries') }}"> <a class="nav-link discrete-link" href="{{ $U('/batteries') }}">
<i class="fas fa-battery-three-quarters"></i> <i class="fas fa-battery-three-quarters"></i>
<span class="nav-link-text">{{ $L('Batteries') }}</span> <span class="nav-link-text">{{ $L('Batteries') }}</span>