feat: add tooltip by icon only sidebar navi

Signed-off-by: Stefan Dej <meteyou@gmail.com>
This commit is contained in:
Stefan Dej 2021-12-26 00:29:41 +01:00
parent 81a7289194
commit d91e3a64ba
No known key found for this signature in database
GPG Key ID: 5D3A5823133D2246

View File

@ -34,33 +34,47 @@
<v-list class="pr-0 pt-0 ml-0">
<v-list-item-group active-class="active-nav-item">
<template v-if="countPrinters">
<v-list-item
router to="/allPrinters"
class="small-list-item mt-1"
>
<v-list-item-icon class="my-3 mr-3 menu-item-icon">
<v-icon>mdi-view-dashboard-outline</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title tile class="menu-item-title">{{ $t("App.Printers")}}</v-list-item-title>
</v-list-item-content>
<v-tooltip right>
<template v-slot:activator="{ on, attrs }">
<v-list-item
router to="/allPrinters"
class="small-list-item mt-1"
v-bind="attrs"
v-on="on"
>
<v-list-item-icon class="my-3 mr-3 menu-item-icon">
<v-icon>mdi-view-dashboard-outline</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title tile class="menu-item-title">{{ $t("App.Printers") }}</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list-item>
</template>
<span v-if="navigationStyle === 'iconsOnly'">{{ $t("App.Printers") }}</span>
</v-tooltip>
<v-divider class="my-1"></v-divider>
</template>
<div v-for="(category, index) in naviPoints" :key="index">
<v-list-item
router :to="category.path"
v-if="showInNavi(category)"
class="small-list-item"
>
<v-list-item-icon class="my-3 mr-3 menu-item-icon">
<v-icon>mdi-{{ category.icon }}</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title tile class="menu-item-title">{{ $t(`Router.${category.title}`) }}</v-list-item-title>
</v-list-item-content>
</v-list-item>
<div v-for="(category, index) in naviPoints" :key="index">
<v-tooltip right :open-delay="500">
<template v-slot:activator="{ on, attrs }">
<v-list-item
router :to="category.path"
v-if="showInNavi(category)"
class="small-list-item"
v-bind="attrs"
v-on="on"
>
<v-list-item-icon class="my-3 mr-3 menu-item-icon">
<v-icon>mdi-{{ category.icon }}</v-icon>
</v-list-item-icon>
<v-list-item-content>
<v-list-item-title tile class="menu-item-title">{{ $t(`Router.${category.title}`) }}</v-list-item-title>
</v-list-item-content>
</v-list-item>
</template>
<span v-if="navigationStyle === 'iconsOnly'">{{ $t(`Router.${category.title}`) }}</span>
</v-tooltip>
</div>
</v-list-item-group>
</v-list>