„Geteiltes ablegen" als Leiste über der Navigation statt schwebend über den Aufträgen [deploy]
All checks were successful
Deploy baustelle-pwa / deploy (push) Successful in 13s

Eddy: der Knopf soll unten am Rand liegen und die Aufträge nicht
überdecken. Er steht jetzt in der App-Spalte direkt über der Navigation
(sticky am unteren Rand), der FAB rückt solange eine Leistenhöhe hoch.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Eduard Wisch 2026-10-19 21:53:11 +02:00
parent c7cd2fa461
commit 0d2f485ecc
3 changed files with 25 additions and 10 deletions

View file

@ -41,6 +41,10 @@ Aufträgen: Geteiltes ablegen"*.
- [x] ✅ 19.10.2026: Leere Pakete räumt die App selbst weg (kein Knopf); „Es kam nichts an" löscht den Rest;
Knopf zeigt „(Notiz)", wenn nur Text geteilt wurde; `share.html` hat „Verwerfen" mit Rückfrage in der Seite.
Auf der Testinstanz durchgespielt (leer → kein Knopf; Notiz → Knopf → Verwerfen → weg).
- [x] ✅ 19.10.2026 (Eddy: „unten am Rand, nicht auf den Aufträgen"): Knopf ist jetzt eine Leiste in der App-Spalte
direkt über der Navigation (`position: sticky; bottom: 0`) statt fest schwebend; der FAB rückt eine Leistenhöhe
hoch. Auf 412 × 860 gemessen: kurze Liste → Leiste über der Navigation, nichts verdeckt; lange Liste → Leiste
klebt am unteren Rand, am Ende lässt sich alles darüber scrollen.
- [ ] Am Handy gegenprüfen: Knopf ist nach dem Update weg (beim ersten Laden räumt die App den leeren Rest ab).
### Befunde aus der AVIF-Prüfung in Bericht (19.10.2026, nicht geändert)

23
app.css
View file

@ -1516,23 +1516,28 @@ body {
text-align: center;
}
/* Leiste in der App-Spalte über der Navigation (19.10.2026): klebt beim Scrollen am unteren Rand,
* steht aber im Fluss — der Inhalt macht ihr Platz und lässt sich ganz darüber scrollen. Der FAB
* (fixed, bottom 68px) liegt darüber und wird nicht mehr verdeckt. */
.shared-banner {
position: fixed;
left: 16px;
right: 16px;
bottom: calc(68px + env(safe-area-inset-bottom, 0px));
z-index: 60;
padding: 14px 16px;
position: sticky;
bottom: 0;
z-index: 20;
width: 100%;
margin: 0;
padding: 12px 16px;
border: none;
border-radius: 10px;
border-radius: 0;
background: #7aa2f7;
color: #10101a;
font-size: 15px;
font-weight: 600;
box-shadow: 0 6px 20px rgba(0,0,0,0.45);
box-shadow: 0 -2px 10px rgba(0,0,0,0.35);
cursor: pointer;
}
.shared-banner:active { transform: scale(0.98); }
.shared-banner:active { filter: brightness(0.95); }
/* Solange die Leiste da ist, sitzt der FAB eine Leistenhöhe höher — sonst ragt er hinein */
body.hat-geteiltes .fab { bottom: calc(112px + env(safe-area-inset-bottom, 0px)); }
/* Zurück-Knopf: Pfeil UND Wort, ausreichend große Tippfläche (Handschuhe) */

8
app.js
View file

@ -1867,7 +1867,13 @@ async function checkPendingShare() {
b.className = 'shared-banner';
b.textContent = '📤 Geteiltes ablegen' + (n ? ' (' + n + ' Bild' + (n > 1 ? 'er' : '') + ')' : ' (Notiz)');
b.addEventListener('click', () => { location.href = 'share.html'; });
document.body.appendChild(b);
// Als Leiste in die App-Spalte direkt über die Navigation (Eddy: „unten am Rand, nicht auf den
// Aufträgen") — vorher schwebte der Knopf fest über der Liste und verdeckte Einträge und den FAB
const app = document.getElementById('app');
const nav = document.getElementById('bottom-nav');
if (app && nav) app.insertBefore(b, nav);
else document.body.appendChild(b);
document.body.classList.add('hat-geteiltes'); // hebt den FAB über die Leiste (app.css)
}
/* Bottom nav + Hilfe-Button */