ec1ef8fe68
- Ajout du store userPreferencesStore (thème, vue, tri, pagination, lecteur) - Page UserPreferencesPage pour configurer toutes les préférences - Câblage des prefs dans HomePage (viewMode, sortBy, itemsPerPage), readerStore (fallback prefs), ChapterReader (autoHide, autoFullscreen, sync), useNotifications (toastDuration) - Thème sombre (dark: Tailwind) sur tous les composants Vue : Layout, Pagination, NotificationToast, MangaCard, MangaVolume, MangaDetails, AddManga, HomePage, ActivityPage, JobItem, MangaDeleteModal, MangaEditModal, MangaPreferredSourcesModal, ManageChaptersModal, MangaChapterList, MangaChapter, ConversionPage, FileUploadArea, ConversionProgress, NewImportPage, FileImportCard, MangaMatchCard, StatusBadge, ImportResults - i18n partiellement initialisé Jeremy Guillot
47 lines
1.3 KiB
Vue
47 lines
1.3 KiB
Vue
<template>
|
|
<div class="min-h-screen bg-gray-50 dark:bg-gray-900 flex">
|
|
<Header
|
|
:show-menu-button="isReaderMode"
|
|
@menu-click="toggleSidebar"
|
|
@manga-click="$emit('manga-click', $event)"
|
|
@add-manga-click="$emit('add-manga-click', $event)" />
|
|
<Sidebar
|
|
:is-open="isSidebarOpen"
|
|
:force-mobile-behavior="isReaderMode"
|
|
@close="closeSidebar"
|
|
@add-manga-click="$emit('add-manga-click', $event)" />
|
|
|
|
<main :class="[
|
|
'flex-1 pt-16',
|
|
isReaderMode ? '' : 'md:ml-60'
|
|
]">
|
|
<RouterView></RouterView>
|
|
</main>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed, ref } from 'vue';
|
|
import { useRoute } from 'vue-router';
|
|
import Header from './Header.vue';
|
|
import Sidebar from './Sidebar.vue';
|
|
|
|
const route = useRoute();
|
|
const isSidebarOpen = ref(false);
|
|
|
|
// Détecte si on est en mode Reader
|
|
const isReaderMode = computed(() => {
|
|
return route.name === 'reader';
|
|
});
|
|
|
|
const toggleSidebar = () => {
|
|
isSidebarOpen.value = !isSidebarOpen.value;
|
|
};
|
|
|
|
const closeSidebar = () => {
|
|
isSidebarOpen.value = false;
|
|
};
|
|
|
|
defineEmits(['manga-click', 'add-manga-click']);
|
|
</script>
|