ux: FAB entry animation stops after 5 views (long loop)

This commit is contained in:
Ulas Kalayci
2026-04-30 09:09:39 +02:00
parent 5a93ac36aa
commit 89deb7b0ee
2 changed files with 18 additions and 0 deletions
+13
View File
@@ -366,6 +366,16 @@ async function renderPage(route, previousPath = null) {
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)
const announcer = document.getElementById('route-announcer');
if (announcer) {
@@ -619,6 +629,9 @@ function renderAppShell(container) {
initKeyboardShortcuts();
}
const FAB_SEEN_KEY = 'oikos:fabSeenCount';
const FAB_SEEN_MAX = 5;
const SHORTCUTS = [
{ key: '/', description: () => t('shortcuts.search'), action: () => document.getElementById('more-sheet-search')?.click() },
{ key: 'n', description: () => t('shortcuts.new'), action: () => document.querySelector('.page-fab')?.click() },
+5
View File
@@ -579,6 +579,11 @@
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 */
@media (min-width: 1024px) {
.page-fab {