Ersetzt die (fehlerhaft auf die GANZE Domain wirkende) Cloudflare-Zero-
Trust-Access-Sperre durch eine eigene, schlanke Lösung nach dem bewährten
Vorbild von "Dogfather Universe": eine Pages-Functions-Middleware
(functions/_middleware.js) prüft bei jeder Anfrage ein HMAC-signiertes
Session-Cookie; ohne gültiges Cookie geht's zu public/gate.html (im Van's-
Design), wo ein Zugangscode eingegeben wird. Zwei getrennte Codes für qciga
und VanVan, 90 Tage gültig, danach neu eingeben. /admin/* ist komplett
ausgenommen — läuft weiter über das echte GitHub-OAuth-Login, das für
VanVan schon funktioniert.
Bonus: die drei separaten Vorschau-Seiten (demo-normal/demo-konto/demo-abo)
sind jetzt überflüssig und entfernt. Stattdessen gibt's ein schwebendes
Umschalter-Widget (Layout.astro), das NUR sichtbar ist, wenn das Gate-Cookie
vorhanden ist (also nur für uns beide) — auf jeder beliebigen Seite kann
per Knopfdruck zwischen "Normaler Besucher", "Angemeldete Kundin" und
"Abonnentin" gewechselt werden, ohne die Seite verlassen zu müssen.
Co-Authored-By: Claude Sonnet 5 <[email protected]>
"Mein Konto" und "Abmelden" starteten je nach Breite des Emojis (👤 vs 🚪)
an leicht unterschiedlichen Stellen. Jetzt echtes Flex-Layout mit fester
Icon-Spalte (1.2em, zentriert) — beide Labels stehen exakt untereinander.
Co-Authored-By: Claude Sonnet 5 <[email protected]>
Bisher musste man auf "Deutsch ▾" bzw. das Konto-Menü in der Kopfzeile klicken,
damit sich das Untermenü öffnet. Jetzt reicht auf dem Desktop einfaches
Drüberfahren mit der Maus (mit kurzer Schließverzögerung beim Verlassen,
damit der Wechsel vom Button zum Menü nicht sofort wieder zuklappt) — Klick
funktioniert als Fallback für Touch-Geräte/Tastatur weiterhin ganz normal.
Co-Authored-By: Claude Sonnet 5 <[email protected]>
Neue, nicht verlinkte Seite (noindex, aus der Sitemap ausgeschlossen), die
beim Aufruf ein Demo-Konto mit aktivem "Großes Abo" (14 bezahlte Monate,
verfügbare + bereits eingelöste Teddy-Prämien, mehrere Benachrichtigungen,
laufender Treuebonus-Fortschritt) ins localStorage DES AUFRUFENDEN BROWSERS
schreibt und direkt zum Abo-Tab im Kundenkonto weiterleitet — ändert nichts
an echten Kundendaten, jede Person sieht die Vorschau nur bei sich selbst.
Dafür neu: Layout.astro bekommt eine noindex-Prop, und die Kontoseite
unterstützt jetzt Deep-Links per URL-Hash (#abo, #treuebonus, …), damit die
Vorschau direkt im richtigen Tab landet.
Separat per `wrangler pages deploy --branch=vorschau-abo` auf eine eigene
Vorschau-URL deployed (vorschau-abo.vans-diy-bastelbedarf.pages.dev) —
komplett getrennt von der normalen Produktions-URL, wird nicht durch den
GitHub-Actions-Workflow (nur branch=main) überschrieben.
Co-Authored-By: Claude Sonnet 5 <[email protected]>
Bisher gab es nur ein "Benutzername"-Feld, das überall (Begrüßung, Header,
Rezensionen) angezeigt wurde. Jetzt gibt es zwei getrennte Felder: einen
festen "Name" (Pflichtangabe, z.B. für Bestellungen) und einen optionalen
"Benutzername (Spitzname)" als Bonus, falls man lieber mit einem Spitznamen
statt dem echten Namen angezeigt werden möchte.
Überall, wo bisher nur der Benutzername angezeigt wurde (Header-Konto-Menü,
Begrüßung im Dashboard, Rezensions-Autorenname, "angemeldet als"-Hinweis),
gilt jetzt: Spitzname bevorzugt, sonst echter Name als Rückfalloption
(neue anzeigeName()-Hilfsfunktion in scripts/account.ts).
Co-Authored-By: Claude Sonnet 5 <[email protected]>
Bisher musste VanVan Bewertungen manuell im CMS eintragen. Jetzt können
angemeldete Kund:innen Rezensionen direkt auf der Produktseite abgeben
(inkl. Herzen-Sternebewertung und Text). Die Durchschnittsbewertung wird
automatisch berechnet und überall live eingebunden: Produktkarten
(shop-weit), Produktdetailseite, Shop-Filter/Sortierung nach Bewertung
und die Kundenstimmen-Sektion auf der Startseite.
Neu dazu: ein Kontobereich fürs Login (Demo-Login per E-Mail), Profilfoto-
Upload, wählbarer Benutzername, und ein Header-Kontomenü, das nur bei
Anmeldung erscheint. Jede Bestellung im Konto-Dashboard hat einen
"Rezension schreiben"-Link, der direkt zur Produktseite führt und dort
per Bestellnummer verknüpft wird; im Profil ist dann sofort sichtbar,
welche Bestellungen schon bewertet wurden.
Technisch als reines Frontend/localStorage-System umgesetzt (kein Backend
in dieser Phase), analog zum bestehenden Warenkorb-Muster. Admin-CMS-Feld
für manuelle Bewertungen entfernt, da Rezensionen jetzt ausschließlich von
Kund:innen kommen (auch aus rechtlichen Gründen: keine Fake-Bewertungen).
Co-Authored-By: Claude Sonnet 5 <[email protected]>
"Über die Kreative" (und potenziell andere Menüpunkte) konnte bei
mittleren Fensterbreiten (zwischen ca. 860-1100px) in eine zweite Zeile
umbrechen — durch die kürzlich vergrößerte Kopfzeile plus den neuen
Installieren-Button wurde es dort schlicht zu eng für die Hauptnavi.
Fix: white-space:nowrap auf den Menüpunkten (bricht nie mehr um) +
den Umschaltpunkt zum Hamburger-Menü von 860px auf 1100px angehoben,
damit auf mittleren Breiten gar nicht erst versucht wird, alles
nebeneinander reinzuquetschen, sondern rechtzeitig auf das kompakte
Menü umgeschaltet wird. Geprüft: bei 1100px sauberer Wechsel zum
Hamburger-Menü, kein Umbruch und kein horizontaler Überlauf mehr bei
1150-1600px.
Co-Authored-By: Claude Sonnet 5 <[email protected]>
Die Icons/Manifeste waren schon vorbereitet, aber es gab keinen echten
Weg, die Installation auch zu STARTEN, ohne das kleine, leicht zu
übersehende Icon im Browser selbst zu suchen. Jetzt:
- Ein Service Worker (public/sw.js) ist Voraussetzung dafür, dass
Browser die Seite überhaupt als "installierbare App" erkennen. Bewusst
minimal gehalten: strikt "network-first" — bei bestehender Verbindung
wird IMMER zuerst das echte Netzwerk gefragt, der Cache dient nur als
Rückfalllösung, wenn wirklich keine Verbindung besteht. Dadurch besteht
KEIN Risiko, dass der Adminbereich veraltete Inhalte zeigt, während man
online ist — als Bonus funktionieren bereits besuchte Seiten aber auch
kurz offline (mit echtem Offline-Test geprüft).
- Neuer "Installieren"-Button direkt in der Kopfzeile (Hauptseite) bzw.
unten rechts (Adminbereich) — erscheint automatisch, sobald der
Browser eine Installation wirklich anbietet, verschwindet danach
wieder bzw. bleibt komplett versteckt, wenn schon als App installiert.
Ein Klick reicht, kein Suchen im Browser-Menü mehr nötig.
- Beide Bereiche (Hauptseite + Admin) nutzen dieselben, bereits
vorhandenen Logo-Icons/Manifeste — landet also mit dem echten
VanVan-Logo auf dem Startbildschirm/Desktop.
Co-Authored-By: Claude Sonnet 5 <[email protected]>
Logo, Markenname, Hauptnavigation, Sprachumschalter, Konto-/Warenkorb-
Icons sowie die zweite Kategorien-Leiste darunter sind jetzt insgesamt
etwas größer/luftiger (Schriftgrößen, Icon-Maße, Innenabstände moderat
erhöht) — wie gewünscht "bissl größer" statt eines kompletten Redesigns.
Dabei einen kleinen, durch die Vergrößerung ausgelösten Folgefehler
gleich mitbehoben: auf schmalen Handy-Breiten (<480px) hätte der neue,
größere Header nicht mehr komplett reingepasst und den Menü-Button (☰)
rechts aus dem sichtbaren Bereich geschoben, unerreichbar für Klicks.
Neue Media Query verkleinert dort gezielt Logo/Markentext und blendet
den Sprachumschalter-Text (bleibt nur der Globus) sowie den Pfeil aus —
geprüft: kein horizontales Überlaufen mehr bei 420px, 700px und
Desktop-Breite.
Co-Authored-By: Claude Sonnet 5 <[email protected]>
Bisher wurde als Icon nur Astros Standard-Platzhalter-SVG (ein Pfeil-Symbol,
kein eigenes Branding) verlinkt. Weil kein Web-App-Manifest mit Icons
hinterlegt war, generierten Browser beim "Auf PC installieren" automatisch
einen Buchstaben-Kreis ("V") als App-Icon statt des echten Logos.
Aus dem vorhandenen public/logo.png automatisch alle nötigen Icon-Größen
erzeugt (favicon.ico mit 16/32/48px, Apple-Touch-Icon 180px, sowie 192px/
512px normal + eigene "maskable"-Varianten mit Weißraum-Sicherheitszone,
damit runde/eckige OS-Zuschnitte beim Installieren nicht den Rand des
Logos abschneiden). Neues manifest.webmanifest verlinkt alle Icons plus
Name/Theme-Farbe für die Installation. Layout.astro und der
Admin-Bereich verlinken jetzt überall das echte Logo statt des alten
Platzhalters.
Co-Authored-By: Claude Sonnet 5 <[email protected]>
