<nav class="navbar navbar--simple __js-root"> <ui-app inline-template> <ui-navbar inline-template> <div> <div class="container container--wide navbar__content" :class="{'navbar__content--initialized': true}"> <div class="navbar__brand my-4 flex items-center lg:pr-8 lg:my-0"> <a href="#"> <img src="/images/logo-round-white.svg" class="w-8" /> </a> <span class="pl-4 font-bold text-xl lg:border-r lg:border-grey-300 lg:pr-8">Celostátní fórum 2021</span> </div> <div class="navbar__menutoggle my-4 flex justify-end lg:hidden"> <a href="#" @click="show = !show" class="no-underline hover:no-underline"> <i class="ico--menu text-3xl"></i> </a> </div> <div v-if="show || isLgScreenSize" class="navbar__main navbar__section navbar__section--expandable container-padding--zero lg:container-padding--auto"> <ul class="navbar-menu text-white"> <li class="navbar-menu__item"> <a href="#" data-href="{{ link.templates-homepage }}" class="navbar-menu__link">Hlavní strana</a> </li> <li class="navbar-menu__item"> <ui-navbar-subitem label="Lidé"> <ul class="navbar-menu__submenu"> <li><a href="#" data-href="{{ link.templates-people }}" class="navbar-menu__link">Delší link co je delší než hlavní menu položka</a></li> </ul> </ui-navbar-subtitem> </li> <li class="navbar-menu__item"> <a href="#" data-href="{{ link.templates-pirate-center }}" class="navbar-menu__link">Pirátské centrum</a> </li> <li class="navbar-menu__item"> <a href="#" data-href="{{ link.templates-contact }}" class="navbar-menu__link">Kontakt</a> </li> </ul> </div> </div> </div> </ui-navbar> </ui-app> </nav>