From 9e264cdc04f6d68260b9ac6b77a4c60581151a2b Mon Sep 17 00:00:00 2001 From: Andreas Gohr Date: Mon, 24 Apr 2017 15:53:27 +0200 Subject: [PATCH 1/2] show sidebar label on collapsed sidebar SPR-957 This removes the base z-indexes as they seem not to be needed (source order defines initial heights) and interfered with the sidbar functionality. Removing it was suggested in SPR-899 as well --- css/area_main-sidebar-nav.less | 14 ++++++++++++-- css/base_structure.less | 9 --------- js/sidebar.js | 8 ++++---- tpl/main-sidebar-nav.php | 16 ++++++++-------- 4 files changed, 24 insertions(+), 23 deletions(-) diff --git a/css/area_main-sidebar-nav.less b/css/area_main-sidebar-nav.less index 34e2dac..15c850d 100755 --- a/css/area_main-sidebar-nav.less +++ b/css/area_main-sidebar-nav.less @@ -84,8 +84,14 @@ } } + // the wrapper around the toggle to reserve space + div.nav { + height: @icon-size + @margin-small; + border: 1px solid transparent; + } + // the toggle element - a.nav { + div.nav a { .display-flex(); .align-items(); @@ -156,6 +162,11 @@ color: @ini_nav_menu_hover_color; text-decoration: none; + // always show label, even with collapsed sidebar + position: absolute; + z-index: 100; + width: 100%; + span.ico { border-color: inherit; @@ -284,7 +295,6 @@ } } - /* + + + + + + + + + + + + + + + + + + + + + + + + + + */ /* max-width: 1439px */ diff --git a/css/base_structure.less b/css/base_structure.less index 83957ce..5a588b7 100755 --- a/css/base_structure.less +++ b/css/base_structure.less @@ -73,16 +73,7 @@ z-index: 900; } - .tools .row > .col-xs-12 { - z-index: 1; - } - - .header .row > .col-xs-12 { - z-index: 2; - } - .content .row > .col-xs-12 { - z-index: 3; border-radius: 0 @ini_default_border_radius @fix_border-radius @fix_border-radius; // @ini_default_border_radius vs. @fix_border-radius } diff --git a/js/sidebar.js b/js/sidebar.js index d0811b7..73bcf83 100644 --- a/js/sidebar.js +++ b/js/sidebar.js @@ -48,10 +48,10 @@ jQuery(function () { /** * Toggle a navigation panel * - * @param {jQuery} $toggler The h6 toggler + * @param {jQuery} $toggler The a toggler */ toggleNav = function ($toggler) { - var $panel = $toggler.next('div.nav-panel'); + var $panel = $toggler.parent().next('div.nav-panel'); var isOpen = $panel.is(':visible'); // open sidebar on interaction setDefaultContent(); @@ -96,7 +96,6 @@ jQuery(function () { // make the new toggler var $toggler = jQuery('') - .addClass('nav') .attr('href', '#') .attr('role', 'heading') .attr('aria-level', '2') @@ -105,6 +104,7 @@ jQuery(function () { .prepend($icon) .data('index', index) ; + $toggler = jQuery('
').prepend($toggler); // wrap all following siblings til the next element in a wrapper var $wrap = jQuery('
') @@ -135,7 +135,7 @@ jQuery(function () { * Initialize the open/close toggling of menu entries */ initMenuHandling = function () { - $nav.on('click', 'a.nav', function (e) { + $nav.on('click', 'div.nav a', function (e) { toggleNav(jQuery(this)); e.preventDefault(); }); diff --git a/tpl/main-sidebar-nav.php b/tpl/main-sidebar-nav.php index 7998827..180a067 100644 --- a/tpl/main-sidebar-nav.php +++ b/tpl/main-sidebar-nav.php @@ -5,10 +5,10 @@