Creating menus

A menu is a field type, so you can attach it to any block you like. Most sites will have a site-header block which has a menu attached to it. The default block in Prodigy is a site-header block that looks like this:

site-header.yml

fields:
  logo:
    type: image

  menu:
    type: menu

site-header.blade.php

<nav class="flex items-center justify-between flex-wrap bg-teal-500 p-6">
    <div class="flex items-center flex-shrink-0 text-white mr-6">
        <img class="h-10 w-auto" src="{{ $block->getFirstMediaUrl('prodigy') }}" alt="">
    </div>
    <div class="block lg:hidden">
        <button class="flex items-center px-3 py-2 border rounded text-teal-200 border-teal-400 hover:text-white hover:border-white">
            <svg class="fill-current h-3 w-3" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><title>Menu</title>
                <path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"/>
            </svg>
        </button>
    </div>
    <div class="w-full block flex-grow lg:flex lg:items-center lg:w-auto">
        <div class="text-sm lg:flex-grow">
            @if(isset($content['menu']))
                @foreach($content['menu'] as $item)
                    <a href="{{ $item['url'] }}"
                       class="block mt-4 lg:inline-block lg:mt-0 text-teal-200 hover:text-white mr-4 {{ $item['css_classes'] ??'' }}">
                        {{ $item['title'] }}
                    </a>
                @endforeach
            @endif
        </div>
    </div>
</nav>

Once you have the forelse loop set, all you need to do is add the menu items.

At this moment, Prodigy's default menu field does not support nesting multiple levels, though it's on the roadmap.