added svg-names to sidebar icons

This commit is contained in:
booploops 2022-06-28 22:40:06 -07:00
parent f4006b6189
commit 225a0bfa42
5 changed files with 20 additions and 6 deletions

View file

@ -68,6 +68,10 @@ Vue.component("sidebar-library-item", {
required: false,
default: "",
},
svgIconName: {
type: String,
required: false
},
cdClick: {
type: Function,
required: false,

View file

@ -198,13 +198,13 @@
</div>
<div class="app-chrome-item" v-else>
<div class="top-nav-group">
<sidebar-library-item :name="$root.getLz('home.title')" svg-icon="./assets/feather/home.svg" page="home">
<sidebar-library-item :name="$root.getLz('home.title')" svg-icon="./assets/feather/home.svg" svg-icon-name="home" page="home">
</sidebar-library-item>
<sidebar-library-item :name="$root.getLz('term.listenNow')" svg-icon="./assets/feather/play-circle.svg"
<sidebar-library-item :name="$root.getLz('term.listenNow')" svg-icon="./assets/feather/play-circle.svg" svg-icon-name="listenNow"
page="listen_now"></sidebar-library-item>
<sidebar-library-item :name="$root.getLz('term.browse')" svg-icon="./assets/feather/globe.svg" page="browse">
<sidebar-library-item :name="$root.getLz('term.browse')" svg-icon="./assets/feather/globe.svg" svg-icon-name="browse" page="browse">
</sidebar-library-item>
<sidebar-library-item :name="$root.getLz('term.radio')" svg-icon="./assets/feather/radio.svg" page="radio">
<sidebar-library-item :name="$root.getLz('term.radio')" svg-icon="./assets/feather/radio.svg" svg-icon-name="radio" page="radio">
</sidebar-library-item>
</div>
</div>

View file

@ -51,6 +51,7 @@
<sidebar-library-item
:name="$root.getLz('home.title')"
svg-icon="./assets/feather/home.svg"
svg-icon-name="home"
page="home"
>
</sidebar-library-item>
@ -67,17 +68,20 @@
<sidebar-library-item
:name="$root.getLz('term.listenNow')"
svg-icon="./assets/feather/play-circle.svg"
svg-icon-name="listenNow"
page="listen_now"
></sidebar-library-item>
<sidebar-library-item
:name="$root.getLz('term.browse')"
svg-icon="./assets/feather/globe.svg"
svg-icon-name="browse"
page="browse"
>
</sidebar-library-item>
<sidebar-library-item
:name="$root.getLz('term.radio')"
svg-icon="./assets/feather/radio.svg"
svg-icon-name="radio"
page="radio"
></sidebar-library-item>
</template>
@ -94,36 +98,42 @@
<sidebar-library-item
:name="$root.getLz('term.recentlyAdded')"
svg-icon="./assets/feather/plus-circle.svg"
svg-icon-name="recentlyAdded"
v-if="cfg.general.sidebarItems.recentlyAdded"
page="library-recentlyadded"
></sidebar-library-item>
<sidebar-library-item
:name="$root.getLz('term.songs')"
svg-icon="./assets/feather/music.svg"
svg-icon-name="songs"
v-if="cfg.general.sidebarItems.songs"
page="library-songs"
></sidebar-library-item>
<sidebar-library-item
:name="$root.getLz('term.albums')"
svg-icon="./assets/feather/disc.svg"
svg-icon-name="albums"
v-if="cfg.general.sidebarItems.albums"
page="library-albums"
></sidebar-library-item>
<sidebar-library-item
:name="$root.getLz('term.artists')"
svg-icon="./assets/feather/user.svg"
svg-icon-name="artists"
v-if="cfg.general.sidebarItems.artists"
page="library-artists"
></sidebar-library-item>
<sidebar-library-item
:name="$root.getLz('term.videos')"
svg-icon="./assets/feather/video.svg"
svg-icon-name="videos"
v-if="cfg.general.sidebarItems.videos"
page="library-videos"
></sidebar-library-item>
<sidebar-library-item
:name="$root.getLz('term.podcasts')"
svg-icon="./assets/feather/mic.svg"
svg-icon-name="podcasts"
v-if="cfg.general.sidebarItems.podcasts"
page="podcasts"
>

View file

@ -9,7 +9,7 @@
:href="item.href"
@click='clickEvent()'>
<template v-if="!renaming">
<svg-icon :url="icon"/> {{ item.attributes.name }}
<svg-icon :url="icon" name="sidebar-playlist"/> {{ item.attributes.name }}
<small class="presentNotice" v-if="hasRelatedMediaItems">(Track present)</small>
</template>
<input type="text" v-model="item.attributes.name" class="pl-rename-field" @blur="rename()" @keydown.enter="rename()" v-else>

View file

@ -123,7 +123,7 @@
<script type="text/x-template" id="sidebar-library-item">
<button class="app-sidebar-item"
:class="$parent.getSidebarItemClass(page)" @click="$root.setWindowHash(page)">
<svg-icon :url="svgIconData" v-if="svgIconData != ''" />
<svg-icon :url="svgIconData" :name="'sidebar-' + svgIconName" v-if="svgIconData != ''" />
<span class="sidebar-item-text">{{ name }}</span>
</button>
</script>