Update:Increased padding on modals

This commit is contained in:
advplyr 2023-02-26 14:41:18 -06:00
parent da442f4a17
commit 02089e1489
14 changed files with 19 additions and 19 deletions

View file

@ -1,7 +1,7 @@
<template>
<modals-modal v-model="show" :width="300" height="100%">
<template #outer>
<div class="absolute top-5 left-4 z-40">
<div class="absolute top-8 left-4 z-40">
<p class="text-white text-2xl truncate">Bookmarks</p>
</div>
</template>

View file

@ -1,7 +1,7 @@
<template>
<modals-modal v-model="show" :width="350" height="100%">
<template #outer>
<div v-if="currentChapter" class="absolute top-7 left-4 z-40" style="max-width: 80%">
<div v-if="currentChapter" class="absolute top-8 left-4 z-40 pt-0.5" style="max-width: 80%">
<p class="text-white text-lg truncate">Current: {{ currentChapterTitle }}</p>
</div>
</template>

View file

@ -1,8 +1,8 @@
<template>
<modals-modal v-model="show" :width="300" height="100%">
<template #outer>
<div v-if="title" class="absolute top-7 left-4 z-40" style="max-width: 80%">
<p class="text-white text-lg truncate">{{ title }}</p>
<div v-if="title" class="absolute top-8 left-4 z-40" style="max-width: 80%">
<p class="text-white text-xl truncate">{{ title }}</p>
</div>
</template>

View file

@ -1,7 +1,7 @@
<template>
<modals-modal v-model="show" width="90%" height="100%">
<template #outer>
<div v-show="selected !== 'all'" class="absolute top-4 left-4 z-40">
<div v-show="selected !== 'all'" class="absolute top-6 left-4 z-40">
<ui-btn class="text-xl border-yellow-400 border-opacity-40" @click="clearSelected">Clear</ui-btn>
</div>
</template>

View file

@ -1,7 +1,7 @@
<template>
<modals-modal v-model="show" :width="400" height="100%">
<template #outer>
<div class="absolute top-5 left-4 z-40">
<div class="absolute top-8 left-4 z-40">
<p class="text-white text-2xl truncate">Details</p>
</div>
</template>

View file

@ -1,7 +1,7 @@
<template>
<modals-modal v-model="show" :width="300" :processing="processing" height="100%">
<template #outer>
<div class="absolute top-4 left-4 z-40" style="max-width: 80%">
<div class="absolute top-8 left-4 z-40" style="max-width: 80%">
<p class="text-white text-2xl truncate">Libraries</p>
</div>
</template>

View file

@ -2,7 +2,7 @@
<div ref="wrapper" class="modal modal-bg w-full h-full max-h-screen fixed top-0 left-0 bg-primary bg-opacity-75 flex items-center justify-center z-50 opacity-0">
<div class="absolute top-0 left-0 w-full h-40 bg-gradient-to-b from-black to-transparent opacity-90 pointer-events-none" />
<div class="absolute z-40 top-4 right-4 h-12 w-12 flex items-center justify-center cursor-pointer text-white hover:text-gray-300" @click="show = false">
<div class="absolute z-40 top-6 right-4 h-12 w-12 flex items-center justify-center cursor-pointer text-white hover:text-gray-300" @click="show = false">
<span class="material-icons text-4xl">close</span>
</div>
<slot name="outer" />

View file

@ -1,7 +1,7 @@
<template>
<modals-modal v-model="show" @input="modalInput" :width="200" height="100%">
<template #outer>
<div class="absolute top-5 left-4 z-40">
<div class="absolute top-8 left-4 z-40">
<p class="text-white text-2xl truncate">Playback Speed</p>
</div>
</template>

View file

@ -1,7 +1,7 @@
<template>
<modals-modal v-model="show" width="100%" height="100%" max-width="100%">
<template #outer>
<div class="absolute top-6 left-4 z-40">
<div class="absolute top-8 left-4 z-40">
<p class="text-white text-2xl truncate">Feed Episodes</p>
</div>
</template>
@ -22,7 +22,7 @@
</div>
</template>
</div>
<div class="absolute bottom-0 left-0 w-full flex items-center" style="height: 50px">
<div class="absolute bottom-6 left-0 w-full flex items-center" style="height: 50px">
<ui-btn class="w-full" :disabled="!episodesSelected.length" color="success" @click.stop="downloadEpisodes">{{ episodesSelected.length ? `Add ${episodesSelected.length} Episode(s) to Server` : 'No Episodes Selected' }}</ui-btn>
</div>
</div>
@ -130,8 +130,8 @@ export default {
<style>
.feed-content {
height: calc(100vh - 125px);
max-height: calc(100vh - 125px);
margin-top: 20px;
height: calc(100vh - 150px);
max-height: calc(100vh - 150px);
margin-top: 5px;
}
</style>

View file

@ -1,7 +1,7 @@
<template>
<modals-modal v-model="show" :width="300" height="100%">
<template #outer>
<div class="absolute top-7 left-4 z-40" style="max-width: 80%">
<div class="absolute top-8 left-4 z-40" style="max-width: 80%">
<p class="text-white text-lg truncate">Select Local Folder</p>
</div>
</template>

View file

@ -1,7 +1,7 @@
<template>
<modals-modal v-model="show" :width="200" height="100%">
<template #outer>
<div class="absolute top-5 left-4 z-40">
<div class="absolute top-8 left-4 z-40">
<p class="text-white text-2xl truncate">Sleep Timer</p>
</div>
</template>

View file

@ -1,7 +1,7 @@
<template>
<modals-modal v-model="show" :width="200" height="100%">
<template #outer>
<div class="absolute top-5 left-4 z-40">
<div class="absolute top-8 left-4 z-40">
<p class="text-white text-2xl truncate">Sleep Timer</p>
</div>
</template>

View file

@ -1,7 +1,7 @@
<template>
<modals-modal v-model="show" :width="360" height="100%" :processing="processing">
<template #outer>
<div class="absolute top-5 left-4 z-40">
<div class="absolute top-8 left-4 z-40">
<p class="text-white text-2xl truncate">Add to Playlist</p>
</div>
</template>

View file

@ -53,7 +53,7 @@ class AbsAudioPlayerWeb extends WebPlugin {
var playbackSession = await $axios.$post(route, { mediaPlayer: 'html5-mobile', forceDirectPlay: true })
if (playbackSession) {
if (startTime !== undefined && startTime !== null) playbackSession.currentTime = startTime
this.setAudioPlayer(playbackSession, true)
this.setAudioPlayer(playbackSession, playWhenReady)
}
}
return false