„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
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:
parent
c7cd2fa461
commit
0d2f485ecc
3 changed files with 25 additions and 10 deletions
|
|
@ -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
23
app.css
|
|
@ -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
8
app.js
|
|
@ -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 */
|
||||
|
|
|
|||
Loading…
Reference in a new issue