diff options
| -rw-r--r-- | resources/assets/javascripts/bootstrap/header_navigation.js | 11 | ||||
| -rw-r--r-- | resources/assets/javascripts/bootstrap/studip_helper_attributes.js | 16 | ||||
| -rw-r--r-- | resources/assets/stylesheets/scss/navigation.scss | 4 | ||||
| -rw-r--r-- | templates/header.php | 8 |
4 files changed, 14 insertions, 25 deletions
diff --git a/resources/assets/javascripts/bootstrap/header_navigation.js b/resources/assets/javascripts/bootstrap/header_navigation.js index f7f6e89..9b80619 100644 --- a/resources/assets/javascripts/bootstrap/header_navigation.js +++ b/resources/assets/javascripts/bootstrap/header_navigation.js @@ -1,14 +1,3 @@ -document.addEventListener('click', (event) => { - if (!event.target.matches('#header-sink-toggle')) { - return; - } - - const sink = document.getElementById('header-sink'); - const list = sink.parentNode.querySelector('ul'); - sink.checked = !sink.checked; - list.setAttribute('aria-expanded', sink.checked ? 'true' : 'false'); -}); - // Hide sink on touch elsewhere $(document).on('touchstart', function (event) { if ($(event.target).closest('li.overflow').length === 0) { diff --git a/resources/assets/javascripts/bootstrap/studip_helper_attributes.js b/resources/assets/javascripts/bootstrap/studip_helper_attributes.js index 54f8da3..0ea34bf 100644 --- a/resources/assets/javascripts/bootstrap/studip_helper_attributes.js +++ b/resources/assets/javascripts/bootstrap/studip_helper_attributes.js @@ -298,24 +298,24 @@ $(document).on('keydown', '.enter-accessible', function(event) { $(document).on('click keydown', '[data-toggles]', function (event) { if ((event.type === 'keydown' && event.key === 'Enter') || event.type === 'click') { - const target = event.currentTarget.dataset.toggles; - //Check if the target is a checkbox. These have to be toggled differently than - //other elements: + const target = this.dataset.toggles; + // Check if the target is a checkbox. These have to be toggled differently than + // other elements: if ($(target).is(':checkbox')) { - //Toggle the checked state of the checkbox: + // Toggle the checked state of the checkbox: $(target).prop('checked', !$(target).prop('checked')); } else { - //Do the normal toggle operation: + // Do the normal toggle operation: $(target).toggle(); } - const controls = $(event.currentTarget).attr('aria-controls'); + const controls = $(this).attr('aria-controls'); if (controls) { // Find elements which control the expanded status of the same element. const elements = $('[aria-controls="' + controls + '"]'); - const expanded = $(event.currentTarget).attr('aria-expanded') === 'true'; + const expanded = $(this).attr('aria-expanded') === 'true'; // Set the aria-expanded status accordingly. - elements.attr('aria-expanded', !expanded); + elements.attr('aria-expanded', expanded ? 'false' : 'true'); } event.preventDefault(); diff --git a/resources/assets/stylesheets/scss/navigation.scss b/resources/assets/stylesheets/scss/navigation.scss index 59b7daa..87b3cd3 100644 --- a/resources/assets/stylesheets/scss/navigation.scss +++ b/resources/assets/stylesheets/scss/navigation.scss @@ -137,10 +137,6 @@ body:not(.fixed) #navigation-level-1-items { transition: opacity var(--transition-duration); } - &::after { - - } - // Display menu on activation &:hover button.as-link, input[type="checkbox"]:checked { diff --git a/templates/header.php b/templates/header.php index 275fc1f..cb16a6c 100644 --- a/templates/header.php +++ b/templates/header.php @@ -218,7 +218,11 @@ if ($navigation) { <? endforeach; ?> <li class="overflow"> <input type="checkbox" id="header-sink"> - <button class="as-link" aria-controls="header-sink" id="header-sink-toggle"> + <button class="as-link" + aria-controls="header-sink-list" + aria-expanded="false" + data-toggles="#header-sink" + > <?= Icon::create('action', 'navigation')->asImg(32, [ 'class' => 'headericon original', 'title' => '', @@ -229,7 +233,7 @@ if ($navigation) { </div> </button> - <ul aria-expanded="false"> + <ul id="header-sink-list"> <? foreach ($header_nav['hidden'] as $path => $nav) : ?> <?= $this->render_partial( 'header-navigation-item.php', |