Das Feld für produktspezifische Versandkosten existierte bereits, war
aber kaum zu finden: es stand ganz unten im Formular (nach Lieferzeit)
und war zusätzlich hinter Sveltias "+ Add"-Checkbox versteckt (weil das
Objektfeld selbst required:false hatte). Jetzt direkt nach "Auf Lager"
platziert und ohne required:false auf dem Objekt, sodass die vier
Länder-Preisfelder sofort sichtbar sind, genau wie bei "Name" und
"Beschreibung". Hinweistext zusätzlich präzisiert (verweist jetzt
namentlich auf den Bereich "Versandkosten-Staffel").
Co-Authored-By: Claude Sonnet 5 <[email protected]>
Bisher war jeder Charakter (HasiDog, Frieda, Sam, ...) eine eigene
Unterkategorie mit eigener Seite. Das passte nicht mehr, sobald eine
Familie mehrere Charaktere bekommt (HasiDog, HasiGott, Mama Hase) — die
sollten alle auf EINER Seite erscheinen, nicht auf drei getrennten.
Neues Modell:
- Unterkategorie = die ganze Tier-Familie (z.B. "hase", "kuh", "wal"),
nicht mehr ein einzelner Charakter.
- Jede Familie hat jetzt ein "characters"-Array (categories.ts,
config.yml) — beliebig viele Charaktere, jeder mit eigenem Namen,
Vorstellungstext und optionalem "Mehr über mich"-Link.
- Produkte bekommen ein neues optionales Feld "charakter", das sie einem
bestimmten Charakter innerhalb der Unterkategorie zuordnet (Product.
charakter in products.ts + Adminbereich-Feld).
- Die Unterkategorie-Seite zeigt jetzt JEDEN Charakter als eigene Box
untereinander, mit automatisch abwechselnder Foto-/Text-Seite (1. links,
2. rechts, 3. wieder links, ...). Ein Charakter ohne zugeordnetes
Produkt zeigt trotzdem schon seine Box (nur ohne Foto) — die Seite
"wächst" mit, sobald neue Charaktere/Produkte dazukommen, für jede
Tier-Familie (Hase, Kuh, Wal, Oktopus, Schildkröte, Pinguin).
- "Hase" hat jetzt drei Charaktere (HasiDog mit echtem Produkt, HasiGott
und Mama Hase als Platzhalter-Boxen).
- Unterkategorien-Chips zeigen jetzt sauber die Familiennamen (Kuh, Hase,
Wal, ...) statt "Kuh „Frieda"" etc.
- Alte, verwaiste /hasidog/-Seite entfernt (war durch die Umstellung
kaputt und nirgends mehr verlinkt).
Verifiziert per Puppeteer gegen den echten Build: /shop/diy-plushies/hase/
zeigt alle drei Charaktere korrekt alternierend, Ein-Charakter-Familien
(Kuh etc.) funktionieren unverändert, Adminbereich lädt ohne
Konfigurationsfehler, alte Hase-URLs geben korrekt 404.
- Akzentfarbe im Adminbereich von einfarbigem Türkis auf einen echten
Lila-Babyblau-Mix umgestellt: normale Buttons/aktive Felder sind
babyblau, Hover-/Fokus-/Auswahl-Zustände kippen ins Lila (gleicher
Violett-Ton wie die Verlaufsränder auf der Website) — dadurch zieht
sich der Farbmix durch die ganze Oberfläche statt nur eine Einzelfarbe
zu sein.
- Hinweistext bei "Rabatte" ergänzt: macht klar, dass nichts selbst
ausgerechnet werden muss — die Website berechnet den neuen Preis
automatisch, sobald oben rechts auf "Speichern" geklickt wird.
Verifiziert per Puppeteer-Login in den echten Adminbereich (Access
Token): Farben korrekt übernommen, keine Konfigurationsfehler, Text
sichtbar.
Standard-Set für deutsche Online-Shops recherchiert und umgesetzt: PayPal,
Klarna, Kreditkarte (Visa & Mastercard, neu) und Banküberweisung (Vorkasse).
- PayPal: echte PayPal Smart Buttons über das offizielle JS-SDK (Sandbox-
Client-ID, kostenlos & ohne Konto testbar). Klick öffnet den echten
PayPal-Login-Popup und schließt eine (Test-)Zahlung wirklich ab. Für den
Live-Betrieb genügt später der Tausch gegen VanVans echte (kostenlose)
PayPal-Business-Client-ID.
- Banküberweisung (Vorkasse): braucht gar keine externe Anbindung — zeigt
jetzt VanVans echte Kontodaten an, die sie im neuen Adminbereich-Feld
"🏦 Bankverbindung" selbst einträgt. Damit ist diese Zahlungsart schon
zu 100% fertig, ganz ohne Drittanbieter.
- Klarna & Kreditkarte: echte Live-Anbindung braucht ein Händlerkonto bzw.
einen Zahlungsdienstleister (Phase 2, Cloudflare Worker). Bis dahin ein
sauber gestalteter, funktionierender Verbindungs-/Eingabe-Ablauf, der
1:1 austauschbar ist, sobald die echten Zugänge da sind.
- Auswahl einer Zahlungsart klappt jetzt direkt das passende Panel auf
statt nur eine Radiobox zu markieren.
Verifiziert per Puppeteer-Funktionstest gegen den echten Build: PayPal-
SDK lädt und rendert einen echten Button (iframe), Kreditkartenfelder,
Klarna-Demo-Verbindung und echte Bankdaten-Anzeige funktionieren
fehlerfrei, Adminbereich lädt weiterhin ohne Konfigurationsfehler.
Sveltia CMS unterstützt den alten "date"-Widget-Typ nicht mehr (wurde von
"datetime" mit ausgeblendeter Uhrzeit abgelöst). Betraf die beiden neuen
Ablaufdatum-Felder (Rabatt "bis" und Gutschein "bis") aus dem letzten
Commit — der komplette Adminbereich zeigte deswegen eine
Konfigurationsfehler-Seite statt dem Formular. Verifiziert per
Puppeteer-Test gegen den echten Build: Adminbereich lädt jetzt wieder
fehlerfrei.
- Neues Rabatt-System: Prozent-/Betrag-Rabatt mit optionalem Ablaufdatum,
Mengenrabatt-Staffel pro Produkt, sowie site-weite Gutscheincodes.
Wird live im Warenkorb/Checkout berechnet (src/data/rabatt.ts,
src/data/gutscheine.ts, cart.ts) und ist im Adminbereich direkt unter dem
Preis bearbeitbar (config.yml: "Rabatte" + neue Collection
"Gutscheincodes"). Effektiver Preis + Rabatt-Badge auf Produktkarten und
Produktseite sichtbar.
- Mengen-Stepper auf der Produktseite vergrößert (bereits vorbereitet,
jetzt mit Build/Test verifiziert).
- Zahlungsart im Checkout auf Platz 1, mit markenfarbigen, fertig
gestalteten Buttons (PayPal/Klarna/Banküberweisung).
- Unterkategorie-Seiten zeigen jetzt VanVans eigene Produktbeschreibung
und das echte Fotos des Produkts statt Platzhaltertext, mit kleinem
Link zur HasiDog-Universum-Seite statt großem Button.
Verifiziert per Puppeteer-Funktionstest gegen den echten Production-Build
(Rabatt-Berechnung, Mengenrabatt, Gutschein-Einlösung, Checkout-Summary,
keine Konsolenfehler).
- Farbschema/Schriftart der Website übernommen (Sveltias eigenes CSS-Variablen-
Theming-System genutzt: --sui-base-hue, --sui-primary-accent-color* auf den
Türkis-Akzent + Lila-Grundton der Seite gesetzt, Inter-Schriftart)
- Eigenes Logo + Seitentitel "Van's Shop – Adminbereich" auf dem Login-Bildschirm
- Icons pro Bereich in der Seitenleiste (Produkte/Kategorien/Versandkosten)
- Zahlenfelder ohne die klobigen Browser-Spinner-Pfeile
- Produktformular neu geordnet nach natürlichem Ablauf: Fotos → Name →
Beschreibung → Preis/Bestand (mit klareren Erklärtexten) → Kategorie →
Auszeichnungen → weitere Detailangaben → Versand → interner Code
Neu:
- Produkte können eigene Versandkosten je Land (DE/AT/CH/LU) bekommen, gelten nur bei
Einzelkauf (genau 1 Stück von 1 Produkt)
- Versandkosten-Staffel nach Warenwert je Land, von VanVan im Adminbereich bearbeitbar
(neuer Bereich "Versandkosten-Staffel"), greift bei mehreren Produkten/Stück
- Versandkostenfrei ab 75 € gilt immer, unabhängig von Einzelkauf/Staffel
- Checkout berechnet und zeigt jetzt die echten Versandkosten live beim Länderwechsel an
Kritischer Bugfix (unabhängig vom neuen Feature entdeckt):
- Warenkorb- und Checkout-Skripte haben "import" innerhalb von define:vars-Skripten benutzt,
was Astro als IIFE rendert (kein ES-Modul) — das hat in der echten Live-Version die ganze
Zeit zu "Cannot use import statement outside a module" geführt, wodurch Warenkorb und
Checkout praktisch nie funktioniert haben. Behoben durch Trennung: define:vars-Skript setzt
nur Werte auf window, separates <script type="module"> mit den echten Imports liest sie aus.
Mit echtem End-to-End-Test verifiziert (Artikel in Warenkorb legen, Land wechseln, Summe
prüfen) statt nur Screenshot.
- Persönliche Vorstellung jedes DIY-Plushies-Charakters auf der jeweiligen
Unterkategorie-Seite (dezente Box im Kartenstil), inkl. eigener HasiDog-Seite
mit "Mehr über HasiDog"-Button
- Beschreibungstexte "DIY Plushies" und "Häkelzubehör" angepasst (Startseite +
Kategorieseiten, gemeinsame Datenquelle)
- Shop-Filter erweitert: Unterkategorien jetzt gruppiert unter ihrer Hauptkategorie
wählbar, inkl. Filterlogik
- Shop-Bannerbild jetzt auch auf allen Kategorie- und Unterkategorie-Seiten,
gleiche Größe/Abstände/Responsivität wie im Shop
- Keine Design-Änderung: bestehende Farben, Typografie, Karten, Buttons, Abstände
vollständig erhalten, alles fügt sich nahtlos ins bestehende Layout ein
- Alle Änderungen in DE/EN/CH/FR umgesetzt, Link-Audit durchgeführt
