Refactor header nav structure with nav-links/nav-cta and active aria-current
This commit is contained in:
parent
af5e458eda
commit
733f67fb41
1 changed files with 11 additions and 7 deletions
|
|
@ -16,13 +16,17 @@
|
|||
</button>
|
||||
|
||||
<nav class="site-nav" id="siteNav" aria-label="Primary navigation">
|
||||
<div class="nav-links">
|
||||
<% (config?.nav || []).forEach(item => {
|
||||
const itemPage = item.href === '/' ? 'home' : item.href.replace(/^\//, '').toLowerCase();
|
||||
const active = pageName === itemPage;
|
||||
%>
|
||||
<a href="<%= item.href %>" class="<%= active ? 'active' : '' %>"><%= item.label %></a>
|
||||
<a href="<%= item.href %>" class="<%= active ? 'active' : '' %>" <%= active ? 'aria-current="page"' : '' %>><%= item.label %></a>
|
||||
<% }) %>
|
||||
</div>
|
||||
<div class="nav-cta">
|
||||
<a href="/contact" class="btn btn-primary">Contact</a>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
|
|
|||
Loading…
Reference in a new issue