starred/audiobookshelf-app
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf-app.git synced 2026-08-29 14:47:21 +02:00
Code Issues 454 Packages Projects Releases 10 Wiki Activity

Merge pull request #513 from lkiesow/player-menu-unified-style

Browse Source 
Make Player Menu Items Look Alike
This commit is contained in:
advplyr
2023-01-16 17:04:02 -06:00
committed by GitHub
parent acf85f4f09 d9afdaf56f
commit 29d022adcc
2 changed files with 4 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/app/AudioPlayer.vue
+3 -19
View File
@@ -99,24 +99,7 @@
</div> </div>
<modals-chapters-modal v-model="showChapterModal" :current-chapter="currentChapter" :chapters="chapters" @select="selectChapter" /> <modals-chapters-modal v-model="showChapterModal" :current-chapter="currentChapter" :chapters="chapters" @select="selectChapter" />
<modals-dialog v-model="showMoreMenuDialog" :items="menuItems" @action="clickMenuAction"> <modals-dialog v-model="showMoreMenuDialog" :items="menuItems" @action="clickMenuAction" />
<template v-slot:chapter_track="{ item }">
<li class="text-gray-50 select-none relative py-4 cursor-pointer hover:bg-black-400" role="option" @click="clickMenuAction(item.value)">
<div class="flex items-center px-3">
<span v-if="item.icon" class="material-icons-outlined text-xl mr-2 text-white text-opacity-80">{{ item.icon }}</span>
<span class="font-normal block truncate text-base text-white text-opacity-80">{{ item.text }}</span>
</div>
</li>
</template>
<template v-slot:lock="{ item }">
<li class="text-gray-50 select-none relative py-4 cursor-pointer hover:bg-black-400" role="option" @click="clickMenuAction(item.value)">
<div class="flex items-center px-3">
<span v-if="item.icon" class="material-icons-outlined text-xl mr-2 text-opacity-80" :class="{ 'text-red-500': lockUi, 'text-white': !lockUi }">{{ item.icon }}</span>
<span class="font-normal block truncate text-base text-white text-opacity-80">{{ item.text }}</span>
</div>
</li>
</template>
</modals-dialog>
</div> </div>
</template> </template>
@@ -190,7 +173,8 @@ export default {
if (this.$platform !== 'ios' && !this.isPodcast && this.mediaId) { if (this.$platform !== 'ios' && !this.isPodcast && this.mediaId) {
items.push({ items.push({
text: 'History', text: 'History',
value: 'history' value: 'history',
icon: 'history'
}) })
} }
components/modals/Dialog.vue
+1
View File
@@ -13,6 +13,7 @@
<slot :name="item.value" :item="item" :selected="item.value === selected"> <slot :name="item.value" :item="item" :selected="item.value === selected">
<li :key="item.value" class="text-gray-50 select-none relative py-4 cursor-pointer hover:bg-black-400" :class="selected === item.value ? 'bg-success bg-opacity-10' : ''" role="option" @click="clickedOption(item.value)"> <li :key="item.value" class="text-gray-50 select-none relative py-4 cursor-pointer hover:bg-black-400" :class="selected === item.value ? 'bg-success bg-opacity-10' : ''" role="option" @click="clickedOption(item.value)">
<div class="relative flex items-center px-3"> <div class="relative flex items-center px-3">
<span v-if="item.icon" class="material-icons-outlined text-xl mr-2 text-white text-opacity-80">{{ item.icon }}</span>
<p class="font-normal block truncate text-base text-white text-opacity-80">{{ item.text }}</p> <p class="font-normal block truncate text-base text-white text-opacity-80">{{ item.text }}</p>
</div> </div>
</li> </li>