ux: FAB entry animation stops after 5 views (long loop)
This commit is contained in:
@@ -366,6 +366,16 @@ async function renderPage(route, previousPath = null) {
|
|||||||
|
|
||||||
await module.render(pageWrapper, { user: currentUser });
|
await module.render(pageWrapper, { user: currentUser });
|
||||||
|
|
||||||
|
// FAB Long Loop: Einstiegsanimation nach FAB_SEEN_MAX Views deaktivieren
|
||||||
|
if (pageWrapper.querySelector('.page-fab')) {
|
||||||
|
let fabCount = parseInt(localStorage.getItem(FAB_SEEN_KEY) ?? '0', 10);
|
||||||
|
if (fabCount < FAB_SEEN_MAX) {
|
||||||
|
fabCount++;
|
||||||
|
localStorage.setItem(FAB_SEEN_KEY, String(fabCount));
|
||||||
|
}
|
||||||
|
document.documentElement.classList.toggle('fab-anim-done', fabCount >= FAB_SEEN_MAX);
|
||||||
|
}
|
||||||
|
|
||||||
// Route-Announcer: Screenreader über Seitenwechsel informieren (gezielt, nicht gesamter Inhalt)
|
// Route-Announcer: Screenreader über Seitenwechsel informieren (gezielt, nicht gesamter Inhalt)
|
||||||
const announcer = document.getElementById('route-announcer');
|
const announcer = document.getElementById('route-announcer');
|
||||||
if (announcer) {
|
if (announcer) {
|
||||||
@@ -619,6 +629,9 @@ function renderAppShell(container) {
|
|||||||
initKeyboardShortcuts();
|
initKeyboardShortcuts();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const FAB_SEEN_KEY = 'oikos:fabSeenCount';
|
||||||
|
const FAB_SEEN_MAX = 5;
|
||||||
|
|
||||||
const SHORTCUTS = [
|
const SHORTCUTS = [
|
||||||
{ key: '/', description: () => t('shortcuts.search'), action: () => document.getElementById('more-sheet-search')?.click() },
|
{ key: '/', description: () => t('shortcuts.search'), action: () => document.getElementById('more-sheet-search')?.click() },
|
||||||
{ key: 'n', description: () => t('shortcuts.new'), action: () => document.querySelector('.page-fab')?.click() },
|
{ key: 'n', description: () => t('shortcuts.new'), action: () => document.querySelector('.page-fab')?.click() },
|
||||||
|
|||||||
@@ -579,6 +579,11 @@
|
|||||||
box-shadow: 0 0 0 4px var(--color-accent);
|
box-shadow: 0 0 0 4px var(--color-accent);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Long Loop: FAB-Animation nach N Aufrufen deaktivieren */
|
||||||
|
html.fab-anim-done .page-fab {
|
||||||
|
animation: none;
|
||||||
|
}
|
||||||
|
|
||||||
/* Desktop: FAB Position anpassen (keine Bottom-Nav) und etwas kleiner */
|
/* Desktop: FAB Position anpassen (keine Bottom-Nav) und etwas kleiner */
|
||||||
@media (min-width: 1024px) {
|
@media (min-width: 1024px) {
|
||||||
.page-fab {
|
.page-fab {
|
||||||
|
|||||||
Reference in New Issue
Block a user