Menú de navegacion

<?php

/*
 * Menú de navegaciion
 *
 *
 * */

$menu_class     = \Fantomas\Inc\Menus::get_instance();
$header_menu_id = $menu_class->get_menu_id( 'fantomas-header-menu' );
$header_menus   = wp_get_nav_menu_items( $header_menu_id );

?>

<nav  class="flex flex-col space-y-3 text-black">
    <div class="flex flex-row items-center justify-center bg-green-900">
    <?php
    $custom_logo_id = get_theme_mod( 'custom_logo' );
    $logo = wp_get_attachment_image_src( $custom_logo_id , 'thumbnail' );
        if ( has_custom_logo() ) {
            echo '<img class="w-10 m-3 rounded-full shadow shadow-slate-800" src="' . esc_url( $logo[0] ) . '" alt="' . get_bloginfo( 'name' ) . '">';
        } else {
            ?>
            <a class="text-3xl text-red-300 text-shadow-md block w-full text-center" href="<?php bloginfo( 'url' ); ?>"><?php bloginfo( 'name' ); ?></a>
            <?php
        }
    ?>
    </div>

    <!-- Menú -->

    <div class="relative space-y-7  divide-y divide-lime-400" x-data="{ open: false }" @mouseleave="open = false">
    <?php
    if ( ! empty( $header_menus ) && is_array( $header_menus ) ) {
        foreach ( $header_menus as $menu_item ) {
            if ( ! $menu_item->menu_item_parent ) {
                $child_menu_items   = $menu_class->get_child_menu_items( $header_menus, $menu_item->ID );
                $has_children       = ! empty( $child_menu_items ) && is_array( $child_menu_items );
                $has_sub_menu_class = ! empty( $has_children ) ? 'has-submenu' : '';
                $link_target        = ! empty( $menu_item->target ) && '_blank' === $menu_item->target ? '_blank' : '_self';

                if ( ! $has_children ) {
                    ?>
                    <a href="<?php echo esc_url( $menu_item->url ); ?>" class=" p-3 block shadow shadow-red-600 w-full text-justify text-xl bg-cyan-900 text-white text-shadow-md" target="<?php echo esc_attr( $link_target ); ?>" title="<?php echo esc_attr( $menu_item->title ); ?>" >
                    <span><?php echo esc_html( $menu_item->title ); ?></span>
                    </a>
                    <?php
                } else {
                    ?>
                    <a href="<?php echo esc_url( $menu_item->url ); ?>" @mouseover="open = true"  class="bg-cyan-900 flex items-center p-3 space-x-4 block shadow shadow-red-600 w-full text-justify text-xl text-white text-shadow-md" target="<?php echo esc_attr( $link_target ); ?>" title="<?php echo esc_attr( $menu_item->title ); ?>" >
                    <span ><?php echo esc_html( $menu_item->title ); ?></span>
                    <span > 🔻 </span>
                    </a>
                    <!--  &#43; -->
                    <!-- Dropdown -->
                    <div x-show="open" x-transition:enter.duration.500ms x-transition:leave.duration.800ms class="absolute left-0 mt-1  bg-white  shadow-md overflow-hidden text-xl">
                    <?php
                    foreach ( $child_menu_items as $child_menu_item ) {
                        $link_target = ! empty( $child_menu_item->target ) && '_blank' === $child_menu_item->target ? '_blank' : '_self';
                        ?>
                        <div class="border-t border-gray-200">
                        <a href="<?php echo esc_url( $child_menu_item->url ); ?>" class="block w-full p-3 text-justify bg-emerald-900  hover:bg-slate-700 hover:text-yellow-300 text-white text-shadow-md" target="<?php echo esc_attr( $link_target ); ?>" title="<?php echo esc_attr( $child_menu_item->title ); ?>">
                        <?php echo esc_html( $child_menu_item->title ); ?>
                        </a>

                        </div>
                        <?php
                    }
                    ?>
                    </div>
                    <?php

                }
            }
        }
    }

    ?>
    </div>