{{define "theme-default/menu"}}
<div id="app">
<div class="ui large top fixed menu nb-menu" style="z-index:9999999;">
    <div class="ui container">
        <a class="item" href="/">
            <img src="/static/logo.svg?v20210804">
        </a>
        <a class='item' href="/"><i class="home icon"></i>{{tr "Home"}}</a>
        <template v-if="isMobile"> 
            <div class="item ui simple dropdown">
                <div class="text"><i class="bi bi-gear-wide-connected icon" style="margin-right:3px;"></i>{{tr "Feature" }}<i class="dropdown icon" style="margin-right:0px;"></i></div>
                <div class="menu">
                    <a href="/service" class="item"><i class="rss icon"></i>{{tr "Services" }}</a>
                    <a href="/network" class="item"><i class="bi bi-hdd-network icon"></i>{{tr "NetworkSpiter"}}</a>
                </div>
            </div>
        </template>
        <template v-else>
            <a href="/service" class='item'><i class="rss icon"></i>{{tr "Services" }}</a>
            <a href="/network" class="item"><i class="bi bi-hdd-network icon"></i>{{tr "NetworkSpiter"}}</a>
        </template>
        {{ if not .Conf.DisableSwitchTemplateInFrontend }}        
            <div class="item ui simple dropdown">
                <div class="text"><i class="bi bi-incognito icon" style="margin-right:3px;"></i>{{tr "Template" }}<i class="dropdown icon" style="margin-right:0px;"></i></div>
                <div class="menu"> 
                    <a v-for="(item, index) in adaptedTemplates" :key="index" @click="toggleTemplate(item.key)" class="item">
                        <i :class="item.icon + ' icon'"></i>@#item.name#@
                        <i class="check icon" v-if="preferredTemplate === item.key"></i>
                    </a>
                    <a v-if="defaultTemplate === 'custom'" @click="toggleTemplate('custom')" class="item">
                        <i class="expand icon"></i>Custom
                    </a>
                </div>
            </div>
        {{ end }}
        {{if .Admin}}
        <div class="item right item-right ui simple dropdown">
            <div class="text">
                <i class="user icon" style="margin-right:3px"></i>{{.Admin.Name}}
                <i class="dropdown icon"></i>
            </div>
            <div class="menu">
                <a class="item" href="/server"><i class="terminal icon"></i>{{tr "AdminPanel"}}</a>
                <a class="item" @click="logOut({{.Admin.ID}})"><i class="logout icon"></i>{{tr "Logout"}}</a>
            </div>
        </div>
        {{else}}
        <a href="/login" class="item right item-right" style="padding-right:1.2rem"><i class="sign-in icon"></i>{{tr "Login"}}</a>
        {{end}}
    </div>
</div>
{{template "component/confirm" .}}
{{end}}