Skip to content

feat: use Navi for primary navigation#34

Draft
WybeBosch wants to merge 13 commits intomainfrom
feat/add-navi-for-navigation-menu
Draft

feat: use Navi for primary navigation#34
WybeBosch wants to merge 13 commits intomainfrom
feat/add-navi-for-navigation-menu

Conversation

@WybeBosch
Copy link
Contributor

@WybeBosch WybeBosch commented Jan 30, 2026

draft

  • ik heb meer input nodig. what todo met ACF. Ik wil namelijk acf voor menu gebruiken big button style net als noordwijk.
    maar ACF is niet opensource / free volgens mij.
  • ook moet ik even samen met lara kijken naar hoe we navi doen binnen nieuwe dialog mobile submenu
  • en yvette had het ook nog over iets met selectors checken. En over verplaatsen naar component.

@WybeBosch WybeBosch requested review from a team as code owners January 30, 2026 09:13
@WybeBosch WybeBosch marked this pull request as draft January 30, 2026 09:13
@foreach ($item->children as $child)
<li class="menu-item">
<a href="{{ $child->url }}" @class([
'group/child flex items-center px-6 py-3 text-left leading-snug text-inherit no-underline',
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Deze group/child mag weg?

@YvetteNikolov
Copy link
Contributor

Je moet nog:

  • Mobile menu omzetten
  • Footer bottom menu omzetten

{{ $item->label }}

@if ($item->children)
<i class="fa-light fa-chevron-down pl-2"></i>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hier kunnen we nu een SVG van maken! Net zoals in de search bar. Scheelt weer zo'n layout shift,

<a href="{{ $item->url }}" @class([
'relative flex h-full items-center px-2 text-center text-sm leading-snug text-black no-underline xl:px-4 xl:text-base xl:leading-snug hocus:text-primary',
'text-primary' => $item->active || $item->activeParent,
$item->classes,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

aria-current toevoegen als het active is. Check sowieso even of je nog andere aria attributen mist met acceptatie

Base automatically changed from develop to main February 2, 2026 08:49
@WybeBosch WybeBosch force-pushed the feat/add-navi-for-navigation-menu branch from cc012b8 to 3da8f63 Compare February 13, 2026 14:17
@github-actions
Copy link

Composer package changes
Prod Packages Operation Base Target
log1x/navi New - v3.1.1

@@ -1,13 +1,50 @@
@if (has_nav_menu('primary_navigation'))
@php
$menu = Navi::build('primary_navigation');
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ik weet niet waarom dit werkt, maar volgens de documentatie roep je eerst de static method make aan en vervolgens build. PHPStorm geeft momenteel aan dat Navi undefined is. Als je deze importeert krijg je de error dat build niet static is.

Uit de docs:

use Log1x\Navi\Navi;

$menu = Navi::make()->build('primary_navigation');


@if ($item->children)
<ul
class="sub-menu ease-base invisible absolute mb-0 min-w-48 -translate-y-3 list-none bg-white pl-0 opacity-0 shadow-md transition-all group-[.js-brave-show-sub-menu]:visible group-[.js-brave-show-sub-menu]:translate-y-0 group-[.js-brave-show-sub-menu]:opacity-100">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Zolang de JS ervoor zorgt dat aria-expanded bijgewerkt wordt bij alle mogelijke manieren om de uitklap te openen kunnen we de styling daar ook op baseren. group-[.js-brave-show-sub-menu] zou dan dus group-has-aria-expanded kunnen zijn. De toepassing van aria-attributen op dit soort componenten zal minder onderhevig zijn aan veranderingen dan class namen. Eventueel zou de groep nog een naam kunnen krijgen om iets duidelijker te maken om welke groep het gaat indien er meerdere zijn.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

Comments