release: version 0.9.20 (#549 )

* fix: occasionally traffic lights disappear in library page * release: version 0.9.20
fix: remove seldomly used option to invert colors in dark mode (#548 )
2025-03-09 17:40:30 +01:00 · 2025-03-09 17:02:01 +01:00 · 2025-03-09 14:15:41 +01:00 · 2025-03-09 11:33:52 +01:00 · 2025-03-09 10:29:16 +01:00 · 2025-03-09 07:07:42 +01:00
73 changed files with 1488 additions and 1093 deletions
@@ -1,7 +1,7 @@
 ---
 name: Feature request
 about: Share an idea or suggestion
-title: 'FR: [a handful of words describing the FR]'
+title: 'FR: describing your feature request'
 labels: enhancement
 assignees: ''
 ---
@@ -1,6 +1,6 @@
 [submodule "packages/foliate-js"]
 	path = packages/foliate-js
-	url = https://github.com/chrox/foliate-js.git
+	url = https://github.com/readest/foliate-js.git
 [submodule "packages/tauri"]
 	path = packages/tauri
-	url = https://github.com/chrox/tauri.git
+	url = https://github.com/tauri-apps/tauri.git
@@ -32,7 +32,7 @@

 <div align="center">
  <a href="https://readest.com" target="_blank">
-    <img src="./data/screenshots/landing_preview.png" alt="Readest Banner" width="100%" />
+    <img src="./data/screenshots/landing_all_platforms.png" alt="Readest Banner" width="100%" />
  </a>
 </div>

@@ -80,7 +80,7 @@ Stay tuned for continuous improvements and updates! Contributions and suggestion

 ![DeepL](./data/screenshots/deepl.png)

-![TTS](./data/screenshots/tts_control.png)
+![TTS](./data/screenshots/tts_speak_aloud.png)

 ![Footnote](./data/screenshots/footnote_popover.png)

@@ -205,7 +205,7 @@ Readest is open-source, and contributions are welcome! Feel free to open issues,

 <a href="https://github.com/readest/readest/graphs/contributors">
  <p align="left">
-    <img width="300" src="https://contrib.rocks/image?repo=readest/readest" alt="A table of avatars from the project's contributors" />
+    <img width="500" src="https://contrib.rocks/image?repo=readest/readest" alt="A table of avatars from the project's contributors" />
  </p>
 </a>

@@ -1,6 +1,6 @@
 {
  "name": "@readest/readest-app",
-  "version": "0.9.19",
+  "version": "0.9.20",
  "private": true,
  "scripts": {
    "dev": "dotenv -e .env.tauri -- next dev",
@@ -42,19 +42,19 @@
    "@supabase/auth-ui-react": "^0.4.7",
    "@supabase/auth-ui-shared": "^0.1.8",
    "@supabase/supabase-js": "^2.47.7",
-    "@tauri-apps/api": "2.2.0",
+    "@tauri-apps/api": "2.3.0",
    "@tauri-apps/plugin-cli": "^2.2.0",
    "@tauri-apps/plugin-deep-link": "^2.2.0",
    "@tauri-apps/plugin-dialog": "^2.2.0",
    "@tauri-apps/plugin-fs": "^2.2.0",
    "@tauri-apps/plugin-haptics": "^2.2.3",
    "@tauri-apps/plugin-http": "^2.3.0",
-    "@tauri-apps/plugin-log": "^2.2.1",
-    "@tauri-apps/plugin-opener": "^2.2.5",
+    "@tauri-apps/plugin-log": "^2.2.3",
+    "@tauri-apps/plugin-opener": "^2.2.6",
    "@tauri-apps/plugin-os": "^2.2.0",
    "@tauri-apps/plugin-process": "^2.2.0",
    "@tauri-apps/plugin-shell": "~2.2.0",
-    "@tauri-apps/plugin-updater": "^2.4.0",
+    "@tauri-apps/plugin-updater": "^2.5.1",
    "@zip.js/zip.js": "^2.7.53",
    "clsx": "^2.1.1",
    "cors": "^2.8.5",
@@ -76,7 +76,7 @@
    "zustand": "5.0.1"
  },
  "devDependencies": {
-    "@tauri-apps/cli": "2.2.7",
+    "@tauri-apps/cli": "2.3.1",
    "@types/cors": "^2.8.17",
    "@types/cssbeautify": "^0.3.5",
    "@types/node": "^22.10.1",
@@ -64,8 +64,6 @@
  "Match Case": "مطابقة حالة الأحرف",
  "Match Diacritics": "مطابقة التشكيل",
  "Match Whole Words": "مطابقة الكلمات الكاملة",
-  "Maximum Block Size": "أقصى مساحة رأسية",
-  "Maximum Inline Size": "أقصى مساحة أفقية",
  "Maximum Number of Columns": "العدد الأقصى للأعمدة",
  "Minimum Font Size": "الحد الأدنى لحجم الخط",
  "Misc": "أخرى",
@@ -230,5 +228,12 @@
  "Delete Permanently": "حذف نهائي",
  "Free Tier": "الفئة المجانية",
  "Plus Tier": "فئة Plus",
-  "Pro Tier": "فئة Pro"
+  "Pro Tier": "فئة Pro",
+  "RTL Direction": "الاتجاه من اليمين إلى اليسار",
+  "Maximum Column Height": "الارتفاع الأقصى للعمود",
+  "Maximum Column Width": "العرض الأقصى للعمود",
+  "Continuous Scroll": "التمرير المستمر",
+  "Fullscreen": "ملء الشاشة",
+  "No supported files found. Supported formats: {{formats}}": "لم يتم العثور على ملفات مدعومة. الصيغ المدعومة: {{formats}}",
+  "Drop to Import Books": "اسحب لاستيراد الكتب"
 }
@@ -64,8 +64,6 @@
  "Match Case": "Groß-/Kleinschreibung beachten",
  "Match Diacritics": "Akzente beachten",
  "Match Whole Words": "Ganze Wörter",
-  "Maximum Block Size": "Maximale Blockgröße",
-  "Maximum Inline Size": "Maximale Zeilengröße",
  "Maximum Number of Columns": "Maximale Spaltenanzahl",
  "Minimum Font Size": "Minimale Schriftgröße",
  "Misc": "Sonstiges",
@@ -230,5 +228,12 @@
  "Delete Permanently": "Dauerhaft löschen",
  "Free Tier": "Kostenlose Stufe",
  "Plus Tier": "Plus-Stufe",
-  "Pro Tier": "Pro-Stufe"
+  "Pro Tier": "Pro-Stufe",
+  "RTL Direction": "RTL-Richtung",
+  "Maximum Column Height": "Maximale Spaltenhöhe",
+  "Maximum Column Width": "Maximale Spaltenbreite",
+  "Continuous Scroll": "Kontinuierliches Scrollen",
+  "Fullscreen": "Vollbild",
+  "No supported files found. Supported formats: {{formats}}": "Keine unterstützten Dateien gefunden. Unterstützte Formate: {{formats}}",
+  "Drop to Import Books": "Zum Importieren von Büchern ablegen"
 }
@@ -64,8 +64,6 @@
  "Match Case": "Ταίριασμα πεζών-κεφαλαίων",
  "Match Diacritics": "Ταίριασμα διακριτικών σημείων",
  "Match Whole Words": "Ταίριασμα ολόκληρων λέξεων",
-  "Maximum Block Size": "Μέγιστο μέγεθος μπλοκ",
-  "Maximum Inline Size": "Μέγιστο μέγεθος γραμμής",
  "Maximum Number of Columns": "Μέγιστος αριθμός στηλών",
  "Minimum Font Size": "Ελάχιστο μέγεθος γραμματοσειράς",
  "Misc": "Διάφορα",
@@ -230,5 +228,12 @@
  "Delete Permanently": "Μόνιμη διαγραφή",
  "Free Tier": "Δωρεάν βαθμίδα",
  "Plus Tier": "Βαθμίδα Plus",
-  "Pro Tier": "Βαθμίδα Pro"
+  "Pro Tier": "Βαθμίδα Pro",
+  "RTL Direction": "Κατεύθυνση RTL",
+  "Maximum Column Height": "Μέγιστο ύψος στήλης",
+  "Maximum Column Width": "Μέγιστο πλάτος στήλης",
+  "Continuous Scroll": "Συνεχής κύλιση",
+  "Fullscreen": "Πλήρης οθόνη",
+  "No supported files found. Supported formats: {{formats}}": "Δεν βρέθηκαν υποστηριζόμενα αρχεία. Υποστηριζόμενες μορφές: {{formats}}",
+  "Drop to Import Books": "Ρίξτε για εισαγωγή βιβλίων"
 }
@@ -64,8 +64,6 @@
  "Match Case": "Coincidir mayúsculas y minúsculas",
  "Match Diacritics": "Coincidir diacríticos",
  "Match Whole Words": "Coincidir palabras completas",
-  "Maximum Block Size": "Tamaño máximo de bloque",
-  "Maximum Inline Size": "Tamaño máximo en línea",
  "Maximum Number of Columns": "Número máximo de columnas",
  "Minimum Font Size": "Tamaño de fuente mínimo",
  "Misc": "Varios",
@@ -230,5 +228,12 @@
  "Delete Permanently": "Eliminar permanentemente",
  "Free Tier": "Nivel gratuito",
  "Plus Tier": "Nivel Plus",
-  "Pro Tier": "Nivel Pro"
+  "Pro Tier": "Nivel Pro",
+  "RTL Direction": "Dirección RTL",
+  "Maximum Column Height": "Altura máxima de columna",
+  "Maximum Column Width": "Ancho máximo de columna",
+  "Continuous Scroll": "Desplazamiento continuo",
+  "Fullscreen": "Pantalla completa",
+  "No supported files found. Supported formats: {{formats}}": "No se encontraron archivos compatibles. Formatos compatibles: {{formats}}",
+  "Drop to Import Books": "Soltar para importar libros"
 }
@@ -64,8 +64,6 @@
  "Match Case": "Respecter la casse",
  "Match Diacritics": "Respecter les accents",
  "Match Whole Words": "Mots entiers",
-  "Maximum Block Size": "Taille maximale du bloc",
-  "Maximum Inline Size": "Taille maximale en ligne",
  "Maximum Number of Columns": "Nombre maximal de colonnes",
  "Minimum Font Size": "Taille minimale de police",
  "Misc": "Divers",
@@ -230,5 +228,12 @@
  "Delete Permanently": "Supprimer définitivement",
  "Free Tier": "Niveau gratuit",
  "Plus Tier": "Niveau Plus",
-  "Pro Tier": "Niveau Pro"
+  "Pro Tier": "Niveau Pro",
+  "RTL Direction": "Direction RTL",
+  "Maximum Column Height": "Hauteur maximale de colonne",
+  "Maximum Column Width": "Largeur maximale de colonne",
+  "Continuous Scroll": "Défilement continu",
+  "Fullscreen": "Plein écran",
+  "No supported files found. Supported formats: {{formats}}": "Aucun fichier pris en charge trouvé. Formats pris en charge : {{formats}}",
+  "Drop to Import Books": "Déposez pour importer des livres"
 }
@@ -64,8 +64,6 @@
  "Match Case": "केस मैच करें",
  "Match Diacritics": "डायाक्रिटिक्स मैच करें",
  "Match Whole Words": "पूरे शब्द मैच करें",
-  "Maximum Block Size": "अधिकतम ब्लॉक साइज़",
-  "Maximum Inline Size": "अधिकतम इनलाइन साइज़",
  "Maximum Number of Columns": "कॉलम की अधिकतम संख्या",
  "Minimum Font Size": "न्यूनतम फ़ॉन्ट साइज़",
  "Misc": "विविध",
@@ -230,5 +228,12 @@
  "Delete Permanently": "स्थायी रूप से हटाएं",
  "Free Tier": "फ्री टियर",
  "Plus Tier": "प्लस टियर",
-  "Pro Tier": "प्रो टियर"
+  "Pro Tier": "प्रो टियर",
+  "RTL Direction": "RTL दिशा",
+  "Maximum Column Height": "कॉलम की अधिकतम ऊँचाई",
+  "Maximum Column Width": "कॉलम की अधिकतम चौड़ाई",
+  "Continuous Scroll": "निरंतर स्क्रॉल",
+  "Fullscreen": "पूर्णस्क्रीन",
+  "No supported files found. Supported formats: {{formats}}": "कोई समर्थित फ़ाइलें नहीं मिलीं। समर्थित प्रारूप: {{formats}}",
+  "Drop to Import Books": "पुस्तकें आयात करने के लिए छोड़ें"
 }
@@ -64,8 +64,6 @@
  "Match Case": "Cocokkan Huruf Besar/Kecil",
  "Match Diacritics": "Cocokkan Diakritik",
  "Match Whole Words": "Cocokkan Kata Utuh",
-  "Maximum Block Size": "Ukuran Blok Maksimum",
-  "Maximum Inline Size": "Ukuran Sebaris Maksimum",
  "Maximum Number of Columns": "Jumlah Kolom Maksimum",
  "Minimum Font Size": "Ukuran Font Minimum",
  "Misc": "Lain-lain",
@@ -230,5 +228,12 @@
  "Delete Permanently": "Hapus Secara Permanen",
  "Free Tier": "Tingkat Gratis",
  "Plus Tier": "Tingkat Plus",
-  "Pro Tier": "Tingkat Pro"
+  "Pro Tier": "Tingkat Pro",
+  "RTL Direction": "Arah RTL",
+  "Maximum Column Height": "Tinggi Kolom Maksimum",
+  "Maximum Column Width": "Lebar Kolom Maksimum",
+  "Continuous Scroll": "Gulir Terus",
+  "Fullscreen": "Layar Penuh",
+  "No supported files found. Supported formats: {{formats}}": "Tidak ada file yang didukung ditemukan. Format yang didukung: {{formats}}",
+  "Drop to Import Books": "Jatuhkan untuk Mengimpor Buku"
 }
@@ -64,8 +64,6 @@
  "Match Case": "Maiuscole/minuscole",
  "Match Diacritics": "Corrispondenza diacritici",
  "Match Whole Words": "Parole intere",
-  "Maximum Block Size": "Dimensione massima blocco",
-  "Maximum Inline Size": "Dimensione massima in linea",
  "Maximum Number of Columns": "Numero massimo di colonne",
  "Minimum Font Size": "Dimensione minima font",
  "Misc": "Varie",
@@ -230,5 +228,12 @@
  "Delete Permanently": "Elimina definitivamente",
  "Free Tier": "Piano gratuito",
  "Plus Tier": "Piano Plus",
-  "Pro Tier": "Piano Pro"
+  "Pro Tier": "Piano Pro",
+  "RTL Direction": "Direzione RTL",
+  "Maximum Column Height": "Altezza massima colonna",
+  "Maximum Column Width": "Larghezza massima colonna",
+  "Continuous Scroll": "Scorrimento continuo",
+  "Fullscreen": "Schermo intero",
+  "No supported files found. Supported formats: {{formats}}": "Nessun file supportato trovato. Formati supportati: {{formats}}",
+  "Drop to Import Books": "Rilascia per importare libri"
 }
@@ -64,8 +64,6 @@
  "Match Case": "大文字・小文字を区別",
  "Match Diacritics": "アクセント記号を区別",
  "Match Whole Words": "単語全体を一致",
-  "Maximum Block Size": "最大ブロックサイズ",
-  "Maximum Inline Size": "最大インラインサイズ",
  "Maximum Number of Columns": "最大列数",
  "Minimum Font Size": "最小フォントサイズ",
  "Misc": "その他",
@@ -230,5 +228,12 @@
  "Delete Permanently": "完全に削除",
  "Free Tier": "無料プラン",
  "Plus Tier": "Plusプラン",
-  "Pro Tier": "Proプラン"
+  "Pro Tier": "Proプラン",
+  "RTL Direction": "RTL方向",
+  "Maximum Column Height": "最大列高",
+  "Maximum Column Width": "最大列幅",
+  "Continuous Scroll": "連続スクロール",
+  "Fullscreen": "全画面",
+  "No supported files found. Supported formats: {{formats}}": "サポートされているファイルが見つかりません。サポートされている形式：{{formats}}",
+  "Drop to Import Books": "書籍をインポートするにはドロップ"
 }
@@ -64,8 +64,6 @@
  "Match Case": "대소문자 구분",
  "Match Diacritics": "발음 구별 부호 구분",
  "Match Whole Words": "전체 단어 일치",
-  "Maximum Block Size": "최대 블록 크기",
-  "Maximum Inline Size": "최대 인라인 크기",
  "Maximum Number of Columns": "최대 열 수",
  "Minimum Font Size": "최소 글꼴 크기",
  "Misc": "기타",
@@ -230,5 +228,12 @@
  "Delete Permanently": "영구 삭제",
  "Free Tier": "무료 등급",
  "Plus Tier": "플러스 등급",
-  "Pro Tier": "프로 등급"
+  "Pro Tier": "프로 등급",
+  "RTL Direction": "RTL 방향",
+  "Maximum Column Height": "최대 열 높이",
+  "Maximum Column Width": "최대 열 너비",
+  "Continuous Scroll": "연속 스크롤",
+  "Fullscreen": "전체 화면",
+  "No supported files found. Supported formats: {{formats}}": "지원되는 파일이 없습니다. 지원되는 형식: {{formats}}",
+  "Drop to Import Books": "책 가져오기 위해 드롭"
 }
@@ -64,8 +64,6 @@
  "Match Case": "Uwzględnij wielkość liter",
  "Match Diacritics": "Uwzględnij znaki diakrytyczne",
  "Match Whole Words": "Uwzględnij całe słowa",
-  "Maximum Block Size": "Maksymalny rozmiar bloku",
-  "Maximum Inline Size": "Maksymalny rozmiar linii",
  "Maximum Number of Columns": "Maksymalna liczba kolumn",
  "Minimum Font Size": "Minimalny rozmiar czcionki",
  "Misc": "Różne",
@@ -230,5 +228,12 @@
  "Delete Permanently": "Usuń trwale",
  "Free Tier": "Plan darmowy",
  "Plus Tier": "Plan Plus",
-  "Pro Tier": "Plan Pro"
+  "Pro Tier": "Plan Pro",
+  "RTL Direction": "Kierunek RTL",
+  "Maximum Column Height": "Maksymalna wysokość kolumny",
+  "Maximum Column Width": "Maksymalna szerokość kolumny",
+  "Continuous Scroll": "Przewijanie ciągłe",
+  "Fullscreen": "Pełny ekran",
+  "No supported files found. Supported formats: {{formats}}": "Nie znaleziono obsługiwanych plików. Obsługiwane formaty: {{formats}}",
+  "Drop to Import Books": "Upuść, aby zaimportować książki"
 }
@@ -64,8 +64,6 @@
  "Match Case": "Diferenciar Maiúsculas e Minúsculas",
  "Match Diacritics": "Corresponder Acentos",
  "Match Whole Words": "Corresponder Palavras Inteiras",
-  "Maximum Block Size": "Tamanho Máximo do Bloco",
-  "Maximum Inline Size": "Tamanho Máximo em Linha",
  "Maximum Number of Columns": "Número Máximo de Colunas",
  "Minimum Font Size": "Tamanho Mínimo da Fonte",
  "Misc": "Diversos",
@@ -230,5 +228,12 @@
  "Delete Permanently": "Excluir permanentemente",
  "Free Tier": "Plano gratuito",
  "Plus Tier": "Plano Plus",
-  "Pro Tier": "Plano Pro"
+  "Pro Tier": "Plano Pro",
+  "RTL Direction": "Direção RTL",
+  "Maximum Column Height": "Altura Máxima da Coluna",
+  "Maximum Column Width": "Largura Máxima da Coluna",
+  "Continuous Scroll": "Rolagem Contínua",
+  "Fullscreen": "Tela Cheia",
+  "No supported files found. Supported formats: {{formats}}": "Nenhum arquivo suportado encontrado. Formatos suportados: {{formats}}",
+  "Drop to Import Books": "Arraste para Importar Livros"
 }
@@ -64,8 +64,6 @@
  "Match Case": "Учитывать регистр",
  "Match Diacritics": "Учитывать диакритические знаки",
  "Match Whole Words": "Только целые слова",
-  "Maximum Block Size": "Максимальный размер блока",
-  "Maximum Inline Size": "Максимальный размер строки",
  "Maximum Number of Columns": "Максимальное количество колонок",
  "Minimum Font Size": "Минимальный размер шрифта",
  "Misc": "Разное",
@@ -230,5 +228,12 @@
  "Delete Permanently": "Удалить навсегда",
  "Free Tier": "Бесплатный тариф",
  "Plus Tier": "Тариф Plus",
-  "Pro Tier": "Тариф Pro"
+  "Pro Tier": "Тариф Pro",
+  "RTL Direction": "Направление RTL",
+  "Maximum Column Height": "Максимальная высота колонки",
+  "Maximum Column Width": "Максимальная ширина колонки",
+  "Continuous Scroll": "Непрерывная прокрутка",
+  "Fullscreen": "Полноэкранный режим",
+  "No supported files found. Supported formats: {{formats}}": "Поддерживаемые файлы не найдены. Поддерживаемые форматы: {{formats}}",
+  "Drop to Import Books": "Перетащите сюда книги для импорта"
 }
@@ -64,8 +64,6 @@
  "Match Case": "Büyük/Küçük Harf Eşleştir",
  "Match Diacritics": "Aksan İşaretlerini Eşleştir",
  "Match Whole Words": "Tam Kelimeleri Eşleştir",
-  "Maximum Block Size": "Maksimum Blok Boyutu",
-  "Maximum Inline Size": "Maksimum Satır İçi Boyut",
  "Maximum Number of Columns": "Maksimum Sütun Sayısı",
  "Minimum Font Size": "Minimum Yazı Boyutu",
  "Misc": "Diğer",
@@ -230,5 +228,12 @@
  "Delete Permanently": "Kalıcı Olarak Sil",
  "Free Tier": "Ücretsiz Paket",
  "Plus Tier": "Plus Paket",
-  "Pro Tier": "Pro Paket"
+  "Pro Tier": "Pro Paket",
+  "RTL Direction": "RTL Yönü",
+  "Maximum Column Height": "Maksimum Sütun Yüksekliği",
+  "Maximum Column Width": "Maksimum Sütun Genişliği",
+  "Continuous Scroll": "Sürekli Kaydırma",
+  "Fullscreen": "Tam Ekran",
+  "No supported files found. Supported formats: {{formats}}": "Desteklenen dosya bulunamadı. Desteklenen formatlar: {{formats}}",
+  "Drop to Import Books": "Kitapları İçe Aktarmak İçin Bırak"
 }
@@ -64,8 +64,6 @@
  "Match Case": "Враховувати регістр",
  "Match Diacritics": "Враховувати діакритичні знаки",
  "Match Whole Words": "Шукати цілі слова",
-  "Maximum Block Size": "Максимальний розмір блоку",
-  "Maximum Inline Size": "Максимальний розмір рядка",
  "Maximum Number of Columns": "Максимальна кількість колонок",
  "Minimum Font Size": "Мінімальний розмір шрифту",
  "Misc": "Різне",
@@ -230,5 +228,12 @@
  "Delete Permanently": "Видалити назавжди",
  "Free Tier": "Безкоштовний тариф",
  "Plus Tier": "Тариф Plus",
-  "Pro Tier": "Тариф Pro"
+  "Pro Tier": "Тариф Pro",
+  "RTL Direction": "Напрямок RTL",
+  "Maximum Column Height": "Максимальна висота колонки",
+  "Maximum Column Width": "Максимальна ширина колонки",
+  "Continuous Scroll": "Постійна прокрутка",
+  "Fullscreen": "Повноекранний",
+  "No supported files found. Supported formats: {{formats}}": "Не знайдено підтримуваних файлів. Підтримувані формати: {{formats}}",
+  "Drop to Import Books": "Перетягніть для імпорту книг"
 }
@@ -64,8 +64,6 @@
  "Match Case": "Phân biệt chữ hoa/thường",
  "Match Diacritics": "Phân biệt dấu",
  "Match Whole Words": "Khớp toàn bộ từ",
-  "Maximum Block Size": "Kích thước khối tối đa",
-  "Maximum Inline Size": "Kích thước nội tuyến tối đa",
  "Maximum Number of Columns": "Số cột tối đa",
  "Minimum Font Size": "Cỡ chữ tối thiểu",
  "Misc": "Khác",
@@ -230,5 +228,12 @@
  "Delete Permanently": "Xóa vĩnh viễn",
  "Free Tier": "Gói miễn phí",
  "Plus Tier": "Gói Plus",
-  "Pro Tier": "Gói Pro"
+  "Pro Tier": "Gói Pro",
+  "RTL Direction": "Hướng RTL",
+  "Maximum Column Height": "Chiều cao cột tối đa",
+  "Maximum Column Width": "Chiều rộng cột tối đa",
+  "Continuous Scroll": "Cuộn liên tục",
+  "Fullscreen": "Toàn màn hình",
+  "No supported files found. Supported formats: {{formats}}": "Không tìm thấy tệp được hỗ trợ. Định dạng được hỗ trợ: {{formats}}",
+  "Drop to Import Books": "Kéo và thả để nhập sách"
 }
@@ -64,8 +64,6 @@
  "Match Case": "匹配大小写",
  "Match Diacritics": "匹配重音符号",
  "Match Whole Words": "匹配整个单词",
-  "Maximum Block Size": "内容最大高度",
-  "Maximum Inline Size": "每栏最大宽度",
  "Maximum Number of Columns": "分栏数",
  "Minimum Font Size": "最小字号",
  "Misc": "杂项",
@@ -230,5 +228,12 @@
  "Delete Permanently": "永久删除",
  "Free Tier": "免费版",
  "Plus Tier": "增强版",
-  "Pro Tier": "专业版"
+  "Pro Tier": "专业版",
+  "RTL Direction": "从右向左",
+  "Maximum Column Height": "最大列高",
+  "Maximum Column Width": "最大列宽",
+  "Continuous Scroll": "连续滚动",
+  "Fullscreen": "全屏",
+  "No supported files found. Supported formats: {{formats}}": "未找到支持的文件。支持的格式：{{formats}}",
+  "Drop to Import Books": "拖放导入书籍"
 }
@@ -64,8 +64,6 @@
  "Match Case": "匹配大小寫",
  "Match Diacritics": "匹配重音符號",
  "Match Whole Words": "匹配整個單詞",
-  "Maximum Block Size": "內容最大高度",
-  "Maximum Inline Size": "每欄最大寬度",
  "Maximum Number of Columns": "分欄數",
  "Minimum Font Size": "最小字號",
  "Misc": "雜項",
@@ -230,5 +228,12 @@
  "Delete Permanently": "永久刪除",
  "Free Tier": "免費方案",
  "Plus Tier": "Plus方案",
-  "Pro Tier": "專業方案"
+  "Pro Tier": "專業方案",
+  "RTL Direction": "從右向左",
+  "Maximum Column Height": "最大列高",
+  "Maximum Column Width": "最大列寬",
+  "Continuous Scroll": "連續滾動",
+  "Fullscreen": "全螢幕",
+  "No supported files found. Supported formats: {{formats}}": "未找到支援的檔案。支援的格式：{{formats}}",
+  "Drop to Import Books": "拖放導入書籍"
 }
@@ -1,5 +1,15 @@
 {
  "releases": {
+    "0.9.20": {
+      "date": "2025-03-10",
+      "notes": [
+        "Fix column height in vertical layout on mobile",
+        "Fix drag handle height not constant on mobile",
+        "Add fullscreen option on desktop",
+        "Add drag and drop to import books on desktop",
+        "Various fixes and enhancements on updater, footerbar and note"
+      ]
+    },
    "0.9.19": {
      "date": "2025-03-07",
      "notes": [
@@ -62,6 +62,7 @@
    "core:window:allow-is-maximized",
    "core:window:allow-start-dragging",
    "core:window:allow-toggle-maximize",
+    "core:window:allow-set-fullscreen",
    "shell:default",
    "process:default",
    "process:allow-exit",
@@ -12,8 +12,8 @@ import { IoArrowBack } from 'react-icons/io5';

 import { useAuth } from '@/context/AuthContext';
 import { supabase } from '@/utils/supabase';
-import { useTheme } from '@/hooks/useTheme';
 import { useEnv } from '@/context/EnvContext';
+import { useThemeStore } from '@/store/themeStore';
 import { useSettingsStore } from '@/store/settingsStore';
 import { useTranslation } from '@/hooks/useTranslation';
 import { isTauriAppPlatform } from '@/services/environment';
@@ -61,7 +61,7 @@ export default function AuthPage() {
  const router = useRouter();
  const { login } = useAuth();
  const { envConfig, appService } = useEnv();
-  const { isDarkMode } = useTheme();
+  const { isDarkMode } = useThemeStore();
  const { settings, setSettings, saveSettings } = useSettingsStore();
  const [port, setPort] = useState<number | null>(null);
  const isOAuthServerRunning = useRef(false);
@@ -21,9 +21,9 @@ interface BookshelfProps {
  libraryBooks: Book[];
  isSelectMode: boolean;
  handleImportBooks: () => void;
-  handleBookUpload: (book: Book) => void;
-  handleBookDownload: (book: Book) => void;
-  handleBookDelete: (book: Book) => void;
+  handleBookUpload: (book: Book) => Promise<boolean>;
+  handleBookDownload: (book: Book) => Promise<boolean>;
+  handleBookDelete: (book: Book) => Promise<boolean>;
  handleSetSelectMode: (selectMode: boolean) => void;
  handleShowDetailsBook: (book: Book) => void;
  booksTransferProgress: { [key: string]: number | null };
@@ -72,9 +72,9 @@ interface BookshelfItemProps {
  transferProgress: number | null;
  setLoading: React.Dispatch<React.SetStateAction<boolean>>;
  toggleSelection: (hash: string) => void;
-  handleBookUpload: (book: Book) => void;
-  handleBookDownload: (book: Book) => void;
-  handleBookDelete: (book: Book) => void;
+  handleBookUpload: (book: Book) => Promise<boolean>;
+  handleBookDownload: (book: Book) => Promise<boolean>;
+  handleBookDelete: (book: Book) => Promise<boolean>;
  handleSetSelectMode: (selectMode: boolean) => void;
  handleShowDetailsBook: (book: Book) => void;
 }
@@ -109,9 +109,8 @@ const BookshelfItem: React.FC<BookshelfItemProps> = ({
      let available = false;
      const loadingTimeout = setTimeout(() => setLoading(true), 200);
      try {
-        await handleBookDownload(book);
+        available = await handleBookDownload(book);
        updateBook(envConfig, book);
-        available = true;
      } finally {
        if (loadingTimeout) clearTimeout(loadingTimeout);
        setLoading(false);
@@ -37,6 +37,7 @@ const LibraryHeader: React.FC<LibraryHeaderProps> = ({
    isTrafficLightVisible,
    initializeTrafficLightStore,
    initializeTrafficLightListeners,
+    setTrafficLightVisibility,
    cleanupTrafficLightListeners,
  } = useTrafficLightStore();

@@ -53,6 +54,7 @@ const LibraryHeader: React.FC<LibraryHeaderProps> = ({

    initializeTrafficLightStore(appService);
    initializeTrafficLightListeners();
+    setTrafficLightVisibility(true);
    return () => {
      cleanupTrafficLightListeners();
    };
@@ -14,6 +14,7 @@ import { useSettingsStore } from '@/store/settingsStore';
 import { useTranslation } from '@/hooks/useTranslation';
 import { getStoragePlanData } from '@/utils/access';
 import { navigateToLogin, navigateToProfile } from '@/utils/nav';
+import { tauriHandleToggleFullScreen } from '@/utils/window';
 import { QuotaType } from '@/types/user';
 import MenuItem from '@/components/MenuItem';
 import Quota from '@/components/Quota';
@@ -25,7 +26,7 @@ interface BookMenuProps {
 const SettingsMenu: React.FC<BookMenuProps> = ({ setIsDropdownOpen }) => {
  const _ = useTranslation();
  const router = useRouter();
-  const { envConfig } = useEnv();
+  const { envConfig, appService } = useEnv();
  const { token, user } = useAuth();
  const { settings, setSettings, saveSettings } = useSettingsStore();
  const [quotas, setQuotas] = React.useState<QuotaType[]>([]);
@@ -57,6 +58,11 @@ const SettingsMenu: React.FC<BookMenuProps> = ({ setIsDropdownOpen }) => {
    setIsDropdownOpen?.(false);
  };

+  const handleFullScreen = () => {
+    tauriHandleToggleFullScreen();
+    setIsDropdownOpen?.(false);
+  };
+
  const toggleAutoUploadBooks = () => {
    settings.autoUpload = !settings.autoUpload;
    setSettings(settings);
@@ -157,6 +163,9 @@ const SettingsMenu: React.FC<BookMenuProps> = ({ setIsDropdownOpen }) => {
        onClick={toggleScreenWakeLock}
      />
      <hr className='border-base-200 my-1' />
+      {appService?.hasRoundedWindow && (
+        <MenuItem label={_('Fullscreen')} onClick={handleFullScreen} />
+      )}
      <MenuItem label={_('Reload Page')} onClick={handleReloadPage} />
      <hr className='border-base-200 my-1' />
      {isWebApp && <MenuItem label={_('Download Readest')} onClick={downloadReadest} />}
@@ -17,14 +17,16 @@ import { isTauriAppPlatform, hasUpdater } from '@/services/environment';
 import { checkForAppUpdates } from '@/helpers/updater';
 import { FILE_ACCEPT_FORMATS, SUPPORTED_FILE_EXTS } from '@/services/constants';
 import { impactFeedback } from '@tauri-apps/plugin-haptics';
+import { getCurrentWebview } from '@tauri-apps/api/webview';

 import { useEnv } from '@/context/EnvContext';
 import { useAuth } from '@/context/AuthContext';
-import { useTheme } from '@/hooks/useTheme';
+import { useThemeStore } from '@/store/themeStore';
 import { useTranslation } from '@/hooks/useTranslation';
 import { useLibraryStore } from '@/store/libraryStore';
 import { useSettingsStore } from '@/store/settingsStore';
 import { usePullToRefresh } from '@/hooks/usePullToRefresh';
+import { useTheme } from '@/hooks/useTheme';
 import { useDemoBooks } from './hooks/useDemoBooks';
 import { useBooksSync } from './hooks/useBooksSync';
 import { useScreenWakeLock } from '@/hooks/useScreenWakeLock';
@@ -38,6 +40,7 @@ import LibraryHeader from './components/LibraryHeader';
 import Bookshelf from './components/Bookshelf';
 import BookDetailModal from '@/components/BookDetailModal';
 import useShortcuts from '@/hooks/useShortcuts';
+import DropIndicator from '@/components/DropIndicator';

 const LibraryPageWithSearchParams = () => {
  const searchParams = useSearchParams();
@@ -56,7 +59,8 @@ const LibraryPageContent = ({ searchParams }: { searchParams: ReadonlyURLSearchP
    setCheckOpenWithBooks,
  } = useLibraryStore();
  const _ = useTranslation();
-  const { updateAppTheme } = useTheme();
+  useTheme();
+  const { updateAppTheme } = useThemeStore();
  const { settings, setSettings, saveSettings } = useSettingsStore();
  const [loading, setLoading] = useState(false);
  const isInitiating = useRef(false);
@@ -66,8 +70,10 @@ const LibraryPageContent = ({ searchParams }: { searchParams: ReadonlyURLSearchP
  const [booksTransferProgress, setBooksTransferProgress] = useState<{
    [key: string]: number | null;
  }>({});
+  const [isDragging, setIsDragging] = useState(false);
  const demoBooks = useDemoBooks();
  const containerRef = useRef<HTMLDivElement>(null);
+  const pageRef = useRef<HTMLDivElement>(null);

  useOpenWithBooks();

@@ -102,6 +108,87 @@ const LibraryPageContent = ({ searchParams }: { searchParams: ReadonlyURLSearchP
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [settings]);

+  const handleDropedFiles = async (files: File[] | string[]) => {
+    if (files.length === 0) return;
+    const supportedFiles = files.filter((file) => {
+      let fileExt;
+      if (typeof file === 'string') {
+        fileExt = file.split('.').pop()?.toLowerCase();
+      } else {
+        fileExt = file.name.split('.').pop()?.toLowerCase();
+      }
+      return FILE_ACCEPT_FORMATS.includes(`.${fileExt}`);
+    });
+    if (supportedFiles.length === 0) {
+      eventDispatcher.dispatch('toast', {
+        message: _('No supported files found. Supported formats: {{formats}}', {
+          formats: FILE_ACCEPT_FORMATS,
+        }),
+        type: 'error',
+      });
+      return;
+    }
+
+    if (appService?.hasHaptics) {
+      impactFeedback('medium');
+    }
+
+    await importBooks(supportedFiles);
+  };
+
+  const handleDragOver = (event: React.DragEvent<HTMLDivElement> | DragEvent) => {
+    event.preventDefault();
+    event.stopPropagation();
+    setIsDragging(true);
+  };
+
+  const handleDragLeave = (event: React.DragEvent<HTMLDivElement> | DragEvent) => {
+    event.preventDefault();
+    event.stopPropagation();
+    setIsDragging(false);
+  };
+
+  const handleDrop = async (event: React.DragEvent<HTMLDivElement> | DragEvent) => {
+    event.preventDefault();
+    event.stopPropagation();
+    setIsDragging(false);
+
+    if (event.dataTransfer?.files && event.dataTransfer.files.length > 0) {
+      const files = Array.from(event.dataTransfer.files);
+      handleDropedFiles(files);
+    }
+  };
+
+  useEffect(() => {
+    const libraryPage = document.querySelector('.library-page');
+    libraryPage?.addEventListener('dragover', handleDragOver as unknown as EventListener);
+    libraryPage?.addEventListener('dragleave', handleDragLeave as unknown as EventListener);
+    libraryPage?.addEventListener('drop', handleDrop as unknown as EventListener);
+
+    if (isTauriAppPlatform()) {
+      const unlisten = getCurrentWebview().onDragDropEvent((event) => {
+        if (event.payload.type === 'over') {
+          setIsDragging(true);
+        } else if (event.payload.type === 'drop') {
+          setIsDragging(false);
+          handleDropedFiles(event.payload.paths);
+        } else {
+          setIsDragging(false);
+        }
+      });
+      return () => {
+        unlisten.then((fn) => fn());
+      };
+    }
+
+    return () => {
+      libraryPage?.removeEventListener('dragover', handleDragOver as unknown as EventListener);
+      libraryPage?.removeEventListener('dragleave', handleDragLeave as unknown as EventListener);
+      libraryPage?.removeEventListener('drop', handleDrop as unknown as EventListener);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [pageRef.current]);
+
  const processOpenWithFiles = React.useCallback(
    async (appService: AppService, openWithFiles: string[], libraryBooks: Book[]) => {
      const bookIds: string[] = [];
@@ -204,7 +291,7 @@ const LibraryPageContent = ({ searchParams }: { searchParams: ReadonlyURLSearchP
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [demoBooks, libraryLoaded]);

-  const importBooks = async (files: [string | File]) => {
+  const importBooks = async (files: (string | File)[]) => {
    setLoading(true);
    const failedFiles = [];
    for (const file of files) {
@@ -273,17 +360,18 @@ const LibraryPageContent = ({ searchParams }: { searchParams: ReadonlyURLSearchP
          title: book.title,
        }),
      });
+      return true;
    } catch (err) {
      if (err instanceof Error) {
        if (err.message.includes('Not authenticated') && settings.keepLogin) {
          navigateToLogin(router);
-          return;
+          return false;
        } else if (err.message.includes('Insufficient storage quota')) {
          eventDispatcher.dispatch('toast', {
            type: 'error',
            message: _('Insufficient storage quota'),
          });
-          return;
+          return false;
        }
      }
      eventDispatcher.dispatch('toast', {
@@ -292,6 +380,7 @@ const LibraryPageContent = ({ searchParams }: { searchParams: ReadonlyURLSearchP
          title: book.title,
        }),
      });
+      return false;
    }
  };

@@ -308,6 +397,7 @@ const LibraryPageContent = ({ searchParams }: { searchParams: ReadonlyURLSearchP
          title: book.title,
        }),
      });
+      return true;
    } catch {
      eventDispatcher.dispatch('toast', {
        message: _('Failed to download book: {{title}}', {
@@ -315,6 +405,7 @@ const LibraryPageContent = ({ searchParams }: { searchParams: ReadonlyURLSearchP
        }),
        type: 'error',
      });
+      return false;
    }
  };

@@ -330,6 +421,7 @@ const LibraryPageContent = ({ searchParams }: { searchParams: ReadonlyURLSearchP
          title: book.title,
        }),
      });
+      return true;
    } catch {
      eventDispatcher.dispatch('toast', {
        message: _('Failed to delete book: {{title}}', {
@@ -337,6 +429,7 @@ const LibraryPageContent = ({ searchParams }: { searchParams: ReadonlyURLSearchP
        }),
        type: 'error',
      });
+      return false;
    }
  };

@@ -390,6 +483,7 @@ const LibraryPageContent = ({ searchParams }: { searchParams: ReadonlyURLSearchP

  return (
    <div
+      ref={pageRef}
      className={clsx(
        'library-page bg-base-200 text-base-content flex select-none flex-col overflow-hidden',
        appService?.isIOSApp ? 'h-[100vh]' : 'h-dvh',
@@ -413,11 +507,13 @@ const LibraryPageContent = ({ searchParams }: { searchParams: ReadonlyURLSearchP
          <div
            ref={containerRef}
            className={clsx(
-              'scroll-container mt-12 flex-grow overflow-auto px-4 sm:px-2',
+              'scroll-container drop-zone mt-12 flex-grow overflow-auto px-4 sm:px-2',
              appService?.hasSafeAreaInset && 'mt-[calc(48px+env(safe-area-inset-top))]',
              appService?.hasSafeAreaInset && 'pb-[calc(env(safe-area-inset-bottom))]',
+              isDragging && 'drag-over',
            )}
          >
+            <DropIndicator />
            <Bookshelf
              libraryBooks={libraryBooks}
              isSelectMode={isSelectMode}
@@ -431,7 +527,8 @@ const LibraryPageContent = ({ searchParams }: { searchParams: ReadonlyURLSearchP
            />
          </div>
        ) : (
-          <div className='hero h-screen items-center justify-center'>
+          <div className='hero drop-zone h-screen items-center justify-center'>
+            <DropIndicator />
            <div className='hero-content text-neutral-content text-center'>
              <div className='max-w-md'>
                <h1 className='mb-5 text-5xl font-bold'>{_('Your Library')}</h1>
@@ -2,6 +2,7 @@ import React, { useEffect, useRef, useState } from 'react';
 import { BookDoc, getDirection } from '@/libs/document';
 import { BookConfig } from '@/types/book';
 import { FoliateView, wrappedFoliateView } from '@/types/view';
+import { useThemeStore } from '@/store/themeStore';
 import { useReaderStore } from '@/store/readerStore';
 import { useParallelViewStore } from '@/store/parallelViewStore';
 import { useClickEvent, useTouchEvent } from '../hooks/useIframeEvents';
@@ -11,7 +12,6 @@ import { useProgressAutoSave } from '../hooks/useProgressAutoSave';
 import { useAutoHideScrollbar } from '../hooks/useAutoHideScrollbar';
 import { getStyles, mountAdditionalFonts } from '@/utils/style';
 import { getBookDirFromLanguage, getBookDirFromWritingMode } from '@/utils/book';
-import { useTheme } from '@/hooks/useTheme';
 import { useUICSS } from '@/hooks/useUICSS';
 import {
  handleKeydown,
@@ -36,7 +36,7 @@ const FoliateViewer: React.FC<{
  const { getView, setView: setFoliateView, setProgress } = useReaderStore();
  const { getViewSettings, setViewSettings } = useReaderStore();
  const { getParallels } = useParallelViewStore();
-  const { themeCode } = useTheme();
+  const { themeCode } = useThemeStore();
  const viewSettings = getViewSettings(bookKey)!;

  const [toastMessage, setToastMessage] = useState('');
@@ -91,7 +91,8 @@ const FoliateViewer: React.FC<{

    if (detail.reason === 'scroll') {
      const renderer = viewRef.current?.renderer;
-      if (renderer) {
+      const viewSettings = getViewSettings(bookKey)!;
+      if (renderer && viewSettings.continuousScroll) {
        if (renderer.start <= 0) {
          viewRef.current?.prev(1);
          // sometimes viewSize has subpixel value that the end never reaches
@@ -125,7 +126,7 @@ const FoliateViewer: React.FC<{
  useEffect(() => {
    if (viewRef.current && viewRef.current.renderer) {
      const viewSettings = getViewSettings(bookKey)!;
-      viewRef.current.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+      viewRef.current.renderer.setStyles?.(getStyles(viewSettings));
    }
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [themeCode]);
@@ -158,7 +159,7 @@ const FoliateViewer: React.FC<{
      viewRef.current = view;
      setFoliateView(bookKey, view);

-      view.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+      view.renderer.setStyles?.(getStyles(viewSettings));

      const isScrolled = viewSettings.scrolled!;
      const marginPx = viewSettings.marginPx!;
@@ -67,63 +67,73 @@ const FooterBar: React.FC<FooterBarProps> = ({
    }
  };

+  const isVisible = hoveredBookKey === bookKey;
  const progressInfo = bookFormat === 'PDF' ? section : pageinfo;
  const progressValid = !!progressInfo;
  const progressFraction = progressValid ? (progressInfo!.current + 1) / progressInfo!.total : 0;
+
  return (
-    <div
-      className={clsx(
-        'footer-bar absolute bottom-0 z-10 flex h-12 w-full items-center gap-x-4 px-4',
-        'shadow-xs bg-base-100 transition-opacity duration-300',
-        appService?.hasSafeAreaInset && 'pb-[env(safe-area-inset-bottom)]',
-        appService?.hasRoundedWindow && 'rounded-window-bottom-right',
-        !isSideBarVisible && appService?.hasRoundedWindow && 'rounded-window-bottom-left',
-        isHoveredAnim && 'hover-bar-anim',
-        hoveredBookKey === bookKey ? `opacity-100` : `opacity-0`,
-      )}
-      dir={viewSettings?.rtl ? 'rtl' : 'ltr'}
-      onMouseEnter={() => setHoveredBookKey(bookKey)}
-      onMouseLeave={() => setHoveredBookKey('')}
-    >
-      <div className='hidden sm:flex'>
+    <>
+      <div
+        className='absolute bottom-0 left-0 z-10 h-12 w-full'
+        onMouseEnter={() => setHoveredBookKey(bookKey)}
+        onTouchStart={() => setHoveredBookKey(bookKey)}
+      />
+      <div
+        className={clsx(
+          'footer-bar absolute bottom-0 z-10 flex h-12 w-full items-center gap-x-4 px-4',
+          'shadow-xs bg-base-100 transition-opacity duration-300',
+          appService?.hasSafeAreaInset && 'pb-[env(safe-area-inset-bottom)]',
+          appService?.hasRoundedWindow && 'rounded-window-bottom-right',
+          !isSideBarVisible && appService?.hasRoundedWindow && 'rounded-window-bottom-left',
+          isHoveredAnim && 'hover-bar-anim',
+          viewSettings?.vertical && viewSettings?.scrolled ? 'mb-3 !h-6' : '',
+          isVisible ? `pointer-events-auto opacity-100` : `pointer-events-none opacity-0`,
+        )}
+        dir={viewSettings?.rtl ? 'rtl' : 'ltr'}
+        onMouseLeave={() => setHoveredBookKey('')}
+        aria-hidden={!isVisible}
+      >
+        <div className='hidden sm:flex'>
+          <Button
+            icon={viewSettings?.rtl ? <RiArrowRightWideLine /> : <RiArrowLeftWideLine />}
+            onClick={viewSettings?.rtl ? handleGoNext : handleGoPrev}
+            tooltip={viewSettings?.rtl ? _('Go Right') : _('Go Left')}
+          />
+        </div>
        <Button
-          icon={viewSettings?.rtl ? <RiArrowRightWideLine /> : <RiArrowLeftWideLine />}
-          onClick={viewSettings?.rtl ? handleGoNext : handleGoPrev}
-          tooltip={viewSettings?.rtl ? _('Go Right') : _('Go Left')}
+          icon={viewSettings?.rtl ? <RiArrowGoForwardLine /> : <RiArrowGoBackLine />}
+          onClick={viewSettings?.rtl ? handleGoForward : handleGoBack}
+          tooltip={viewSettings?.rtl ? _('Go Forward') : _('Go Back')}
+          disabled={viewSettings?.rtl ? !view?.history.canGoForward : !view?.history.canGoBack}
        />
-      </div>
-      <Button
-        icon={<RiArrowGoBackLine />}
-        onClick={handleGoBack}
-        tooltip={_('Go Back')}
-        disabled={!view?.history.canGoBack}
-      />
-      <Button
-        icon={<RiArrowGoForwardLine />}
-        onClick={handleGoForward}
-        tooltip={_('Go Forward')}
-        disabled={!view?.history.canGoForward}
-      />
-      <span className='mx-2 text-center text-sm'>
-        {progressValid ? `${Math.round(progressFraction * 100)}%` : ''}
-      </span>
-      <input
-        type='range'
-        className='text-base-content mx-2 w-full'
-        min={0}
-        max={100}
-        value={progressValid ? progressFraction * 100 : 0}
-        onChange={(e) => handleProgressChange(e)}
-      />
-      <Button icon={<FaHeadphones />} onClick={handleSpeakText} tooltip={_('Speak')} />
-      <div className='hidden sm:flex'>
        <Button
-          icon={viewSettings?.rtl ? <RiArrowLeftWideLine /> : <RiArrowRightWideLine />}
-          onClick={viewSettings?.rtl ? handleGoPrev : handleGoNext}
-          tooltip={viewSettings?.rtl ? _('Go Left') : _('Go Right')}
+          icon={viewSettings?.rtl ? <RiArrowGoBackLine /> : <RiArrowGoForwardLine />}
+          onClick={viewSettings?.rtl ? handleGoBack : handleGoForward}
+          tooltip={viewSettings?.rtl ? _('Go Back') : _('Go Forward')}
+          disabled={viewSettings?.rtl ? !view?.history.canGoBack : !view?.history.canGoForward}
        />
+        <span className='mx-2 text-center text-sm'>
+          {progressValid ? `${Math.round(progressFraction * 100)}%` : ''}
+        </span>
+        <input
+          type='range'
+          className='text-base-content mx-2 w-full'
+          min={0}
+          max={100}
+          value={progressValid ? progressFraction * 100 : 0}
+          onChange={(e) => handleProgressChange(e)}
+        />
+        <Button icon={<FaHeadphones />} onClick={handleSpeakText} tooltip={_('Speak')} />
+        <div className='hidden sm:flex'>
+          <Button
+            icon={viewSettings?.rtl ? <RiArrowLeftWideLine /> : <RiArrowRightWideLine />}
+            onClick={viewSettings?.rtl ? handleGoPrev : handleGoNext}
+            tooltip={viewSettings?.rtl ? _('Go Left') : _('Go Right')}
+          />
+        </div>
      </div>
-    </div>
+    </>
  );
 };

@@ -1,9 +1,9 @@
 import React, { useEffect, useRef, useState } from 'react';

 import { BookDoc } from '@/libs/document';
+import { useThemeStore } from '@/store/themeStore';
 import { useReaderStore } from '@/store/readerStore';
 import { useFoliateEvents } from '../hooks/useFoliateEvents';
-import { useTheme } from '@/hooks/useTheme';
 import { getFootnoteStyles, getStyles } from '@/utils/style';
 import { getPopupPosition, getPosition, Position } from '@/utils/sel';
 import { eventDispatcher } from '@/utils/event';
@@ -27,7 +27,7 @@ const FootnotePopup: React.FC<FootnotePopupProps> = ({ bookKey, bookDoc }) => {
  const [popupPosition, setPopupPosition] = useState<Position | null>();
  const [showPopup, setShowPopup] = useState(false);
  const { getView, getViewSettings } = useReaderStore();
-  const { themeCode } = useTheme();
+  const { themeCode } = useThemeStore();
  const view = getView(bookKey);
  const viewSettings = getViewSettings(bookKey)!;
  const footnoteHandler = new FootnoteHandler();
@@ -56,11 +56,18 @@ const HeaderBar: React.FC<HeaderBarProps> = ({

    initializeTrafficLightStore(appService);
    initializeTrafficLightListeners();
-    setTrafficLightVisibility(isSideBarVisible);
+    setTrafficLightVisibility(true);
    return () => {
      cleanupTrafficLightListeners();
    };
    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  useEffect(() => {
+    if (!appService?.hasTrafficLight) return;
+
+    setTrafficLightVisibility(isSideBarVisible);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [isSideBarVisible]);

  return (
@@ -6,6 +6,7 @@ import { useEffect, Suspense, useRef } from 'react';

 import { useEnv } from '@/context/EnvContext';
 import { useTheme } from '@/hooks/useTheme';
+import { useThemeStore } from '@/store/themeStore';
 import { useLibraryStore } from '@/store/libraryStore';
 import { useSettingsStore } from '@/store/settingsStore';
 import { useScreenWakeLock } from '@/hooks/useScreenWakeLock';
@@ -19,7 +20,8 @@ const Reader: React.FC<{ ids?: string }> = ({ ids }) => {
  const { getVisibleLibrary, setLibrary } = useLibraryStore();
  const isInitiating = useRef(false);

-  const { updateAppTheme } = useTheme();
+  const { updateAppTheme } = useThemeStore();
+  useTheme();
  useScreenWakeLock(settings.screenWakeLock);

  useEffect(() => {
@@ -6,12 +6,15 @@ import { TbSunMoon } from 'react-icons/tb';
 import { MdZoomOut, MdZoomIn, MdCheck } from 'react-icons/md';

 import { MAX_ZOOM_LEVEL, MIN_ZOOM_LEVEL, ZOOM_STEP } from '@/services/constants';
-import MenuItem from '@/components/MenuItem';
+import { useEnv } from '@/context/EnvContext';
+import { useThemeStore } from '@/store/themeStore';
 import { useReaderStore } from '@/store/readerStore';
 import { useTranslation } from '@/hooks/useTranslation';
-import { useTheme, ThemeMode } from '@/hooks/useTheme';
+import { ThemeMode } from '@/styles/themes';
 import { getStyles } from '@/utils/style';
 import { getMaxInlineSize } from '@/utils/config';
+import { tauriHandleToggleFullScreen } from '@/utils/window';
+import MenuItem from '@/components/MenuItem';

 interface ViewMenuProps {
  bookKey: string;
@@ -25,19 +28,18 @@ const ViewMenu: React.FC<ViewMenuProps> = ({
  onSetSettingsDialogOpen,
 }) => {
  const _ = useTranslation();
+  const { appService } = useEnv();
  const { getView, getViews, getViewSettings, setViewSettings } = useReaderStore();
  const viewSettings = getViewSettings(bookKey)!;

-  const { themeMode, isDarkMode, themeCode, updateThemeMode } = useTheme();
+  const { themeMode, themeCode, setThemeMode } = useThemeStore();
  const [isScrolledMode, setScrolledMode] = useState(viewSettings!.scrolled);
-  const [isInvertedColors, setInvertedColors] = useState(viewSettings!.invert);
  const [zoomLevel, setZoomLevel] = useState(viewSettings!.zoomLevel!);

  const zoomIn = () => setZoomLevel((prev) => Math.min(prev + ZOOM_STEP, MAX_ZOOM_LEVEL));
  const zoomOut = () => setZoomLevel((prev) => Math.max(prev - ZOOM_STEP, MIN_ZOOM_LEVEL));
  const resetZoom = () => setZoomLevel(100);
  const toggleScrolledMode = () => setScrolledMode(!isScrolledMode);
-  const toggleInvertedColors = () => setInvertedColors(!isInvertedColors);

  const openFontLayoutMenu = () => {
    setIsDropdownOpen?.(false);
@@ -47,40 +49,39 @@ const ViewMenu: React.FC<ViewMenuProps> = ({
  const cycleThemeMode = () => {
    const nextMode: ThemeMode =
      themeMode === 'auto' ? 'light' : themeMode === 'light' ? 'dark' : 'auto';
-    updateThemeMode(nextMode);
+    setThemeMode(nextMode);
+  };
+
+  const handleFullScreen = () => {
+    tauriHandleToggleFullScreen();
+    setIsDropdownOpen?.(false);
  };

  useEffect(() => {
    getViews().forEach((view) => {
-      view.renderer.setStyles?.(getStyles(viewSettings!, themeCode));
+      view.renderer.setStyles?.(getStyles(viewSettings!));
    });
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [themeCode]);

  useEffect(() => {
+    viewSettings!.scrolled = isScrolledMode;
    getView(bookKey)?.renderer.setAttribute('flow', isScrolledMode ? 'scrolled' : 'paginated');
    getView(bookKey)?.renderer.setAttribute(
      'max-inline-size',
      `${getMaxInlineSize(viewSettings)}px`,
    );
-    getView(bookKey)?.renderer.setStyles?.(getStyles(viewSettings!, themeCode));
-    viewSettings!.scrolled = isScrolledMode;
+    getView(bookKey)?.renderer.setStyles?.(getStyles(viewSettings!));
    setViewSettings(bookKey, viewSettings!);
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [isScrolledMode]);

-  useEffect(() => {
-    document.body.classList.toggle('invert', isInvertedColors);
-    getView(bookKey)?.renderer.setStyles?.(getStyles(viewSettings!, themeCode));
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [isInvertedColors]);
-
  useEffect(() => {
    const view = getView(bookKey);
    if (!view) return;
    viewSettings!.zoomLevel = zoomLevel;
    setViewSettings(bookKey, viewSettings!);
-    view.renderer.setStyles?.(getStyles(viewSettings!, themeCode));
+    view.renderer.setStyles?.(getStyles(viewSettings!));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [zoomLevel]);

@@ -131,6 +132,9 @@ const ViewMenu: React.FC<ViewMenuProps> = ({

      <hr className='border-base-300 my-1' />

+      {appService?.hasRoundedWindow && (
+        <MenuItem label={_('Fullscreen')} onClick={handleFullScreen} />
+      )}
      <MenuItem
        label={
          themeMode === 'dark'
@@ -142,12 +146,6 @@ const ViewMenu: React.FC<ViewMenuProps> = ({
        icon={themeMode === 'dark' ? <BiMoon /> : themeMode === 'light' ? <BiSun /> : <TbSunMoon />}
        onClick={cycleThemeMode}
      />
-      <MenuItem
-        label={_('Invert Colors in Dark Mode')}
-        icon={isInvertedColors ? <MdCheck className='text-base-content' /> : undefined}
-        onClick={toggleInvertedColors}
-        disabled={!isDarkMode}
-      />
    </div>
  );
 };
@@ -15,10 +15,10 @@ const NotebookHeader: React.FC<{
  const _ = useTranslation();
  const iconSize14 = useResponsiveSize(14);
  return (
-    <div className='notebook-header relative flex h-11 items-center px-3'>
+    <div className='notebook-header relative flex h-11 items-center px-3' dir='ltr'>
      <div className='absolute inset-0 flex items-center justify-center space-x-2'>
        <LuNotebookPen />
-        <div className='notebook-title text-sm font-medium'>{_('Notebook')}</div>
+        <div className='notebook-title hidden text-sm font-medium sm:flex'>{_('Notebook')}</div>
      </div>
      <div className='z-10 flex items-center gap-x-4'>
        <button
@@ -114,6 +114,7 @@ const NoteEditor: React.FC<NoteEditorProps> = ({ onSave, onEdit }) => {
              'inset-0 w-full rounded-none border-0 bg-transparent p-0',
              'content font-size-sm',
            )}
+            dir='auto'
            ref={editorRef}
            value={note}
            rows={1}
@@ -130,7 +131,7 @@ const NoteEditor: React.FC<NoteEditorProps> = ({ onSave, onEdit }) => {
          <span className='content font-size-xs inline text-gray-500'>{getAnnotationText()}</span>
        </div>
      </div>
-      <div className='flex justify-end p-2'>
+      <div className='flex justify-end p-2' dir='ltr'>
        <button
          className={clsx(
            'content btn btn-ghost font-size-sm hover:bg-transparent',
@@ -7,13 +7,14 @@ import { useReaderStore } from '@/store/readerStore';
 import { useSidebarStore } from '@/store/sidebarStore';
 import { useNotebookStore } from '@/store/notebookStore';
 import { useTranslation } from '@/hooks/useTranslation';
-import { useTheme } from '@/hooks/useTheme';
+import { useThemeStore } from '@/store/themeStore';
 import { useEnv } from '@/context/EnvContext';
 import { useDrag } from '@/hooks/useDrag';
 import { TextSelection } from '@/utils/sel';
 import { BookNote } from '@/types/book';
 import { uniqueId } from '@/utils/misc';
 import { eventDispatcher } from '@/utils/event';
+import { getBookDirFromLanguage } from '@/utils/book';
 import BooknoteItem from '../sidebar/BooknoteItem';
 import NotebookHeader from './Header';
 import NoteEditor from './NoteEditor';
@@ -23,14 +24,14 @@ const MAX_NOTEBOOK_WIDTH = 0.45;

 const Notebook: React.FC = ({}) => {
  const _ = useTranslation();
-  const { updateAppTheme } = useTheme();
+  const { updateAppTheme } = useThemeStore();
  const { envConfig, appService } = useEnv();
  const { settings } = useSettingsStore();
  const { sideBarBookKey } = useSidebarStore();
  const { notebookWidth, isNotebookVisible, isNotebookPinned } = useNotebookStore();
  const { notebookNewAnnotation, notebookEditAnnotation, setNotebookPin } = useNotebookStore();
-  const { getConfig, saveConfig, updateBooknotes } = useBookDataStore();
-  const { getView } = useReaderStore();
+  const { getBookData, getConfig, saveConfig, updateBooknotes } = useBookDataStore();
+  const { getView, getViewSettings } = useReaderStore();
  const { setNotebookWidth, setNotebookVisible, toggleNotebookPin } = useNotebookStore();
  const { setNotebookNewAnnotation, setNotebookEditAnnotation } = useNotebookStore();

@@ -136,6 +137,14 @@ const Notebook: React.FC = ({}) => {

  if (!sideBarBookKey) return null;

+  const bookData = getBookData(sideBarBookKey);
+  const viewSettings = getViewSettings(sideBarBookKey);
+  if (!bookData || !bookData.bookDoc) {
+    return null;
+  }
+  const { bookDoc } = bookData;
+  const languageDir = getBookDirFromLanguage(bookDoc.metadata.language);
+
  const config = getConfig(sideBarBookKey);
  const { booknotes: allNotes = [] } = config || {};
  const annotationNotes = allNotes
@@ -159,6 +168,7 @@ const Notebook: React.FC = ({}) => {
          appService?.hasRoundedWindow && 'rounded-window-top-right rounded-window-bottom-right',
          !isNotebookPinned && 'shadow-2xl',
        )}
+        dir={viewSettings?.rtl && languageDir === 'rtl' ? 'rtl' : 'ltr'}
        style={{
          width: `${notebookWidth}`,
          maxWidth: `${MAX_NOTEBOOK_WIDTH * 100}%`,
@@ -183,7 +193,7 @@ const Notebook: React.FC = ({}) => {
          handleTogglePin={handleTogglePin}
        />
        <div className='max-h-[calc(100vh-44px)] overflow-y-auto px-3'>
-          <div>
+          <div dir='ltr'>
            {excerptNotes.length > 0 && (
              <p className='content font-size-base pt-1'>{_('Excerpts')}</p>
            )}
@@ -196,7 +206,7 @@ const Notebook: React.FC = ({}) => {
                  className='collapse-arrow border-base-300 bg-base-100 collapse border'
                >
                  <div
-                    className='collapse-title font-size-sm h-9 min-h-9 p-2 pr-8 font-medium'
+                    className='collapse-title font-size-sm h-9 min-h-9 p-2 pe-8 font-medium'
                    style={
                      {
                        '--top-override': '1.2rem',
@@ -208,7 +218,7 @@ const Notebook: React.FC = ({}) => {
                  </div>
                  <div className='collapse-content font-size-xs select-text px-3 pb-0'>
                    <p className='hyphens-auto text-justify'>{item.text}</p>
-                    <div className='flex justify-end'>
+                    <div className='flex justify-end' dir='ltr'>
                      <div
                        className='font-size-xs cursor-pointer align-bottom text-red-500 hover:text-red-600'
                        onClick={handleEditNote.bind(null, item, true)}
@@ -221,7 +231,7 @@ const Notebook: React.FC = ({}) => {
              </li>
            ))}
          </ul>
-          <div>
+          <div dir='ltr'>
            {(notebookNewAnnotation || annotationNotes.length > 0) && (
              <p className='content font-size-base pt-1'>{_('Notes')}</p>
            )}
@@ -3,24 +3,24 @@ import { MdOutlineLightMode, MdOutlineDarkMode } from 'react-icons/md';
 import { MdRadioButtonUnchecked, MdRadioButtonChecked } from 'react-icons/md';
 import { TbSunMoon } from 'react-icons/tb';

-import { useTheme } from '@/hooks/useTheme';
 import { themes } from '@/styles/themes';
 import { getStyles } from '@/utils/style';
+import { useThemeStore } from '@/store/themeStore';
 import { useReaderStore } from '@/store/readerStore';
 import { useTranslation } from '@/hooks/useTranslation';
 import { useResponsiveSize } from '@/hooks/useResponsiveSize';

 const ColorPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
  const _ = useTranslation();
-  const { themeMode, themeColor, themeCode, isDarkMode, updateThemeMode, updateThemeColor } =
-    useTheme();
+  const { themeMode, themeColor, themeCode, isDarkMode, setThemeMode, setThemeColor } =
+    useThemeStore();
  const { getViews, getViewSettings } = useReaderStore();
  const viewSettings = getViewSettings(bookKey)!;
  const iconSize24 = useResponsiveSize(24);

  useEffect(() => {
    getViews().forEach((view) => {
-      view.renderer.setStyles?.(getStyles(viewSettings!, themeCode));
+      view.renderer.setStyles?.(getStyles(viewSettings!));
    });
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [themeCode]);
@@ -29,11 +29,11 @@ const ColorPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
    <div className='my-4 w-full space-y-6'>
      <div className='flex items-center justify-between'>
        <h2 className='font-medium'>{_('Theme Mode')}</h2>
-        <div className='flex gap-2'>
+        <div className='flex gap-4'>
          <div className='lg:tooltip lg:tooltip-bottom' data-tip={_('Auto Mode')}>
            <button
-              className={`btn btn-ghost btn-circle ${themeMode === 'auto' ? 'btn-active bg-base-300' : ''}`}
-              onClick={() => updateThemeMode('auto')}
+              className={`btn btn-ghost btn-circle btn-sm ${themeMode === 'auto' ? 'btn-active bg-base-300' : ''}`}
+              onClick={() => setThemeMode('auto')}
            >
              <TbSunMoon />
            </button>
@@ -41,8 +41,8 @@ const ColorPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {

          <div className='lg:tooltip lg:tooltip-bottom' data-tip={_('Light Mode')}>
            <button
-              className={`btn btn-ghost btn-circle ${themeMode === 'light' ? 'btn-active bg-base-300' : ''}`}
-              onClick={() => updateThemeMode('light')}
+              className={`btn btn-ghost btn-circle btn-sm ${themeMode === 'light' ? 'btn-active bg-base-300' : ''}`}
+              onClick={() => setThemeMode('light')}
            >
              <MdOutlineLightMode />
            </button>
@@ -50,8 +50,8 @@ const ColorPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {

          <div className='lg:tooltip lg:tooltip-bottom' data-tip={_('Dark Mode')}>
            <button
-              className={`btn btn-ghost btn-circle ${themeMode === 'dark' ? 'btn-active bg-base-300' : ''}`}
-              onClick={() => updateThemeMode('dark')}
+              className={`btn btn-ghost btn-circle btn-sm ${themeMode === 'dark' ? 'btn-active bg-base-300' : ''}`}
+              onClick={() => setThemeMode('dark')}
            >
              <MdOutlineDarkMode />
            </button>
@@ -78,7 +78,7 @@ const ColorPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
                name='theme'
                value={name}
                checked={themeColor === name}
-                onChange={() => updateThemeColor(name)}
+                onChange={() => setThemeColor(name)}
                className='hidden'
              />
              {themeColor === name ? (
@@ -16,7 +16,6 @@ import {
 import { useReaderStore } from '@/store/readerStore';
 import { useSettingsStore } from '@/store/settingsStore';
 import { useTranslation } from '@/hooks/useTranslation';
-import { useTheme } from '@/hooks/useTheme';
 import { useEnv } from '@/context/EnvContext';
 import { getStyles } from '@/utils/style';
 import { getOSPlatform } from '@/utils/misc';
@@ -66,7 +65,6 @@ const FontPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
  const { getView, getViewSettings, setViewSettings } = useReaderStore();
  const view = getView(bookKey);
  const viewSettings = getViewSettings(bookKey)!;
-  const { themeCode } = useTheme();

  const fontFamilyOptions = [
    {
@@ -126,7 +124,7 @@ const FontPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.defaultFont = defaultFont;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [defaultFont]);

@@ -137,7 +135,7 @@ const FontPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.defaultFontSize = defaultFontSize;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [defaultFontSize]);

@@ -148,7 +146,7 @@ const FontPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.minimumFontSize = minFontSize;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [minFontSize]);

@@ -159,7 +157,7 @@ const FontPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.fontWeight = fontWeight;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [fontWeight]);

@@ -170,7 +168,7 @@ const FontPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.serifFont = serifFont;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [serifFont]);

@@ -181,7 +179,7 @@ const FontPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.sansSerifFont = sansSerifFont;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [sansSerifFont]);

@@ -192,7 +190,7 @@ const FontPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.monospaceFont = monospaceFont;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [monospaceFont]);

@@ -203,7 +201,7 @@ const FontPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.overrideFont = overrideFont;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [overrideFont]);

@@ -7,7 +7,6 @@ import { useSettingsStore } from '@/store/settingsStore';
 import { useReaderStore } from '@/store/readerStore';
 import { useBookDataStore } from '@/store/bookDataStore';
 import { useTranslation } from '@/hooks/useTranslation';
-import { useTheme } from '@/hooks/useTheme';
 import { getStyles } from '@/utils/style';
 import { getMaxInlineSize } from '@/utils/config';
 import { getBookDirFromWritingMode, getBookLangCode } from '@/utils/book';
@@ -21,7 +20,6 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
  const view = getView(bookKey);
  const bookData = getBookData(bookKey)!;
  const viewSettings = getViewSettings(bookKey)!;
-  const { themeCode } = useTheme();

  const [paragraphMargin, setParagraphMargin] = useState(viewSettings.paragraphMargin!);
  const [lineHeight, setLineHeight] = useState(viewSettings.lineHeight!);
@@ -45,7 +43,7 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.paragraphMargin = paragraphMargin;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [paragraphMargin]);

@@ -56,7 +54,7 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.lineHeight = lineHeight;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [lineHeight]);

@@ -67,7 +65,7 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.wordSpacing = wordSpacing;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [wordSpacing]);

@@ -78,7 +76,7 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.letterSpacing = letterSpacing;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [letterSpacing]);

@@ -89,7 +87,7 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.textIndent = textIndent;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [textIndent]);

@@ -100,7 +98,7 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.fullJustification = fullJustification;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [fullJustification]);

@@ -111,7 +109,7 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.hyphenation = hyphenation;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [hyphenation]);

@@ -180,7 +178,7 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
    viewSettings.writingMode = writingMode;
    setViewSettings(bookKey, viewSettings);
    if (view) {
-      view.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+      view.renderer.setStyles?.(getStyles(viewSettings));
      view.book.dir = getBookDirFromWritingMode(writingMode);
    }
    if (
@@ -199,7 +197,7 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      settings.globalViewSettings.overrideLayout = overrideLayout;
      setSettings(settings);
    }
-    view?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings));
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [overrideLayout]);

@@ -213,10 +211,10 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
        <div className='w-full'>
          <div className='flex items-center justify-between'>
            <h2 className='font-medium'>{_('Writing Mode')}</h2>
-            <div className='flex gap-2'>
+            <div className='flex gap-4'>
              <div className='lg:tooltip lg:tooltip-bottom' data-tip={_('Default')}>
                <button
-                  className={`btn btn-ghost btn-circle ${writingMode === 'auto' ? 'btn-active bg-base-300' : ''}`}
+                  className={`btn btn-ghost btn-circle btn-sm ${writingMode === 'auto' ? 'btn-active bg-base-300' : ''}`}
                  onClick={() => setWritingMode('auto')}
                >
                  <MdOutlineAutoMode />
@@ -225,7 +223,7 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {

              <div className='lg:tooltip lg:tooltip-bottom' data-tip={_('Horizontal Direction')}>
                <button
-                  className={`btn btn-ghost btn-circle ${writingMode === 'horizontal-tb' ? 'btn-active bg-base-300' : ''}`}
+                  className={`btn btn-ghost btn-circle btn-sm ${writingMode === 'horizontal-tb' ? 'btn-active bg-base-300' : ''}`}
                  onClick={() => setWritingMode('horizontal-tb')}
                >
                  <MdOutlineTextRotationNone />
@@ -234,7 +232,7 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {

              <div className='lg:tooltip lg:tooltip-bottom' data-tip={_('Vertical Direction')}>
                <button
-                  className={`btn btn-ghost btn-circle ${writingMode === 'vertical-rl' ? 'btn-active bg-base-300' : ''}`}
+                  className={`btn btn-ghost btn-circle btn-sm ${writingMode === 'vertical-rl' ? 'btn-active bg-base-300' : ''}`}
                  onClick={() => setWritingMode('vertical-rl')}
                >
                  <MdTextRotateVertical />
@@ -243,7 +241,7 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {

              <div className='lg:tooltip lg:tooltip-bottom' data-tip={_('RTL Direction')}>
                <button
-                  className={`btn btn-ghost btn-circle ${writingMode === 'horizontal-rl' ? 'btn-active bg-base-300' : ''}`}
+                  className={`btn btn-ghost btn-circle btn-sm ${writingMode === 'horizontal-rl' ? 'btn-active bg-base-300' : ''}`}
                  onClick={() => setWritingMode('horizontal-rl')}
                >
                  <TbTextDirectionRtl />
@@ -358,19 +356,20 @@ const LayoutPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
              max={4}
            />
            <NumberInput
-              label={_('Maximum Inline Size')}
+              label={viewSettings.vertical ? _('Maximum Column Height') : _('Maximum Column Width')}
              value={maxInlineSize}
              onChange={setMaxInlineSize}
              disabled={maxColumnCount === 1 || viewSettings.scrolled}
-              min={500}
+              min={400}
              max={9999}
              step={100}
            />
            <NumberInput
-              label={_('Maximum Block Size')}
+              label={viewSettings.vertical ? _('Maximum Column Width') : _('Maximum Column Height')}
              value={maxBlockSize}
              onChange={setMaxBlockSize}
-              min={500}
+              disabled={maxColumnCount === 1 || viewSettings.scrolled}
+              min={400}
              max={9999}
              step={100}
            />
@@ -4,7 +4,6 @@ import { useReaderStore } from '@/store/readerStore';
 import { useSettingsStore } from '@/store/settingsStore';
 import { useTranslation } from '@/hooks/useTranslation';
 import { getStyles } from '@/utils/style';
-import { useTheme } from '@/hooks/useTheme';
 import cssbeautify from 'cssbeautify';
 import cssValidate from '@/utils/css';

@@ -13,10 +12,10 @@ const MiscPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
  const { settings, isFontLayoutSettingsGlobal, setSettings } = useSettingsStore();
  const { getView, getViewSettings, setViewSettings } = useReaderStore();
  const viewSettings = getViewSettings(bookKey)!;
-  const { themeCode } = useTheme();

  const [animated, setAnimated] = useState(viewSettings.animated!);
  const [isDisableClick, setIsDisableClick] = useState(viewSettings.disableClick!);
+  const [isContinuousScroll, setIsContinuousScroll] = useState(viewSettings.continuousScroll!);
  const [draftStylesheet, setDraftStylesheet] = useState(viewSettings.userStylesheet!);
  const [draftStylesheetSaved, setDraftStylesheetSaved] = useState(true);
  const [error, setError] = useState<string | null>(null);
@@ -59,7 +58,7 @@ const MiscPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      setSettings(settings);
    }

-    getView(bookKey)?.renderer.setStyles?.(getStyles(viewSettings, themeCode));
+    getView(bookKey)?.renderer.setStyles?.(getStyles(viewSettings));
  };

  const handleInput = (e: React.FormEvent<HTMLTextAreaElement>) => {
@@ -92,12 +91,22 @@ const MiscPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [isDisableClick]);

+  useEffect(() => {
+    viewSettings.continuousScroll = isContinuousScroll;
+    setViewSettings(bookKey, viewSettings);
+    if (isFontLayoutSettingsGlobal) {
+      settings.globalViewSettings.continuousScroll = isContinuousScroll;
+      setSettings(settings);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isContinuousScroll]);
+
  return (
    <div className='my-4 w-full space-y-6'>
      <div className='w-full'>
        <h2 className='mb-2 font-medium'>{_('Animation')}</h2>
        <div className='card border-base-200 bg-base-100 border shadow'>
-          <div className='divide-y'>
+          <div className='divide-base-200 divide-y'>
            <div className='config-item config-item-top config-item-bottom'>
              <span className=''>{_('Paging Animation')}</span>
              <input
@@ -114,8 +123,17 @@ const MiscPanel: React.FC<{ bookKey: string }> = ({ bookKey }) => {
      <div className='w-full'>
        <h2 className='mb-2 font-medium'>{_('Behavior')}</h2>
        <div className='card border-base-200 bg-base-100 border shadow'>
-          <div className='divide-y'>
-            <div className='config-item config-item-top config-item-bottom'>
+          <div className='divide-base-200 divide-y'>
+            <div className='config-item config-item-top'>
+              <span className=''>{_('Continuous Scroll')}</span>
+              <input
+                type='checkbox'
+                className='toggle'
+                checked={isContinuousScroll}
+                onChange={() => setIsContinuousScroll(!isContinuousScroll)}
+              />
+            </div>
+            <div className='config-item config-item-bottom'>
              <span className=''>{_('Disable Click-to-Flip')}</span>
              <input
                type='checkbox'
@@ -1,7 +1,9 @@
+import clsx from 'clsx';
 import React from 'react';
 import Image from 'next/image';
 import { MdInfoOutline } from 'react-icons/md';
 import { Book } from '@/types/book';
+import { useThemeStore } from '@/store/themeStore';
 import { useTranslation } from '@/hooks/useTranslation';
 import { eventDispatcher } from '@/utils/event';
 import { useResponsiveSize } from '@/hooks/useResponsiveSize';
@@ -10,6 +12,7 @@ import { formatAuthors, formatTitle } from '@/utils/book';
 const BookCard = ({ book }: { book: Book }) => {
  const { coverImageUrl, title, author } = book;
  const _ = useTranslation();
+  const { isDarkMode } = useThemeStore();
  const iconSize18 = useResponsiveSize(18);

  const showBookDetails = () => {
@@ -23,14 +26,17 @@ const BookCard = ({ book }: { book: Book }) => {
        alt={_('Book Cover')}
        width={56}
        height={80}
-        className='me-4 aspect-auto max-h-16 w-[15%] max-w-12 rounded-sm object-cover shadow-md'
+        className={clsx(
+          'me-4 aspect-auto max-h-16 w-[15%] max-w-12 rounded-sm object-cover shadow-md',
+          isDarkMode ? 'mix-blend-screen' : 'mix-blend-multiply',
+        )}
        onError={(e) => {
          (e.target as HTMLImageElement).style.display = 'none';
        }}
      />
      <div className='min-w-0 flex-1'>
        <h4 className='line-clamp-2 w-[90%] text-sm font-semibold'>{formatTitle(title)}</h4>
-        <p className='text-neutral-content truncate text-xs'>{formatAuthors(author)}</p>
+        <p className='truncate text-xs opacity-75'>{formatAuthors(author)}</p>
      </div>
      <button
        className='btn btn-ghost hover:bg-base-300 h-6 min-h-6 w-6 rounded-full p-0 transition-colors'
@@ -81,12 +81,16 @@ const BooknoteItem: React.FC<BooknoteItemProps> = ({ bookKey, item }) => {
          } as React.CSSProperties
        }
      >
-        {item.note && <span className='content font-size-sm font-normal'>{item.note}</span>}
+        {item.note && (
+          <span className='content font-size-sm font-normal' dir='auto'>
+            {item.note}
+          </span>
+        )}
        <div className='flex items-start'>
          {item.note && (
-            <div className='my-1 mr-2 min-h-full self-stretch border-l-2 border-gray-300'></div>
+            <div className='my-1 me-2 min-h-full self-stretch border-l-2 border-gray-300'></div>
          )}
-          <div className={clsx('content font-size-sm line-clamp-3', item.note && 'py-2')}>
+          <div className={clsx('content font-size-sm line-clamp-3', item.note && 'my-2')}>
            <span
              className={clsx(
                'inline',
@@ -116,7 +120,7 @@ const BooknoteItem: React.FC<BooknoteItemProps> = ({ bookKey, item }) => {
        }
        onClick={(e) => e.stopPropagation()}
      >
-        <div className='flex justify-end space-x-3 p-2'>
+        <div className='flex justify-end space-x-3 p-2' dir='ltr'>
          {item.note && (
            <button
              className={clsx(
@@ -1,3 +1,4 @@
+import clsx from 'clsx';
 import React, { useEffect, useRef, useState } from 'react';
 import { FaSearch, FaChevronDown } from 'react-icons/fa';

@@ -7,9 +8,9 @@ import { useBookDataStore } from '@/store/bookDataStore';
 import { useReaderStore } from '@/store/readerStore';
 import { useTranslation } from '@/hooks/useTranslation';
 import { BookSearchConfig, BookSearchResult } from '@/types/book';
+import { useResponsiveSize } from '@/hooks/useResponsiveSize';
 import Dropdown from '@/components/Dropdown';
 import SearchOptions from './SearchOptions';
-import { useResponsiveSize } from '@/hooks/useResponsiveSize';

 const MINIMUM_SEARCH_TERM_LENGTH_DEFAULT = 2;
 const MINIMUM_SEARCH_TERM_LENGTH_CJK = 1;
@@ -172,7 +173,11 @@ const SearchBar: React.FC<SearchBarProps> = ({

        <div className='bg-base-300 flex h-8 w-8 items-center rounded-r-lg'>
          <Dropdown
-            className='dropdown-bottom flex justify-center'
+            className={clsx(
+              window.innerWidth < 640 && 'dropdown-end',
+              'dropdown-bottom flex justify-center',
+            )}
+            menuClassName={window.innerWidth < 640 ? 'no-triangle mt-1' : 'dropdown-center mt-3'}
            buttonClassName='btn btn-ghost h-8 min-h-8 w-8 p-0 rounded-none rounded-r-lg'
            toggleButton={<FaChevronDown size={iconSize12} className='text-gray-500' />}
          >
@@ -1,3 +1,4 @@
+import clsx from 'clsx';
 import React from 'react';
 import { MdCheck } from 'react-icons/md';
 import { BookSearchConfig } from '@/types/book';
@@ -6,6 +7,7 @@ import { useDefaultIconSize } from '@/hooks/useResponsiveSize';

 interface SearchOptionsProps {
  searchConfig: BookSearchConfig;
+  menuClassName?: string;
  onSearchConfigChanged: (searchConfig: BookSearchConfig) => void;
  setIsDropdownOpen?: (isOpen: boolean) => void;
 }
@@ -32,6 +34,7 @@ const Option: React.FC<OptionProps> = ({ label, isActive, onClick }) => (

 const SearchOptions: React.FC<SearchOptionsProps> = ({
  searchConfig,
+  menuClassName,
  onSearchConfigChanged,
  setIsDropdownOpen,
 }) => {
@@ -44,7 +47,10 @@ const SearchOptions: React.FC<SearchOptionsProps> = ({
  return (
    <div
      tabIndex={0}
-      className='book-menu dropdown-content dropdown-center border-base-200 z-20 mt-3 w-56 border shadow-2xl'
+      className={clsx(
+        'book-menu dropdown-content dropdown-center border-base-200 z-20 w-56 border shadow-2xl',
+        menuClassName,
+      )}
    >
      <Option
        label={_('Book')}
@@ -8,9 +8,10 @@ import { useReaderStore } from '@/store/readerStore';
 import { useSidebarStore } from '@/store/sidebarStore';
 import { BookSearchResult } from '@/types/book';
 import { eventDispatcher } from '@/utils/event';
+import { getBookDirFromLanguage } from '@/utils/book';
 import { useEnv } from '@/context/EnvContext';
-import { useTheme } from '@/hooks/useTheme';
 import { useDrag } from '@/hooks/useDrag';
+import { useThemeStore } from '@/store/themeStore';
 import SidebarHeader from './Header';
 import SidebarContent from './Content';
 import BookCard from './BookCard';
@@ -28,7 +29,7 @@ const SideBar: React.FC<{
  onGoToLibrary: () => void;
 }> = ({ onGoToLibrary }) => {
  const { appService } = useEnv();
-  const { updateAppTheme } = useTheme();
+  const { updateAppTheme } = useThemeStore();
  const { settings } = useSettingsStore();
  const { sideBarBookKey } = useSidebarStore();
  const { getBookData } = useBookDataStore();
@@ -168,6 +169,7 @@ const SideBar: React.FC<{
    return null;
  }
  const { book, bookDoc } = bookData;
+  const languageDir = getBookDirFromLanguage(bookDoc.metadata.language);

  return isSideBarVisible ? (
    <>
@@ -179,7 +181,7 @@ const SideBar: React.FC<{
          appService?.hasRoundedWindow && 'rounded-window-top-left rounded-window-bottom-left',
          !isSideBarPinned && 'shadow-2xl',
        )}
-        dir={viewSettings?.rtl ? 'rtl' : 'ltr'}
+        dir={viewSettings?.rtl && languageDir === 'rtl' ? 'rtl' : 'ltr'}
        style={{
          width: `${sideBarWidth}`,
          maxWidth: `${MAX_SIDEBAR_WIDTH * 100}%`,
@@ -5,7 +5,6 @@ import useShortcuts from '@/hooks/useShortcuts';
 import useBooksManager from './useBooksManager';
 import { useSidebarStore } from '@/store/sidebarStore';
 import { useSettingsStore } from '@/store/settingsStore';
-import { useTheme } from '@/hooks/useTheme';
 import { getStyles } from '@/utils/style';
 import { tauriQuitApp } from '@/utils/window';
 import { MAX_ZOOM_LEVEL, MIN_ZOOM_LEVEL, ZOOM_STEP } from '@/services/constants';
@@ -21,7 +20,6 @@ const useBookShortcuts = ({ sideBarBookKey, bookKeys }: UseBookShortcutsProps) =
  const { setFontLayoutSettingsDialogOpen } = useSettingsStore();
  const { toggleNotebook } = useNotebookStore();
  const { getNextBookKey } = useBooksManager();
-  const { themeCode } = useTheme();
  const viewSettings = getViewSettings(sideBarBookKey ?? '');
  const fontSize = viewSettings?.defaultFontSize ?? 16;
  const lineHeight = viewSettings?.lineHeight ?? 1.6;
@@ -100,7 +98,7 @@ const useBookShortcuts = ({ sideBarBookKey, bookKeys }: UseBookShortcutsProps) =
    const zoomLevel = viewSettings!.zoomLevel + ZOOM_STEP;
    viewSettings!.zoomLevel = Math.min(zoomLevel, MAX_ZOOM_LEVEL);
    setViewSettings(sideBarBookKey, viewSettings!);
-    view?.renderer.setStyles?.(getStyles(viewSettings!, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings!));
  };

  const zoomOut = () => {
@@ -111,7 +109,7 @@ const useBookShortcuts = ({ sideBarBookKey, bookKeys }: UseBookShortcutsProps) =
    const zoomLevel = viewSettings!.zoomLevel - ZOOM_STEP;
    viewSettings!.zoomLevel = Math.max(zoomLevel, MIN_ZOOM_LEVEL);
    setViewSettings(sideBarBookKey, viewSettings!);
-    view?.renderer.setStyles?.(getStyles(viewSettings!, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings!));
  };

  const resetZoom = () => {
@@ -121,7 +119,7 @@ const useBookShortcuts = ({ sideBarBookKey, bookKeys }: UseBookShortcutsProps) =
    const viewSettings = getViewSettings(sideBarBookKey)!;
    viewSettings!.zoomLevel = 100;
    setViewSettings(sideBarBookKey, viewSettings!);
-    view?.renderer.setStyles?.(getStyles(viewSettings!, themeCode));
+    view?.renderer.setStyles?.(getStyles(viewSettings!));
  };

  useShortcuts(
@@ -58,12 +58,15 @@ export const useClickEvent = (
              }
            }
          }
-        } else if (msg.data.type === 'iframe-wheel' && !viewSettings.scrolled) {
+        } else if (msg.data.type === 'iframe-wheel') {
          const { deltaY } = msg.data;
+          const fontSize = viewSettings?.defaultFontSize ?? 16;
+          const lineHeight = viewSettings?.lineHeight ?? 1.6;
+          const distance = fontSize * lineHeight * 3;
          if (deltaY > 0) {
-            viewRef.current?.next(1);
+            viewRef.current?.next(viewSettings.scrolled ? distance : 1);
          } else if (deltaY < 0) {
-            viewRef.current?.prev(1);
+            viewRef.current?.prev(viewSettings.scrolled ? distance : 1);
          }
        } else if (msg.data.type === 'iframe-mouseup') {
          if (msg.data.button === 3) {
@@ -1,7 +1,6 @@
 'use client';

 import { useEffect } from 'react';
-import { useTheme } from '@/hooks/useTheme';
 import { hasUpdater } from '@/services/environment';
 import { checkForAppUpdates } from '@/helpers/updater';
 import { useTranslation } from '@/hooks/useTranslation';
@@ -13,7 +12,6 @@ export default function Page() {
  const _ = useTranslation();
  const { settings } = useSettingsStore();

-  useTheme();
  useOpenWithBooks();

  useEffect(() => {
@@ -20,7 +20,7 @@ export const AboutWindow = () => {
  const [isUpdated, setIsUpdated] = React.useState(false);

  const handleCheckUpdate = async () => {
-    const update = await checkForAppUpdates(_);
+    const update = await checkForAppUpdates(_, false);
    if (!update) {
      setIsUpdated(true);
    }
@@ -120,7 +120,7 @@ const Dialog: React.FC<DialogProps> = ({
      >
        {window.innerWidth < 640 && (
          <div
-            className='drag-handle flex h-10 w-full cursor-row-resize items-center justify-center'
+            className='drag-handle flex h-10 max-h-10 min-h-10 w-full cursor-row-resize items-center justify-center'
            onMouseDown={handleDragStart}
            onTouchStart={handleDragStart}
          >
@@ -0,0 +1,20 @@
+import React from 'react';
+import { useTranslation } from '@/hooks/useTranslation';
+import { HiArrowDownTray } from 'react-icons/hi2';
+
+const DropIndicator: React.FC = () => {
+  const _ = useTranslation();
+  return (
+    <>
+      <div className='drag-overlay'></div>
+      <div className='drop-indicator'>
+        <div className='flex flex-col items-center justify-center'>
+          <HiArrowDownTray className='h-12 w-12' />
+          <p className='mt-2 font-medium'>{_('Drop to Import Books')}</p>
+        </div>
+      </div>
+    </>
+  );
+};
+
+export default DropIndicator;
@@ -3,6 +3,7 @@
 import React, { createContext, useState, useContext, ReactNode, useEffect } from 'react';
 import { User } from '@supabase/supabase-js';
 import { supabase } from '@/utils/supabase';
+import posthog from 'posthog-js';

 interface AuthContextType {
  token: string | null;
@@ -38,6 +39,7 @@ export const AuthProvider = ({ children }: { children: ReactNode }) => {
        localStorage.setItem('token', access_token);
        localStorage.setItem('refresh_token', refresh_token);
        localStorage.setItem('user', JSON.stringify(user));
+        posthog.identify(user.id);
        setToken(access_token);
        setUser(user);
      } else {
@@ -6,10 +6,11 @@ import { TranslationFunc } from '@/hooks/useTranslation';

 const LAST_CHECK_KEY = 'lastAppUpdateCheck';

-export const checkForAppUpdates = async (_: TranslationFunc) => {
+export const checkForAppUpdates = async (_: TranslationFunc, autoCheck = true) => {
  const lastCheck = localStorage.getItem(LAST_CHECK_KEY);
  const now = Date.now();
-  if (lastCheck && now - parseInt(lastCheck, 10) < CHECK_UPDATE_INTERVAL_SEC * 1000) return;
+  if (autoCheck && lastCheck && now - parseInt(lastCheck, 10) < CHECK_UPDATE_INTERVAL_SEC * 1000)
+    return;
  localStorage.setItem(LAST_CHECK_KEY, now.toString());

  console.log('Checking for updates');
@@ -1,109 +1,12 @@
-'use client';
-
-import { useEffect, useState } from 'react';
-import { ThemeCode } from '@/utils/style';
-import { themes, Palette } from '@/styles/themes';
-import { isWebAppPlatform } from '@/services/environment';
-
-export type ThemeMode = 'auto' | 'light' | 'dark';
+import { useEffect } from 'react';
+import { useThemeStore } from '@/store/themeStore';

 export const useTheme = () => {
-  const [themeMode, setThemeMode] = useState<ThemeMode>(() => {
-    if (typeof window !== 'undefined' && localStorage) {
-      return (localStorage.getItem('themeMode') as ThemeMode) || 'auto';
-    }
-    return 'auto';
-  });
-
-  const [themeColor, setThemeColor] = useState(() => {
-    if (typeof window !== 'undefined' && localStorage) {
-      return localStorage.getItem('themeColor') || 'default';
-    }
-    return 'default';
-  });
-
-  const [systemIsDarkMode, setSystemIsDarkMode] = useState(() => {
-    return (
-      typeof window !== 'undefined' && window.matchMedia('(prefers-color-scheme: dark)').matches
-    );
-  });
-
-  const isDarkMode = themeMode === 'dark' || (themeMode === 'auto' && systemIsDarkMode);
-
-  const [themeCode, setThemeCode] = useState<ThemeCode>(() => {
-    let themeMode = 'auto';
-    let themeColor = 'default';
-    let systemIsDarkMode = false;
-    if (typeof window !== 'undefined') {
-      themeColor = localStorage.getItem('themeColor') || 'default';
-      themeMode = localStorage.getItem('themeMode') as ThemeMode;
-      systemIsDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;
-    }
-    const isDarkMode = themeMode === 'dark' || (themeMode === 'auto' && systemIsDarkMode);
-    const defaultTheme = themes.find((theme) => theme.name === themeColor);
-    const defaultPalette = isDarkMode ? defaultTheme!.colors.dark : defaultTheme!.colors.light;
-    return {
-      bg: defaultPalette['base-100'],
-      fg: defaultPalette['base-content'],
-      primary: defaultPalette.primary,
-      palette: defaultPalette,
-    };
-  });
-
-  useEffect(() => {
-    if (typeof window !== 'undefined') {
-      const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
-      const handleSystemThemeChange = () => {
-        setSystemIsDarkMode(mediaQuery.matches);
-      };
-
-      mediaQuery.addEventListener('change', handleSystemThemeChange);
-      return () => mediaQuery.removeEventListener('change', handleSystemThemeChange);
-    }
-    return undefined;
-  }, []);
-
+  const { themeColor, isDarkMode } = useThemeStore();
  useEffect(() => {
    document.documentElement.setAttribute(
      'data-theme',
      `${themeColor}-${isDarkMode ? 'dark' : 'light'}`,
    );
  }, [themeColor, isDarkMode]);
-
-  useEffect(() => {
-    if (typeof window !== 'undefined' && localStorage) {
-      localStorage.setItem('themeMode', themeMode);
-      localStorage.setItem('themeColor', themeColor);
-    }
-    const isDarkMode = themeMode === 'dark' || (themeMode === 'auto' && systemIsDarkMode);
-    const theme = themes.find((t) => t.name === themeColor);
-    const palette = isDarkMode ? theme!.colors.dark : theme!.colors.light;
-    const bg = palette['base-100'];
-    const fg = palette['base-content'];
-    const primary = palette.primary;
-    if (isWebAppPlatform()) {
-      document.querySelector('meta[name="theme-color"]')?.setAttribute('content', bg);
-    }
-    setThemeCode({ bg, fg, primary, palette });
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [themeMode, themeColor, isDarkMode]);
-
-  const updateThemeMode = (mode: ThemeMode) => setThemeMode(mode);
-  const updateThemeColor = (color: string) => setThemeColor(color);
-  const updateAppTheme = (color: keyof Palette) => {
-    if (isWebAppPlatform()) {
-      const { palette } = themeCode;
-      document.querySelector('meta[name="theme-color"]')?.setAttribute('content', palette[color]);
-    }
-  };
-
-  return {
-    themeMode,
-    themeColor,
-    themeCode,
-    isDarkMode,
-    updateThemeMode,
-    updateThemeColor,
-    updateAppTheme,
-  };
 };
@@ -62,6 +62,7 @@ export const DEFAULT_BOOK_LAYOUT: BookLayout = {
  gapPercent: 5,
  scrolled: false,
  disableClick: false,
+  continuousScroll: false,
  maxColumnCount: 2,
  maxInlineSize: getDefaultMaxInlineSize(),
  maxBlockSize: getDefaultMaxBlockSize(),
@@ -0,0 +1,85 @@
+import { create } from 'zustand';
+import { getThemeCode, ThemeCode } from '@/utils/style';
+import { Palette, ThemeMode } from '@/styles/themes';
+import { isWebAppPlatform } from '@/services/environment';
+
+interface ThemeState {
+  themeMode: ThemeMode;
+  themeColor: string;
+  systemIsDarkMode: boolean;
+  themeCode: ThemeCode;
+  isDarkMode: boolean;
+  setThemeMode: (mode: ThemeMode) => void;
+  setThemeColor: (color: string) => void;
+  updateAppTheme: (color: keyof Palette) => void;
+}
+
+const getInitialThemeMode = (): ThemeMode => {
+  if (typeof window !== 'undefined' && localStorage) {
+    return (localStorage.getItem('themeMode') as ThemeMode) || 'auto';
+  }
+  return 'auto';
+};
+
+const getInitialThemeColor = (): string => {
+  if (typeof window !== 'undefined' && localStorage) {
+    return localStorage.getItem('themeColor') || 'default';
+  }
+  return 'default';
+};
+
+export const useThemeStore = create<ThemeState>((set, get) => {
+  const initialThemeMode = getInitialThemeMode();
+  const initialThemeColor = getInitialThemeColor();
+  const systemIsDarkMode =
+    typeof window !== 'undefined' && window.matchMedia('(prefers-color-scheme: dark)').matches;
+  const isDarkMode =
+    initialThemeMode === 'dark' || (initialThemeMode === 'auto' && systemIsDarkMode);
+  const themeCode = getThemeCode();
+
+  if (typeof window !== 'undefined') {
+    const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
+    const handleSystemThemeChange = () => {
+      set({ systemIsDarkMode: mediaQuery.matches });
+    };
+
+    mediaQuery.addEventListener('change', handleSystemThemeChange);
+  }
+
+  return {
+    themeMode: initialThemeMode,
+    themeColor: initialThemeColor,
+    systemIsDarkMode,
+    isDarkMode,
+    themeCode,
+    setThemeMode: (mode) => {
+      if (typeof window !== 'undefined' && localStorage) {
+        localStorage.setItem('themeMode', mode);
+      }
+      const isDarkMode = mode === 'dark' || (mode === 'auto' && get().systemIsDarkMode);
+      document.documentElement.setAttribute(
+        'data-theme',
+        `${get().themeColor}-${isDarkMode ? 'dark' : 'light'}`,
+      );
+      set({ themeMode: mode, isDarkMode });
+      set({ themeCode: getThemeCode() });
+    },
+    setThemeColor: (color) => {
+      if (typeof window !== 'undefined' && localStorage) {
+        localStorage.setItem('themeColor', color);
+      }
+      document.documentElement.setAttribute(
+        'data-theme',
+        `${color}-${get().isDarkMode ? 'dark' : 'light'}`,
+      );
+      set({ themeColor: color });
+      set({ themeCode: getThemeCode() });
+    },
+    updateAppTheme: (color) => {
+      if (isWebAppPlatform()) {
+        const { palette } = get().themeCode;
+        document.querySelector('meta[name="theme-color"]')?.setAttribute('content', palette[color]);
+      }
+    },
+  };
+});
@@ -10,6 +10,19 @@
  overscroll-behavior: none;
 }

+/* Fixes the scrollbar gutter issue for DaisyUI */
+/* https://github.com/saadeghi/daisyui/issues/3040#issuecomment-2250530354 */
+:root:has(
+    :is(
+        .modal-open,
+        .modal:target,
+        .modal-toggle:checked + .modal,
+        .modal[open]
+      )
+  ) {
+  scrollbar-gutter: unset !important;
+}
+
@media (prefers-color-scheme: dark) {
  :root {
    --background: #222222;
@@ -268,3 +281,47 @@ foliate-view {
 .direction-rtl {
  direction: rtl;
 }
+
+.drop-zone {
+  position: relative;
+}
+
+.drag-over {
+  border: 2px dashed #4a90e2 !important;
+  background-color: rgba(74, 144, 226, 0.1) !important;
+  transition: all 0.2s ease-in-out;
+}
+
+.drag-overlay {
+  display: none;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  z-index: 20;
+  pointer-events: none;
+}
+
+.drop-zone.drag-over .drag-overlay {
+  display: block;
+}
+
+.drop-indicator {
+  display: none;
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  z-index: 50;
+  padding: 20px;
+  background-color: theme('colors.base-300');
+  border-radius: 8px;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+  pointer-events: none;
+}
+
+.drop-zone.drag-over .drop-indicator {
+  display: block;
+}
@@ -7,6 +7,7 @@ type BaseColor = {
  primary: string;
 };

+export type ThemeMode = 'auto' | 'light' | 'dark';
 export type Palette = {
  'base-100': string;
  'base-200': string;
@@ -60,6 +60,7 @@ export interface BookLayout {
  gapPercent: number;
  scrolled: boolean;
  disableClick: boolean;
+  continuousScroll: boolean;
  maxColumnCount: number;
  maxInlineSize: number;
  maxBlockSize: number;
@@ -4,8 +4,11 @@ export const getMaxInlineSize = (viewSettings: ViewSettings) => {
  const isScrolled = viewSettings.scrolled!;
  const maxColumnCount = viewSettings.maxColumnCount!;
  const screenWidth = window.innerWidth;
+  const screenHeight = window.innerHeight;

-  return maxColumnCount === 1 || isScrolled ? screenWidth : viewSettings.maxInlineSize!;
+  return maxColumnCount === 1 || isScrolled
+    ? Math.max(screenWidth, screenHeight, 720)
+    : viewSettings.maxInlineSize!;
 };

 export const getDefaultMaxInlineSize = () => {
@@ -5,7 +5,7 @@ import {
  FALLBACK_FONTS,
 } from '@/services/constants';
 import { ViewSettings } from '@/types/book';
-import { Palette } from '@/styles/themes';
+import { themes, Palette, ThemeMode } from '@/styles/themes';

 import fontfacesCSS from '!!raw-loader!../styles/fonts.css';
 import { getOSPlatform } from './misc';
@@ -178,7 +178,6 @@ const getLayoutStyles = (
    background: var(--background-set, none);
  }
  body *:not(a):not(#b1):not(#b1 *):not(#b2):not(#b2 *):not(.bg):not(.bg *):not(.vol):not(.vol *):not(.background):not(.background *) {
-    ${bg === '#ffffff' ? '' : `color: inherit;`}
    ${bg === '#ffffff' ? '' : `background-color: ${bg} !important;`}
  }
  body {
@@ -224,6 +223,7 @@ const getLayoutStyles = (
    display: none;
  }

+  /* Now begins really dirty hacks to fix some badly designed epubs */
  .calibre {
    color: unset;
  }
@@ -256,7 +256,30 @@ export interface ThemeCode {
  palette: Palette;
 }

-export const getStyles = (viewSettings: ViewSettings, themeCode: ThemeCode) => {
+export const getThemeCode = () => {
+  let themeMode = 'auto';
+  let themeColor = 'default';
+  let systemIsDarkMode = false;
+  if (typeof window !== 'undefined') {
+    themeColor = localStorage.getItem('themeColor') || 'default';
+    themeMode = localStorage.getItem('themeMode') as ThemeMode;
+    systemIsDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;
+  }
+  const isDarkMode = themeMode === 'dark' || (themeMode === 'auto' && systemIsDarkMode);
+  const defaultTheme = themes.find((theme) => theme.name === themeColor);
+  const defaultPalette = isDarkMode ? defaultTheme!.colors.dark : defaultTheme!.colors.light;
+  return {
+    bg: defaultPalette['base-100'],
+    fg: defaultPalette['base-content'],
+    primary: defaultPalette.primary,
+    palette: defaultPalette,
+  } as ThemeCode;
+};
+
+export const getStyles = (viewSettings: ViewSettings, themeCode?: ThemeCode) => {
+  if (!themeCode) {
+    themeCode = getThemeCode();
+  }
  const layoutStyles = getLayoutStyles(
    viewSettings.overrideLayout!,
    viewSettings.paragraphMargin!,
@@ -1,7 +1,9 @@
+import { getCurrentWindow } from '@tauri-apps/api/window';
+import { TauriEvent } from '@tauri-apps/api/event';
+import { exit } from '@tauri-apps/plugin-process';
 import { eventDispatcher } from './event';

 export const tauriGetWindowLogicalPosition = async () => {
-  const { getCurrentWindow } = await import('@tauri-apps/api/window');
  const currentWindow = getCurrentWindow();
  const factor = await currentWindow.scaleFactor();
  const physicalPos = await currentWindow.outerPosition();
@@ -9,24 +11,18 @@ export const tauriGetWindowLogicalPosition = async () => {
 };

 export const tauriHandleMinimize = async () => {
-  const { getCurrentWindow } = await import('@tauri-apps/api/window');
  getCurrentWindow().minimize();
 };

 export const tauriHandleToggleMaximize = async () => {
-  const { getCurrentWindow } = await import('@tauri-apps/api/window');
  getCurrentWindow().toggleMaximize();
 };

 export const tauriHandleClose = async () => {
-  const { getCurrentWindow } = await import('@tauri-apps/api/window');
  getCurrentWindow().close();
 };

 export const tauriHandleOnCloseWindow = async (callback: () => void) => {
-  const { TauriEvent } = await import('@tauri-apps/api/event');
-  const { getCurrentWindow } = await import('@tauri-apps/api/window');
-  const { exit } = await import('@tauri-apps/plugin-process');
  const currentWindow = getCurrentWindow();
  return currentWindow.listen(TauriEvent.WINDOW_CLOSE_REQUESTED, async () => {
    await callback();
@@ -35,9 +31,14 @@ export const tauriHandleOnCloseWindow = async (callback: () => void) => {
  });
 };

+export const tauriHandleToggleFullScreen = async () => {
+  const currentWindow = getCurrentWindow();
+  const isFullscreen = await currentWindow.isFullscreen();
+  const newIsFullscreen = !isFullscreen;
+  await currentWindow.setFullscreen(newIsFullscreen);
+};
+
 export const tauriHandleOnWindowFocus = async (callback: () => void) => {
-  const { TauriEvent } = await import('@tauri-apps/api/event');
-  const { getCurrentWindow } = await import('@tauri-apps/api/window');
  const currentWindow = getCurrentWindow();
  return currentWindow.listen(TauriEvent.WINDOW_FOCUS, async () => {
    await callback();
@@ -46,6 +47,5 @@ export const tauriHandleOnWindowFocus = async (callback: () => void) => {

 export const tauriQuitApp = async () => {
  await eventDispatcher.dispatch('quit-app');
-  const { exit } = await import('@tauri-apps/plugin-process');
  await exit(0);
 };
@@ -54,8 +54,8 @@ importers:
        specifier: ^2.47.7
        version: 2.47.7
      '@tauri-apps/api':
-        specifier: 2.2.0
-        version: 2.2.0
+        specifier: 2.3.0
+        version: 2.3.0
      '@tauri-apps/plugin-cli':
        specifier: ^2.2.0
        version: 2.2.0
@@ -75,11 +75,11 @@ importers:
        specifier: ^2.3.0
        version: 2.3.0
      '@tauri-apps/plugin-log':
-        specifier: ^2.2.1
-        version: 2.2.1
+        specifier: ^2.2.3
+        version: 2.2.3
      '@tauri-apps/plugin-opener':
-        specifier: ^2.2.5
-        version: 2.2.5
+        specifier: ^2.2.6
+        version: 2.2.6
      '@tauri-apps/plugin-os':
        specifier: ^2.2.0
        version: 2.2.0
@@ -90,8 +90,8 @@ importers:
        specifier: ~2.2.0
        version: 2.2.0
      '@tauri-apps/plugin-updater':
-        specifier: ^2.4.0
-        version: 2.4.0
+        specifier: ^2.5.1
+        version: 2.5.1
      '@zip.js/zip.js':
        specifier: ^2.7.53
        version: 2.7.53
@@ -151,8 +151,8 @@ importers:
        version: 5.0.1(@types/react@18.3.12)(react@19.0.0)
    devDependencies:
      '@tauri-apps/cli':
-        specifier: 2.2.7
-        version: 2.2.7
+        specifier: 2.3.1
+        version: 2.3.1
      '@types/cors':
        specifier: ^2.8.17
        version: 2.8.17
@@ -1654,75 +1654,75 @@ packages:
  '@swc/helpers@0.5.15':
    resolution: {integrity: sha512-JQ5TuMi45Owi4/BIMAJBoSQoOJu12oOk/gADqlcUL9JEdHB8vyjUSsxqeNXnmXHjYKMi2WcYtezGEEhqUI/E2g==}

-  '@tauri-apps/api@2.2.0':
-    resolution: {integrity: sha512-R8epOeZl1eJEl603aUMIGb4RXlhPjpgxbGVEaqY+0G5JG9vzV/clNlzTeqc+NLYXVqXcn8mb4c5b9pJIUDEyAg==}
+  '@tauri-apps/api@2.3.0':
+    resolution: {integrity: sha512-33Z+0lX2wgZbx1SPFfqvzI6su63hCBkbzv+5NexeYjIx7WA9htdOKoRR7Dh3dJyltqS5/J8vQFyybiRoaL0hlA==}

-  '@tauri-apps/cli-darwin-arm64@2.2.7':
-    resolution: {integrity: sha512-54kcpxZ3X1Rq+pPTzk3iIcjEVY4yv493uRx/80rLoAA95vAC0c//31Whz75UVddDjJfZvXlXZ3uSZ+bnCOnt0A==}
+  '@tauri-apps/cli-darwin-arm64@2.3.1':
+    resolution: {integrity: sha512-TOhSdsXYt+f+asRU+Dl+Wufglj/7+CX9h8RO4hl5k7D6lR4L8yTtdhpS7btaclOMmjYC4piNfJE70GoxhOoYWw==}
    engines: {node: '>= 10'}
    cpu: [arm64]
    os: [darwin]

-  '@tauri-apps/cli-darwin-x64@2.2.7':
-    resolution: {integrity: sha512-Vgu2XtBWemLnarB+6LqQeLanDlRj7CeFN//H8bVVdjbNzxcSxsvbLYMBP8+3boa7eBnjDrqMImRySSgL6IrwTw==}
+  '@tauri-apps/cli-darwin-x64@2.3.1':
+    resolution: {integrity: sha512-LDwGg3AuBQ3aCeMAFaFwt0MSGOVFoXuXEe0z4QxQ7jZE5tdAOhKABaq4i569V5lShCgQZ6nLD/tmA5+GipvHnA==}
    engines: {node: '>= 10'}
    cpu: [x64]
    os: [darwin]

-  '@tauri-apps/cli-linux-arm-gnueabihf@2.2.7':
-    resolution: {integrity: sha512-+Clha2iQAiK9zoY/KKW0KLHkR0k36O78YLx5Sl98tWkwI3OBZFg5H5WT1plH/4sbZIS2aLFN6dw58/JlY9Bu/g==}
+  '@tauri-apps/cli-linux-arm-gnueabihf@2.3.1':
+    resolution: {integrity: sha512-hu3HpbbtJBvHXw5i54QHwLxOUoXWqhf7CL2YYSPOrWEEQo10NKddulP61L5gfr5z+bSSaitfLwqgTidgnaNJCA==}
    engines: {node: '>= 10'}
    cpu: [arm]
    os: [linux]

-  '@tauri-apps/cli-linux-arm64-gnu@2.2.7':
-    resolution: {integrity: sha512-Z/Lp4SQe6BUEOays9BQAEum2pvZF4w9igyXijP+WbkOejZx4cDvarFJ5qXrqSLmBh7vxrdZcLwoLk9U//+yQrg==}
+  '@tauri-apps/cli-linux-arm64-gnu@2.3.1':
+    resolution: {integrity: sha512-mEGgwkiGSKYXWHhGodo7zU9PCd2I/d6KkR+Wp1nzK+DxsCrEK6yJ5XxYLSQSDcKkM4dCxpVEPUiVMbDhmn08jg==}
    engines: {node: '>= 10'}
    cpu: [arm64]
    os: [linux]
    libc: [glibc]

-  '@tauri-apps/cli-linux-arm64-musl@2.2.7':
-    resolution: {integrity: sha512-+8HZ+txff/Y3YjAh80XcLXcX8kpGXVdr1P8AfjLHxHdS6QD4Md+acSxGTTNbplmHuBaSHJvuTvZf9tU1eDCTDg==}
+  '@tauri-apps/cli-linux-arm64-musl@2.3.1':
+    resolution: {integrity: sha512-tqQkafikGfnc7ISnGjSYkbpnzJKEyO8XSa0YOXTAL3J8R5Pss5ZIZY7G8kq1mwQSR/dPVR1ZLTVXgZGuysjP8w==}
    engines: {node: '>= 10'}
    cpu: [arm64]
    os: [linux]
    libc: [musl]

-  '@tauri-apps/cli-linux-x64-gnu@2.2.7':
-    resolution: {integrity: sha512-ahlSnuCnUntblp9dG7/w5ZWZOdzRFi3zl0oScgt7GF4KNAOEa7duADsxPA4/FT2hLRa0SvpqtD4IYFvCxoVv3Q==}
+  '@tauri-apps/cli-linux-x64-gnu@2.3.1':
+    resolution: {integrity: sha512-I3puDJ2wGEauXlXbzIHn2etz78TaWs1cpN6zre02maHr6ZR7nf7euTCOGPhhfoMG0opA5mT/eLuYpVw648/VAA==}
    engines: {node: '>= 10'}
    cpu: [x64]
    os: [linux]
    libc: [glibc]

-  '@tauri-apps/cli-linux-x64-musl@2.2.7':
-    resolution: {integrity: sha512-+qKAWnJRSX+pjjRbKAQgTdFY8ecdcu8UdJ69i7wn3ZcRn2nMMzOO2LOMOTQV42B7/Q64D1pIpmZj9yblTMvadA==}
+  '@tauri-apps/cli-linux-x64-musl@2.3.1':
+    resolution: {integrity: sha512-rbWiCOBuQN7tPySkUyBs914uUikE3mEUOqV/IFospvKESw4UC3G1DL5+ybfXH7Orb8/in3JpJuVzYQjo+OSbBA==}
    engines: {node: '>= 10'}
    cpu: [x64]
    os: [linux]
    libc: [musl]

-  '@tauri-apps/cli-win32-arm64-msvc@2.2.7':
-    resolution: {integrity: sha512-aa86nRnrwT04u9D9fhf5JVssuAZlUCCc8AjqQjqODQjMd4BMA2+d4K9qBMpEG/1kVh95vZaNsLogjEaqSTTw4A==}
+  '@tauri-apps/cli-win32-arm64-msvc@2.3.1':
+    resolution: {integrity: sha512-PdTmUzSeTHjJuBpCV7L+V29fPhPtToU+NZU46slHKSA1aT38MiFDXBZ/6P5Zudrt9QPMfIubqnJKbK8Ivvv7Ww==}
    engines: {node: '>= 10'}
    cpu: [arm64]
    os: [win32]

-  '@tauri-apps/cli-win32-ia32-msvc@2.2.7':
-    resolution: {integrity: sha512-EiJ5/25tLSQOSGvv+t6o3ZBfOTKB5S3vb+hHQuKbfmKdRF0XQu2YPdIi1CQw1DU97ZAE0Dq4frvnyYEKWgMzVQ==}
+  '@tauri-apps/cli-win32-ia32-msvc@2.3.1':
+    resolution: {integrity: sha512-K/Xa97kspWT4UWj3t26lL2D3QsopTAxS7kWi5kObdqtAGn3qD52qBi24FH38TdvHYz4QlnLIb30TukviCgh4gw==}
    engines: {node: '>= 10'}
    cpu: [ia32]
    os: [win32]

-  '@tauri-apps/cli-win32-x64-msvc@2.2.7':
-    resolution: {integrity: sha512-ZB8Kw90j8Ld+9tCWyD2fWCYfIrzbQohJ4DJSidNwbnehlZzP7wAz6Z3xjsvUdKtQ3ibtfoeTqVInzCCEpI+pWg==}
+  '@tauri-apps/cli-win32-x64-msvc@2.3.1':
+    resolution: {integrity: sha512-RgwzXbP8gAno3kQEsybMtgLp6D1Z1Nec2cftryYbPTJmoMJs6e4qgtxuTSbUz5SKnHe8rGgMiFSvEGoHvbG72Q==}
    engines: {node: '>= 10'}
    cpu: [x64]
    os: [win32]

-  '@tauri-apps/cli@2.2.7':
-    resolution: {integrity: sha512-ZnsS2B4BplwXP37celanNANiIy8TCYhvg5RT09n72uR/o+navFZtGpFSqljV8fy1Y4ixIPds8FrGSXJCN2BerA==}
+  '@tauri-apps/cli@2.3.1':
+    resolution: {integrity: sha512-xewcw/ZsCqgilTy2h7+pp2Baxoy7zLR2wXOV7SZLzkb6SshHVbm1BFAjn8iFATURRW85KLzl6wSGJ2dQHjVHqw==}
    engines: {node: '>= 10'}
    hasBin: true

@@ -1744,11 +1744,11 @@ packages:
  '@tauri-apps/plugin-http@2.3.0':
    resolution: {integrity: sha512-pigTvz+zzAqbIhCzRiR1GE98Jw7A03j2V+Eiexr9thBI8VfMiwFQMcbgON51xlwnVaI72LdbYKNajU84im8tlg==}

-  '@tauri-apps/plugin-log@2.2.1':
-    resolution: {integrity: sha512-bOz9w0hhlXLGLc1ZR37GqkXvTqkykl4A3GEKLjRIs0dq3n0BzLyoRDMPcpt7PdUHqaq6WISME+zEX2bqjSbJ2A==}
+  '@tauri-apps/plugin-log@2.2.3':
+    resolution: {integrity: sha512-noDkZXU0kPG1bP3qoF6om+q5TgQ65LWpsV/TnfrHyg2lEn0vE+WJWTItiIh7OUA1/xxC+hdb9ODy2bM2e+jHEw==}

-  '@tauri-apps/plugin-opener@2.2.5':
-    resolution: {integrity: sha512-hHsJ9RPWpZvZEPVFaL+d25gABMUMOf/A6ESXnvf/ii9guTukj58WXsAE/SOysXRIhej7kseRCxnOnIMpSCdUsQ==}
+  '@tauri-apps/plugin-opener@2.2.6':
+    resolution: {integrity: sha512-bSdkuP71ZQRepPOn8BOEdBKYJQvl6+jb160QtJX/i2H9BF6ZySY/kYljh76N2Ne5fJMQRge7rlKoStYQY5Jq1w==}

  '@tauri-apps/plugin-os@2.2.0':
    resolution: {integrity: sha512-HszbCdbisMlu5QhCNAN8YIWyz2v33abAWha6+uvV2CKX8P5VSct/y+kEe22JeyqrxCnWlQ3DRx7s49Byg7/0EA==}
@@ -1759,8 +1759,8 @@ packages:
  '@tauri-apps/plugin-shell@2.2.0':
    resolution: {integrity: sha512-iC3Ic1hLmasoboG7BO+7p+AriSoqAwKrIk+Hpk+S/bjTQdXqbl2GbdclghI4gM32X0bls7xHzIFqhRdrlvJeaA==}

-  '@tauri-apps/plugin-updater@2.4.0':
-    resolution: {integrity: sha512-BkeKN2WObAjobf2G77HyW/DxAfI0In+VSqWGnw/0cVPlM+VmA7fw9dKUnSunryZOG7ys9y07tj7FQa1ABMXGZQ==}
+  '@tauri-apps/plugin-updater@2.5.1':
+    resolution: {integrity: sha512-7fNJraKRbKkxguMY5lG2W20pBvAUkLu+cqnbu0UcK7DqeZgrAnNECcGBIDG6fJ6C+0fAp2V2dMIgznhffOBCcg==}

  '@tsconfig/node10@1.0.11':
    resolution: {integrity: sha512-DcRjDCujK/kCk/cUe8Xz8ZSpm8mS3mNNpta+jGCA6USEDfktlNvm1+IuZ9eTcDbNk41BHwpHHeW+N1lKCz4zOw==}
@@ -5799,7 +5799,7 @@ snapshots:

  '@fabianlars/tauri-plugin-oauth@2.0.0':
    dependencies:
-      '@tauri-apps/api': 2.2.0
+      '@tauri-apps/api': 2.3.0

  '@gulpjs/to-absolute-glob@4.0.0':
    dependencies:
@@ -6581,98 +6581,98 @@ snapshots:
    dependencies:
      tslib: 2.8.1

-  '@tauri-apps/api@2.2.0': {}
+  '@tauri-apps/api@2.3.0': {}

-  '@tauri-apps/cli-darwin-arm64@2.2.7':
+  '@tauri-apps/cli-darwin-arm64@2.3.1':
    optional: true

-  '@tauri-apps/cli-darwin-x64@2.2.7':
+  '@tauri-apps/cli-darwin-x64@2.3.1':
    optional: true

-  '@tauri-apps/cli-linux-arm-gnueabihf@2.2.7':
+  '@tauri-apps/cli-linux-arm-gnueabihf@2.3.1':
    optional: true

-  '@tauri-apps/cli-linux-arm64-gnu@2.2.7':
+  '@tauri-apps/cli-linux-arm64-gnu@2.3.1':
    optional: true

-  '@tauri-apps/cli-linux-arm64-musl@2.2.7':
+  '@tauri-apps/cli-linux-arm64-musl@2.3.1':
    optional: true

-  '@tauri-apps/cli-linux-x64-gnu@2.2.7':
+  '@tauri-apps/cli-linux-x64-gnu@2.3.1':
    optional: true

-  '@tauri-apps/cli-linux-x64-musl@2.2.7':
+  '@tauri-apps/cli-linux-x64-musl@2.3.1':
    optional: true

-  '@tauri-apps/cli-win32-arm64-msvc@2.2.7':
+  '@tauri-apps/cli-win32-arm64-msvc@2.3.1':
    optional: true

-  '@tauri-apps/cli-win32-ia32-msvc@2.2.7':
+  '@tauri-apps/cli-win32-ia32-msvc@2.3.1':
    optional: true

-  '@tauri-apps/cli-win32-x64-msvc@2.2.7':
+  '@tauri-apps/cli-win32-x64-msvc@2.3.1':
    optional: true

-  '@tauri-apps/cli@2.2.7':
+  '@tauri-apps/cli@2.3.1':
    optionalDependencies:
-      '@tauri-apps/cli-darwin-arm64': 2.2.7
-      '@tauri-apps/cli-darwin-x64': 2.2.7
-      '@tauri-apps/cli-linux-arm-gnueabihf': 2.2.7
-      '@tauri-apps/cli-linux-arm64-gnu': 2.2.7
-      '@tauri-apps/cli-linux-arm64-musl': 2.2.7
-      '@tauri-apps/cli-linux-x64-gnu': 2.2.7
-      '@tauri-apps/cli-linux-x64-musl': 2.2.7
-      '@tauri-apps/cli-win32-arm64-msvc': 2.2.7
-      '@tauri-apps/cli-win32-ia32-msvc': 2.2.7
-      '@tauri-apps/cli-win32-x64-msvc': 2.2.7
+      '@tauri-apps/cli-darwin-arm64': 2.3.1
+      '@tauri-apps/cli-darwin-x64': 2.3.1
+      '@tauri-apps/cli-linux-arm-gnueabihf': 2.3.1
+      '@tauri-apps/cli-linux-arm64-gnu': 2.3.1
+      '@tauri-apps/cli-linux-arm64-musl': 2.3.1
+      '@tauri-apps/cli-linux-x64-gnu': 2.3.1
+      '@tauri-apps/cli-linux-x64-musl': 2.3.1
+      '@tauri-apps/cli-win32-arm64-msvc': 2.3.1
+      '@tauri-apps/cli-win32-ia32-msvc': 2.3.1
+      '@tauri-apps/cli-win32-x64-msvc': 2.3.1

  '@tauri-apps/plugin-cli@2.2.0':
    dependencies:
-      '@tauri-apps/api': 2.2.0
+      '@tauri-apps/api': 2.3.0

  '@tauri-apps/plugin-deep-link@2.2.0':
    dependencies:
-      '@tauri-apps/api': 2.2.0
+      '@tauri-apps/api': 2.3.0

  '@tauri-apps/plugin-dialog@2.2.0':
    dependencies:
-      '@tauri-apps/api': 2.2.0
+      '@tauri-apps/api': 2.3.0

  '@tauri-apps/plugin-fs@2.2.0':
    dependencies:
-      '@tauri-apps/api': 2.2.0
+      '@tauri-apps/api': 2.3.0

  '@tauri-apps/plugin-haptics@2.2.3':
    dependencies:
-      '@tauri-apps/api': 2.2.0
+      '@tauri-apps/api': 2.3.0

  '@tauri-apps/plugin-http@2.3.0':
    dependencies:
-      '@tauri-apps/api': 2.2.0
+      '@tauri-apps/api': 2.3.0

-  '@tauri-apps/plugin-log@2.2.1':
+  '@tauri-apps/plugin-log@2.2.3':
    dependencies:
-      '@tauri-apps/api': 2.2.0
+      '@tauri-apps/api': 2.3.0

-  '@tauri-apps/plugin-opener@2.2.5':
+  '@tauri-apps/plugin-opener@2.2.6':
    dependencies:
-      '@tauri-apps/api': 2.2.0
+      '@tauri-apps/api': 2.3.0

  '@tauri-apps/plugin-os@2.2.0':
    dependencies:
-      '@tauri-apps/api': 2.2.0
+      '@tauri-apps/api': 2.3.0

  '@tauri-apps/plugin-process@2.2.0':
    dependencies:
-      '@tauri-apps/api': 2.2.0
+      '@tauri-apps/api': 2.3.0

  '@tauri-apps/plugin-shell@2.2.0':
    dependencies:
-      '@tauri-apps/api': 2.2.0
+      '@tauri-apps/api': 2.3.0

-  '@tauri-apps/plugin-updater@2.4.0':
+  '@tauri-apps/plugin-updater@2.5.1':
    dependencies:
-      '@tauri-apps/api': 2.2.0
+      '@tauri-apps/api': 2.3.0

  '@tsconfig/node10@1.0.11':
    optional: true
Author	SHA1	Message	Date
Huang Xin	4869b756ea	release: version 0.9.20 (#549 ) * fix: occasionally traffic lights disappear in library page * release: version 0.9.20	2025-03-09 17:40:30 +01:00
Huang Xin	693c79c9b7	fix: remove seldomly used option to invert colors in dark mode (#548 ) This option is hard to understand and explain. Most hardcoded color in dark mode that affects readability has already been fixed in the reader so there is no necessity to have this option.	2025-03-09 17:02:01 +01:00
Huang Xin	e846875973	doc: update screenshots in readme (#546 )	2025-03-09 14:15:41 +01:00
Huang Xin	b1f2941247	fix: various fixes for updater, footerbar and note item (#545 ) * fix: don't open book if failed to download book * fix: various fixes for updater, footerbar and note item 1. now footerbar when invisible won't process pointer events 2. manually check updater won't be prevented by check interval 3. get rid of clamped text in note item	2025-03-09 11:33:52 +01:00
Huang Xin	6688c813e6	fix: don't open book if failed to download book (#541 )	2025-03-09 10:29:16 +01:00
Huang Xin	664dc45fcc	fix: search options menu in mobile & user id in posthog (#539 )	2025-03-09 07:07:42 +01:00
Huang Xin	27fa753486	feat: support drag and drop to import books, closes #524 (#536 )	2025-03-08 19:12:00 +01:00
Huang Xin	71e392544c	fix: rtl for notebook, closes #451 (#535 )	2025-03-08 16:51:24 +01:00
Huang Xin	7f24081205	feat: add fullscreen option for desktop app, closes #493 (#534 )	2025-03-08 22:36:25 +08:00
Huang Xin	89f1c43984	fix: don't hide horizontal scrollbar at the bottom, closes #515 (#533 )	2025-03-08 21:26:10 +08:00
Huang Xin	f841004e7a	chore: bump update of tauri (#532 )	2025-03-08 10:53:31 +01:00
Huang Xin	0922f557bb	fix: make the height of the drag handle in dialog stable (#530 )	2025-03-08 10:03:00 +01:00
Huang Xin	0b72ab156d	refactor: move useTheme hook into separate store, also closes #528 (#529 )	2025-03-08 09:12:36 +01:00
Huang Xin	dfc6cc9c8a	Update feature-request template	2025-03-08 04:02:02 +01:00
Huang Xin	83b2908266	compat: replace absolute font sizes with rem units in css, closes #521 (#523 )	2025-03-07 18:37:46 +01:00
Huang Xin	c25f2a7abc	fix: make continuous scroll an option and disabled by default, closes #516 , #373 (#522 )	2025-03-07 17:24:01 +01:00
Huang Xin	de1e396f6e	fix: switch label for column width/height for vertical layout and fix column size calculation (#520 ) * fix: scroll mode should be updated when calculating column size * fix: switch label for column width/height for vertical layout, closes #517	2025-03-07 16:42:40 +01:00
Huajin	80a3861816	Fixes the scrollbar gutter issue for DaisyUI (#514 ) * Fixes the scrollbar gutter issue for DaisyUI https://github.com/saadeghi/daisyui/issues/3040#issuecomment-2250530354	2025-03-07 15:15:52 +01:00
Huang Xin	fd8eeb07c2	fix: set sidebar rtl only for mandatory rtl languages, closes #512 (#519 )	2025-03-07 15:06:12 +01:00