Merge branch 'sidebar' into details

* sidebar:
  use a instead of h6 in navigation
  make sidebar headers toggable via keyboard
This commit is contained in:
Andreas Gohr 2017-02-22 13:57:26 +01:00
commit 560d730c9c
3 changed files with 31 additions and 28 deletions

View file

@ -11,7 +11,10 @@
margin-left: @menu-margin; // moves *all* sidebar content to the right margin-left: @menu-margin; // moves *all* sidebar content to the right
// the toggle element // the toggle element
h6 { a.nav {
font-size: @font-size-head6;
margin: 0 0 @font-size-head6;
cursor: pointer; cursor: pointer;
font-weight: normal; font-weight: normal;
margin-left: (@menu-margin * -1); // moves the toggles back to the left margin-left: (@menu-margin * -1); // moves the toggles back to the left

View file

@ -74,7 +74,9 @@ jQuery(function () {
} }
// make the new toggler // make the new toggler
const $toggler = jQuery('<h6>') const $toggler = jQuery('<a>')
.addClass('nav')
.attr('href', '#')
.attr('role', 'heading') .attr('role', 'heading')
.attr('aria-level', '2') .attr('aria-level', '2')
.text(text) .text(text)
@ -102,8 +104,9 @@ jQuery(function () {
* Initialize the open/close toggling of menu entries * Initialize the open/close toggling of menu entries
*/ */
const initMenuHandling = function () { const initMenuHandling = function () {
$nav.on('click', 'h6', function () { $nav.on('click', 'a', function (e) {
toggleNav(jQuery(this)); toggleNav(jQuery(this));
e.preventDefault();
}); });
}; };

View file

@ -4,12 +4,11 @@
?> ?>
</nav> </nav>
<nav class="nav-sitetools"> <nav class="nav-sitetools">
<h6 role="heading" aria-level="2"> <a class="nav" role="heading" aria-level="2">
<span class="ico"><?php echo inlineSVG(__DIR__ . '/../img/sitemap.svg') ?></span> <span class="ico"><?php echo inlineSVG(__DIR__ . '/../img/sitemap.svg') ?></span>
<span class="lbl"><?php echo $lang['site_tools']; ?></span> <span class="lbl"><?php echo $lang['site_tools']; ?></span>
</h6> </a>
<div class="nav-panel level1"> <div class="nav-panel level1">
<ul> <ul>
<?php <?php
@ -28,10 +27,10 @@
<nav class="nav-usermenu"> <nav class="nav-usermenu">
<h6 role="heading" aria-level="2"> <a class="nav" role="heading" aria-level="2">
<span class="ico"><?php echo inlineSVG(__DIR__ . '/../img/account-settings.svg') ?></span> <span class="ico"><?php echo inlineSVG(__DIR__ . '/../img/account-settings.svg') ?></span>
<span class="lbl"><?php echo $lang['user_tools']; ?></span> <span class="lbl"><?php echo $lang['user_tools']; ?></span>
</h6> </>
<div class="nav-panel level1"> <div class="nav-panel level1">
<ul> <ul>
<?php /* dokuwiki user tools */ <?php /* dokuwiki user tools */
@ -51,24 +50,22 @@
<?php if($conf['breadcrumbs']): ?> <?php if($conf['breadcrumbs']): ?>
<nav class="nav-trace"> <a class="nav" role="heading" aria-level="2">
<h6 role="heading" aria-level="2"> <span class="ico"><?php echo inlineSVG(__DIR__ . '/../img/apple-safari.svg') ?></span>
<span class="ico"><?php echo inlineSVG(__DIR__ . '/../img/apple-safari.svg') ?></span> <span class="lbl"><?php echo tpl_getLang('head_menu_trace'); ?></span>
<span class="lbl"><?php echo tpl_getLang('head_menu_trace'); ?></span> </a>
</h6> <div class="nav-panel level1">
<div class="nav-panel level1"> <ul>
<ul> <?php /* trace breadcrumbs as list */
<?php /* trace breadcrumbs as list */ // FIXME move to helper class
// FIXME move to helper class $crumbs = breadcrumbs();
$crumbs = breadcrumbs(); $crumbs = array_reverse($crumbs, true);
$crumbs = array_reverse($crumbs, true); foreach($crumbs as $id => $name) {
foreach($crumbs as $id => $name) { echo '<li>';
echo '<li>'; tpl_link(wl($id), hsc($name), 'title="' . $id . '"');
tpl_link(wl($id), hsc($name), 'title="' . $id . '"'); echo '</li>';
echo '</li>'; }
} ?>
?> </ul>
</ul> </div>
</div>
</nav>
<?php endif ?> <?php endif ?>