knoonrx/index.php

## index.php
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo( 'charset' ); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php bloginfo('name') ?></title>
    <link type="text/css" rel="stylesheet" href="<?= get_template_directory_uri(); ?>/css/materialize.min.css"  media="screen,projection">
    <link type="text/css" rel="stylesheet" href="<?= get_template_directory_uri(); ?>/style.css">

    <style>
        nav .sub-menu {
            position: absolute;
            min-width: 115px;
            display: none;
            transition: all .3s;
            background-color: #ee6e73;
            z-index: 1;
        }
        nav .sub-menu li {
            white-space: nowrap;

            float: none;
        }
        li.menu-item-has-children:hover > .sub-menu {
            display: block;
        }
    </style>

</head>
<header>
    <nav id="site-navigation" class="main-navigation" role="navigation">
        <div class="nav-wrapper">
            <div class="container">
                <a href="#" class="brand-logo">Logo</a>
                <a href="#" data-activates="mobile-nav" class="button-collapse"><i class="mdi-navigation-menu"></i></a>
                <?php
                $menu = [ // mobile side menu array
                    'menu_class'     => 'menu side-nav',
                    'menu_id'        => 'mobile-nav',
                    'items_wrap'     => '<ul id="%1$s" class="%2$s"><li class="mobile-header"><p>Menu</p></li>%3$s</ul><div class="clear"></div>',
                ];
                wp_nav_menu( $menu ); // mobile side menu

                $menu = [ // desktop menu array
                    'menu_class' => 'right hide-on-med-and-down'
                ];
                wp_nav_menu( $menu ); // desktop menu
                ?>
            </div>

        </div>
    </nav><!-- #site-navigation -->
    <div class="clear"></div>
</header>

<br>
<br>

<body>
<!--Import jQuery before materialize.js-->
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="<?= get_template_directory_uri(); ?>/js/materialize.min.js"></script>
<script>
    $(document).ready(function () {
        $(".button-collapse").sideNav();
    });
</script>
</body>
</html>
	<!DOCTYPE html>
	<html <?php language_attributes(); ?>>
	<head>
	<meta charset="<?php bloginfo( 'charset' ); ?>">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title><?php bloginfo('name') ?></title>
	<link type="text/css" rel="stylesheet" href="<?= get_template_directory_uri(); ?>/css/materialize.min.css" media="screen,projection">
	<link type="text/css" rel="stylesheet" href="<?= get_template_directory_uri(); ?>/style.css">

	<style>
	nav .sub-menu {
	position: absolute;
	min-width: 115px;
	display: none;
	transition: all .3s;
	background-color: #ee6e73;
	z-index: 1;
	}
	nav .sub-menu li {
	white-space: nowrap;

	float: none;
	}
	li.menu-item-has-children:hover > .sub-menu {
	display: block;
	}
	</style>

	</head>
	<header>
	<nav id="site-navigation" class="main-navigation" role="navigation">
	<div class="nav-wrapper">
	<div class="container">
	<a href="#" class="brand-logo">Logo</a>
	<a href="#" data-activates="mobile-nav" class="button-collapse"><i class="mdi-navigation-menu"></i></a>
	<?php
	$menu = [ // mobile side menu array
	'menu_class' => 'menu side-nav',
	'menu_id' => 'mobile-nav',
	'items_wrap' => '<ul id="%1$s" class="%2$s"><li class="mobile-header"><p>Menu</p></li>%3$s</ul><div class="clear"></div>',
	];
	wp_nav_menu( $menu ); // mobile side menu

	$menu = [ // desktop menu array
	'menu_class' => 'right hide-on-med-and-down'
	];
	wp_nav_menu( $menu ); // desktop menu
	?>
	</div>

	</div>
	</nav><!-- #site-navigation -->
	<div class="clear"></div>
	</header>

	<br>
	<br>

	<body>
	<!--Import jQuery before materialize.js-->
	<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
	<script type="text/javascript" src="<?= get_template_directory_uri(); ?>/js/materialize.min.js"></script>
	<script>
	$(document).ready(function () {
	$(".button-collapse").sideNav();
	});
	</script>
	</body>
	</html>