// TODO srcset / svg images
#app-menu.ui.top.fixed.menu
.header.item
img(src="~assets/header/png/logo@3x.png")
router-link.item(to="/", exact)
span(v-once) {{ $t('tasks') }}
// .simple makes it possible to have a dropdown without JS
.ui.simple.dropdown
router-link.item(to="/inventory", :class="{'active': $route.path.startsWith('/inventory')}")
span(v-once) {{ $t('inventory') }}
.menu
router-link.item(to="/inventory")
span(v-once) {{ $t('inventory') }}
router-link.item(to="/inventory/stable")
span(v-once) {{ $t('stable') }}
router-link.item(to="/inventory/equipment")
span(v-once) {{ $t('equipment') }}
router-link.item(to="/market")
span(v-once) {{ $t('market') }}
.ui.simple.dropdown
router-link.item(to="/social/tavern", :class="{'active': $route.path.startsWith('/social')}")
span(v-once) {{ $t('social') }}
.menu
router-link.item(to="/social/tavern")
span(v-once) {{ $t('tavern') }}
router-link.item(to="/social/inbox")
span(v-once) {{ $t('inbox') }}
router-link.item(to="/social/challenges")
span(v-once) {{ $t('challenges') }}
router-link.item(to="/social/party")
span(v-once) {{ $t('party') }}
router-link.item(to="/social/guilds")
span(v-once) {{ $t('guilds') }}
.ui.simple.dropdown
router-link.item(to="/help", :class="{'active': $route.path.startsWith('/help')}")
span(v-once) {{ $t('help') }}
.menu
router-link.item(to="/help/faq")
span(v-once) {{ $t('faq') }}
router-link.item(to="/help/report-bug")
span(v-once) {{ $t('reportBug') }}
router-link.item(to="/help/request-feature")
span(v-once) {{ $t('requestAF') }}
.right.menu
.item.with-img
img(src="~assets/header/png/gem@3x.png")
span {{userGems}}
.item.with-img.gp-icon
img(src="~assets/header/png/gold@3x.png")
span {{user.stats.gp | floor}}
a.item.with-img.notifications-dropdown
img(src="~assets/header/png/notifications@3x.png")
.ui.simple.dropdown.pointing
router-link.item.with-img.user-dropdown(to="/user/avatar")
// TODO icons should be white when active
img(src="~assets/header/png/user@3x.png")
.menu
.item.user-edit-avatar
strong {{user.profile.name}}
a(v-once) {{ $t('editAvatar') }}
.divider
router-link.item(to="/user/stats")
span(v-once) {{ $t('stats') }}
router-link.item(to="/user/achievements")
span(v-once) {{ $t('achievements') }}
.divider
router-link.item(to="/user/settings")
span(v-once) {{ $t('settings') }}
.divider
router-link.item(to="/logout")
span(v-once) {{ $t('logout') }}