mirror/advplyr.audiobookshelf-app
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf-app.git synced 2025-08-30 06:39:35 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update comic reader bottom page number bar to only show when top bar is showing #1485

Browse source
This commit is contained in:
advplyr 2025-03-05 17:49:20 -06:00
parent 6f01eafd30
commit 769ce0ade9
2 changed files with 9 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

17
components/readers/ComicReader.vue
View file

@ -23,7 +23,7 @@
</div> </div>
</div> </div>
<div class="fixed left-0 h-8 w-full bg-bg px-4 flex items-center text-fg-muted" :style="{ bottom: isPlayerOpen ? '120px' : '0px' }"> <div class="fixed left-0 h-8 w-full bg-bg px-4 flex items-center text-fg-muted transition-transform" :class="showingToolbar ? 'translate-y-0' : isPlayerOpen ? 'translate-y-[120px]' : 'translate-y-32'" :style="{ bottom: isPlayerOpen ? '120px' : '0px' }">
<div class="flex-grow" /> <div class="flex-grow" />
<p class="text-xs">{{ page }} / {{ numPages }}</p> <p class="text-xs">{{ page }} / {{ numPages }}</p>
</div> </div>
@ -49,7 +49,8 @@ export default {
default: () => {} default: () => {}
}, },
isLocal: Boolean, isLocal: Boolean,
keepProgress: Boolean keepProgress: Boolean,
showingToolbar: Boolean
}, },
data() { data() {
return { return {
@ -372,14 +373,12 @@ export default {
<style scoped> <style scoped>
#comic-reader { #comic-reader {
height: calc(100% - 36px); height: 100%;
max-height: calc(100% - 36px); max-height: 100%;
padding-top: 36px;
} }
.reader-player-open #comic-reader { .reader-player-open #comic-reader {
height: calc(100% - 156px); height: calc(100% - 120px);
max-height: calc(100% - 156px); max-height: calc(100% - 120px);
padding-top: 36px;
} }
.comicimg { .comicimg {
@ -390,4 +389,4 @@ export default {
width: 100vw; width: 100vw;
height: 100%; height: 100%;
} }
</style> </style>

2
components/readers/Reader.vue
View file

@ -22,7 +22,7 @@
</div> </div>
<!-- ereader --> <!-- ereader -->
<component v-if="readerComponentName" ref="readerComponent" :is="readerComponentName" :url="ebookUrl" :library-item="selectedLibraryItem" :is-local="isLocal" :keep-progress="keepProgress" @touchstart="touchstart" @touchend="touchend" @loaded="readerLoaded" @hook:mounted="readerMounted" /> <component v-if="readerComponentName" ref="readerComponent" :is="readerComponentName" :url="ebookUrl" :library-item="selectedLibraryItem" :is-local="isLocal" :keep-progress="keepProgress" :showing-toolbar="showingToolbar" @touchstart="touchstart" @touchend="touchend" @loaded="readerLoaded" @hook:mounted="readerMounted" />
<!-- table of contents modal --> <!-- table of contents modal -->
<modals-fullscreen-modal v-model="showTOCModal" :theme="ereaderTheme"> <modals-fullscreen-modal v-model="showTOCModal" :theme="ereaderTheme">