dan/windycoys
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add keyboard interactions and focus trapping to Navigation

Browse Source
This commit is contained in:
Dan Head
2018-04-29 10:30:32 +01:00
parent 387d6a770e
commit db70a6cb06
6 changed files with 147 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
theme/functions.php
View File

@@ -5,8 +5,8 @@ class Windycoys_Walker extends Walker_Nav_Menu {
$title = $item->post_title;
$uri = get_site_url() . '/' . $item->post_name;
$output .= '<li class="Nav-listItem">';
$output .= '<a class="Nav-link" href="' . $uri .'">';
$output .= '<li class="Nav-listItem" role="none">';
$output .= '<a class="Nav-link" href="' . $uri .'" role="menuitem">';
$output .= $title . '</a></li>';
}
}

27
theme/partials/navigation.php
View File

@@ -6,18 +6,17 @@
<span class="Menu-text">Open menu</span>
</button>
<div class="Nav-content">
<h2 class="Nav-title">WindyCOYS</h2>
<ul class="Nav-list">
<li class="Nav-listItem">
<a class="Nav-link" href="<?php get_site_url() ?>/">Home</a>
<h2 class="Nav-title">
<a class="Nav-titleLink" href="<?php get_site_url() ?>/" aria-label="Navigation title" tabindex="-1">
WindyCOYS
</a>
</h2>
<ul class="Nav-list" role="menubar">
<li class="Nav-listItem" role="none">
<a class="Nav-link" href="<?php get_site_url() ?>/" role="menuitem">Home</a>
<?php windycoys_nav() ?>
</li>
</ul>
<button class="Nav-close">
<span class="Nav-closeBar"></span>
<span class="Nav-closeBar"></span>
<span class="Nav-closeText">Close menu</span>
</button>
<div class="Nav-social">
<a class="Nav-socialLink" href="https://www.facebook.com/WindyCOYS/">
<svg class="Icon Icon--large">
@@ -33,10 +32,10 @@
<div class="Nav-search">
<?php get_search_form() ?>
</div>
<button class="Nav-close">
<span class="Nav-closeBar"></span>
<span class="Nav-closeBar"></span>
<span class="Nav-closeText">Close menu</span>
</button>
</div>
<button class="Nav-close">
<span class="Nav-closeBar"></span>
<span class="Nav-closeBar"></span>
<span class="Nav-closeText">Close menu</span>
</button>
</nav>