UX: Offline-Pfote über FAB + nur in Welten sichtbar, SW by-v1080

- Position: bottom-right über dem #worlds-fab (right:20px, bottom-
  Berechnung folgt FAB + 12px Abstand). Gleiche horizontale Achse
  wie FAB → ergibt eine 'Pfoten-Säule' (Indikator oben, FAB unten)
- Sichtbarkeit per CSS-Sibling-Selektor:
  #worlds-overlay.worlds-visible ~ #offline-indicator { display:flex }
  → Indikator nur sichtbar wenn Welten aktiv sind. Auf Detail-Seiten
  (Tagebuch, Karte, Admin etc.) bleibt er aus.
- z-index 61 (eine Stufe über dem FAB, unter Modals)
This commit is contained in:
rene 2026-05-26 14:30:57 +02:00
parent 06b91dc54b
commit 521b7b6bee
5 changed files with 20 additions and 16 deletions

View file

@ -101,9 +101,9 @@
</script>
<!-- CSS: Reihenfolge ist wichtig — ?v= zwingt Browser zur Neuladung -->
<link rel="stylesheet" href="/css/design-system.css?v=1079">
<link rel="stylesheet" href="/css/layout.css?v=1079">
<link rel="stylesheet" href="/css/components.css?v=1079">
<link rel="stylesheet" href="/css/design-system.css?v=1080">
<link rel="stylesheet" href="/css/layout.css?v=1080">
<link rel="stylesheet" href="/css/components.css?v=1080">
</head>
<body>
@ -630,11 +630,11 @@
<div id="modal-container"></div>
<!-- JS: Reihenfolge ist wichtig — erst Basis, dann Features -->
<script src="/js/api.js?v=1079"></script>
<script src="/js/ui.js?v=1079"></script>
<script src="/js/app.js?v=1079"></script>
<script src="/js/worlds.js?v=1079"></script>
<script src="/js/offline-indicator.js?v=1079"></script>
<script src="/js/api.js?v=1080"></script>
<script src="/js/ui.js?v=1080"></script>
<script src="/js/app.js?v=1080"></script>
<script src="/js/worlds.js?v=1080"></script>
<script src="/js/offline-indicator.js?v=1080"></script>
<!-- Feature-Seiten werden lazy geladen -->