From 44be77e14d55bb0114a2b1c0e4775575e58abb2e Mon Sep 17 00:00:00 2001
From: ll3006 <doublel3006@gmail.com>
Date: Tue, 23 Sep 2025 01:06:11 +0200
Subject: [PATCH 1/6] wip

---
 assets/css/tailwind.css          | 19 +++++++++++++++----
 components/Reader/Horizontal.vue |  2 +-
 components/Reader/Vertical.vue   |  5 ++++-
 3 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/assets/css/tailwind.css b/assets/css/tailwind.css
index fc5cbe2..47adcb1 100644
--- a/assets/css/tailwind.css
+++ b/assets/css/tailwind.css
@@ -25,15 +25,26 @@
   }
 }
 
-*::-webkit-scrollbar {
+.scrollbar-styled::-webkit-scrollbar {
     width: 10px;
 }
 
-*::-webkit-scrollbar-track {
-    background-color: var(--color-neutral-800);
+.scrollbar-styled::-webkit-scrollbar-track {
+    background-color: transparent;
 }
 
-*::-webkit-scrollbar-thumb {
+.scrollbar-styled::-webkit-scrollbar-thumb {
     border-radius: 5px;
     background-color: var(--color-neutral-600);
+}
+
+@utility scrollbar-hidden {
+  &::-webkit-scrollbar {
+    display: none;
+  }
+  
+  & { 
+    -ms-overflow-style: none;  /* IE and Edge */
+    scrollbar-width: none;  /* Firefox */
+  }
 }
\ No newline at end of file
diff --git a/components/Reader/Horizontal.vue b/components/Reader/Horizontal.vue
index b47d1a2..9b37ba2 100644
--- a/components/Reader/Horizontal.vue
+++ b/components/Reader/Horizontal.vue
@@ -67,7 +67,7 @@ onBeforeUnmount(() => {
 
 <template>
   <PageSelector />
-  <div class="h-full w-full overflow-y-auto" @click="onClick">
+  <div class="scrollbar-styled h-full w-full overflow-y-auto" @click="onClick">
     <Page
       :src="currentSrc && providersStore.loadedImages[currentSrc]"
       :page-fit="settings.pageFit"
diff --git a/components/Reader/Vertical.vue b/components/Reader/Vertical.vue
index 67a1a7a..206d773 100644
--- a/components/Reader/Vertical.vue
+++ b/components/Reader/Vertical.vue
@@ -38,7 +38,10 @@ function onScroll(e: Event) {
 </script>
 
 <template>
-  <div class="h-screen w-full overflow-y-auto" @scroll="onScroll">
+  <div
+    class="scrollbar-hidden h-screen w-full overflow-y-auto"
+    @scroll="onScroll"
+  >
     <Page
       v-for="(image, idx) in progress.source?.images"
       :data-idx="idx"

From 5d12a3b5b85791e57bbc1813e8370a7907375b8a Mon Sep 17 00:00:00 2001
From: ll3006 <doublel3006@gmail.com>
Date: Tue, 23 Sep 2025 01:32:24 +0200
Subject: [PATCH 2/6] wip: add chapter selection footer in mobile vertical mode

---
 components/Reader/Vertical.vue | 5 +----
 components/Reader/index.vue    | 8 +++++++-
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/components/Reader/Vertical.vue b/components/Reader/Vertical.vue
index 206d773..9a33bb2 100644
--- a/components/Reader/Vertical.vue
+++ b/components/Reader/Vertical.vue
@@ -38,10 +38,7 @@ function onScroll(e: Event) {
 </script>
 
 <template>
-  <div
-    class="scrollbar-hidden h-screen w-full overflow-y-auto"
-    @scroll="onScroll"
-  >
+  <div class="scrollbar-styled w-full md:overflow-y-auto" @scroll="onScroll">
     <Page
       v-for="(image, idx) in progress.source?.images"
       :data-idx="idx"
diff --git a/components/Reader/index.vue b/components/Reader/index.vue
index 371db24..b5fc1c5 100644
--- a/components/Reader/index.vue
+++ b/components/Reader/index.vue
@@ -15,9 +15,15 @@ watchEffect(load);
 
 <template>
   <div
-    class="align-start relative flex h-screen max-w-screen grow bg-black select-none"
+    class="align-start md:scrollbar-styled relative scrollbar-hidden flex grow flex-col bg-black select-none md:h-screen md:max-w-screen"
   >
     <ReaderVertical v-if="settings.readDirection == 'vertical'" />
     <ReaderHorizontal v-else />
+    <footer
+      class="inline-block w-full items-center gap-0 bg-neutral-800 text-stone-200 md:hidden"
+      v-if="settings.readDirection == 'vertical'"
+    >
+      <ChapterSelector />
+    </footer>
   </div>
 </template>

From 211dff25cbd9e86050bac1f5c60ebfd6b4bebb62 Mon Sep 17 00:00:00 2001
From: ll3006 <doublel3006@gmail.com>
Date: Tue, 23 Sep 2025 01:43:24 +0200
Subject: [PATCH 3/6] fix: images do not look continuous in vertical reading
 mode on small screen devices

---
 components/Page/index.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/components/Page/index.vue b/components/Page/index.vue
index 8f9707f..c3b2e99 100644
--- a/components/Page/index.vue
+++ b/components/Page/index.vue
@@ -35,7 +35,11 @@ const pageFitImageClass = computed(() => {
 </script>
 
 <template>
-  <img v-if="src && loaded" :src="src" :class="['m-auto', pageFitImageClass]" />
+  <img
+    v-if="src && loaded"
+    :src="src"
+    :class="['m-auto mb-[-0.005px]', pageFitImageClass]"
+  />
   <div v-else class="flex items-center justify-center">
     <p class="text-lg text-white">Loading...</p>
   </div>

From 144af145592fd15045ec542704030874d6db8ccf Mon Sep 17 00:00:00 2001
From: ll3006 <doublel3006@gmail.com>
Date: Wed, 24 Sep 2025 00:31:01 +0200
Subject: [PATCH 4/6] fix: prevent context menu when holding on image

---
 components/Reader/Vertical.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/components/Reader/Vertical.vue b/components/Reader/Vertical.vue
index 9a33bb2..05e8d34 100644
--- a/components/Reader/Vertical.vue
+++ b/components/Reader/Vertical.vue
@@ -45,6 +45,7 @@ function onScroll(e: Event) {
       :src="image"
       :loaded="true"
       :page-fit="settings.pageFit"
+      @contextmenu.prevent
     />
   </div>
 </template>

From c568de68d0825f369a6f6214a9c64e12d667354b Mon Sep 17 00:00:00 2001
From: ll3006 <doublel3006@gmail.com>
Date: Wed, 24 Sep 2025 01:29:24 +0200
Subject: [PATCH 5/6] wip

---
 components/Page/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/Page/index.vue b/components/Page/index.vue
index c3b2e99..bf342f1 100644
--- a/components/Page/index.vue
+++ b/components/Page/index.vue
@@ -38,7 +38,7 @@ const pageFitImageClass = computed(() => {
   <img
     v-if="src && loaded"
     :src="src"
-    :class="['m-auto mb-[-0.005px]', pageFitImageClass]"
+    :class="['m-auto my-[-0.01px]', pageFitImageClass]"
   />
   <div v-else class="flex items-center justify-center">
     <p class="text-lg text-white">Loading...</p>

From da8a3c24dc2a90e7057d3910784bf74ba2e7cfb1 Mon Sep 17 00:00:00 2001
From: LL3006 <51717357+ll3006@users.noreply.github.com>
Date: Tue, 11 Nov 2025 02:02:25 +0100
Subject: [PATCH 6/6] Pwa display fullscreen test

---
 nuxt.config.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/nuxt.config.ts b/nuxt.config.ts
index 82151fe..5335a66 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -25,7 +25,7 @@ export default defineNuxtConfig({
     registerType: "autoUpdate",
     manifest: {
       name: "Rida",
-      display: "standalone",
+      display: "fullscreen",
       short_name: "Rida",
       description: "An intuitive manga reader",
       theme_color: "#0a0a0a",