hq/app/views/header.scala.html

<header class="main-header section" id="index-banner">
    <nav class="nav-extended">
        <div class="container">
            <div class="nav-wrapper hq-nav">
                <div class="hq-nav__header">
                    <a href="/">
                        <h2 class="header grey-text text-lighten-5">Security HQ</h2>
                    </a>
                </div>
                <div class="hq-nav__menu">
                    <a href="#" data-activates="mobile-nav" class="button-collapse"><i class="material-icons black-text">menu</i></a>
                    <ul class="main-nav hide-on-med-and-down">
                        <li class="main-nav--home">
                            <a class="tooltipped" data-tooltip="Home" href="/"><i class="material-icons black-text">home</i></a>
                        <li class="main-nav">
                            <a class="tooltipped" data-tooltip="Documentation" href="/documentation"><i class="material-icons black-text">description</i></a>
                        </li>
                    </ul>

                    <ul id="mobile-nav" class="side-nav">
                        <li class="main-nav--home">
                            <a href="/"><i class="material-icons black-text">home</i>Home</a>
                        </li>
                        <li class="main-nav">
                            <a href="/documentation"><i class="material-icons black-text">description</i>Documentation</a>
                        </li>
                    </ul>

                </div>
                <div class="hq-nav__image-wrapper">
                    <a href="/">
                        <img src='@routes.Assets.versioned("images/hq.png")' alt="Security HQ" class="hq-nav__image" />
                    </a>
                </div>
            </div>
        </div>
    </nav>
</header>