style(reader): améliorer la toolbar et l'UI du mode scroll
- Corriger la troncature de la toolbar (max-height 4rem → 5rem) - Animer la toolbar en translateY pour un effet "bloc uni" avec le header - Corriger le bug d'auto-hide du header après switch simple → scroll - Augmenter la taille du titre de chapitre dans la toolbar (text-sm font-medium) - Harmoniser le bouton scroll-to-top avec le style des ToolbarButtons - Ajouter support de prop `class` sur les labels de ToolbarSection
This commit is contained in:
parent
cc702cff19
commit
9c47c717d0
@@ -12,9 +12,10 @@
|
||||
@add-manga-click="$emit('add-manga-click', $event)" />
|
||||
|
||||
<main :class="[
|
||||
'flex-1 mt-16 flex flex-col overflow-hidden',
|
||||
'flex-1 flex flex-col overflow-hidden',
|
||||
headerStore.shouldShowHeader ? 'mt-16' : 'mt-0',
|
||||
isReaderMode ? '' : 'md:ml-60'
|
||||
]">
|
||||
]" style="transition: margin-top 300ms ease-in-out;">
|
||||
<RouterView></RouterView>
|
||||
</main>
|
||||
</div>
|
||||
@@ -23,10 +24,12 @@
|
||||
<script setup>
|
||||
import { computed, ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useHeaderStore } from '../../stores/headerStore';
|
||||
import Header from './Header.vue';
|
||||
import Sidebar from './Sidebar.vue';
|
||||
|
||||
const route = useRoute();
|
||||
const headerStore = useHeaderStore();
|
||||
const isSidebarOpen = ref(false);
|
||||
|
||||
// Détecte si on est en mode Reader
|
||||
|
||||
Reference in New Issue
Block a user