mirror/advplyr.audiobookshelf-app
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf-app.git synced 2025-07-07 12:34:44 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Update:Move modal titles down to not overlap with ios status bar

Browse source
This commit is contained in:
advplyr 2024-01-01 12:24:41 -06:00
parent 2f8494b013
commit 6e57cb49c4
4 changed files with 14 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

17
components/modals/AutoSleepTimerRewindLengthModal.vue
View file

@ -1,27 +1,28 @@
<template> <template>
<modals-modal v-model="show" :width="200" height="100%"> <modals-modal v-model="show" :width="200" height="100%">
<template #outer> <template #outer>
<div class="absolute top-8 left-4 z-40"> <div class="absolute top-11 left-4 z-40">
<p class="text-white text-2xl truncate capitalize">{{ $strings.LabelAutoRewindTime }}</p> <p class="text-white text-2xl truncate capitalize">{{ $strings.LabelAutoRewindTime }}</p>
</div> </div>
</template> </template>
<div <div class="w-full h-full overflow-hidden absolute top-0 left-0 flex items-center justify-center" @click="
class="w-full h-full overflow-hidden absolute top-0 left-0 flex items-center justify-center"
@click="
show = false show = false
manualTimerModal = false manualTimerModal = false
" ">
>
<div class="w-full overflow-x-hidden overflow-y-auto bg-primary rounded-lg border border-white border-opacity-20" style="max-height: 75%" @click.stop> <div class="w-full overflow-x-hidden overflow-y-auto bg-primary rounded-lg border border-white border-opacity-20" style="max-height: 75%" @click.stop>
<div v-if="manualTimerModal" class="p-4"> <div v-if="manualTimerModal" class="p-4">
<div class="flex mb-4" @click="manualTimerModal = false"> <div class="flex mb-4" @click="manualTimerModal = false">
<span class="material-icons text-3xl">arrow_back</span> <span class="material-icons text-3xl">arrow_back</span>
</div> </div>
<div class="flex my-2 justify-between"> <div class="flex my-2 justify-between">
<ui-btn @click="decreaseManualTimeout" class="w-9 h-9" :padding-x="0" small style="max-width: 36px"><span class="material-icons">remove</span></ui-btn> <ui-btn @click="decreaseManualTimeout" class="w-9 h-9" :padding-x="0" small style="max-width: 36px">
<span class="material-icons">remove</span>
</ui-btn>
<p class="text-2xl font-mono text-center">{{ manualTimeoutMin }} min</p> <p class="text-2xl font-mono text-center">{{ manualTimeoutMin }} min</p>
<ui-btn @click="increaseManualTimeout" class="w-9 h-9" :padding-x="0" small style="max-width: 36px"><span class="material-icons">add</span></ui-btn> <ui-btn @click="increaseManualTimeout" class="w-9 h-9" :padding-x="0" small style="max-width: 36px">
<span class="material-icons">add</span>
</ui-btn>
</div> </div>
<ui-btn @click="clickedOption(manualTimeoutMin)" class="w-full">{{ $strings.ButtonSetTimer }}</ui-btn> <ui-btn @click="clickedOption(manualTimeoutMin)" class="w-full">{{ $strings.ButtonSetTimer }}</ui-btn>
</div> </div>

10
components/modals/BookmarksModal.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<modals-modal v-model="show" :width="400" height="100%"> <modals-modal v-model="show" :width="400" height="100%">
<template #outer> <template #outer>
<div class="absolute top-8 left-4 z-40"> <div class="absolute top-11 left-4 z-40">
<p class="text-white text-2xl truncate">{{ $strings.LabelYourBookmarks }}</p> <p class="text-white text-2xl truncate">{{ $strings.LabelYourBookmarks }}</p>
</div> </div>
</template> </template>
@ -14,9 +14,7 @@
</div> </div>
<p class="text-xl pl-2">{{ selectedBookmark ? 'Edit Bookmark' : 'New Bookmark' }}</p> <p class="text-xl pl-2">{{ selectedBookmark ? 'Edit Bookmark' : 'New Bookmark' }}</p>
<div class="flex-grow" /> <div class="flex-grow" />
<p class="text-xl font-mono"> <p class="text-xl font-mono">{{ this.$secondsToTimestamp(currentTime) }}</p>
{{ this.$secondsToTimestamp(currentTime) }}
</p>
</div> </div>
<ui-text-input-with-label v-model="newBookmarkTitle" label="Note" /> <ui-text-input-with-label v-model="newBookmarkTitle" label="Note" />
@ -34,9 +32,7 @@
<div v-show="canCreateBookmark" class="flex px-4 py-2 items-center text-center justify-between border-b border-fg/10 bg-success cursor-pointer text-white text-opacity-80" @click.stop="createBookmark"> <div v-show="canCreateBookmark" class="flex px-4 py-2 items-center text-center justify-between border-b border-fg/10 bg-success cursor-pointer text-white text-opacity-80" @click.stop="createBookmark">
<span class="material-icons">add</span> <span class="material-icons">add</span>
<p class="text-base pl-2">{{ $strings.ButtonCreateBookmark }}</p> <p class="text-base pl-2">{{ $strings.ButtonCreateBookmark }}</p>
<p class="text-sm font-mono"> <p class="text-sm font-mono">{{ this.$secondsToTimestamp(currentTime) }}</p>
{{ this.$secondsToTimestamp(currentTime) }}
</p>
</div> </div>
</div> </div>
</div> </div>

2
components/modals/ItemDetailsModal.vue
View file

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

2
components/modals/LibrariesModal.vue
View file

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