Warenkorb: Artikel einzeln zum Kauf auswählen, andere bleiben unverbindlich liegen
Jeder Artikel im Warenkorb hat jetzt eine Checkbox "Jetzt kaufen". Nur angehakte Artikel zählen zur Zwischensumme, zum Versand, zum Gutschein und zum Checkout — abgewählte Artikel bleiben sichtbar (leicht abgedunkelt, mit "Bleibt im Warenkorb, wird noch nicht gekauft"-Hinweis) im Warenkorb liegen, ohne mitgekauft zu werden. Die Auswahl wird pro Artikel gespeichert (localStorage) und bleibt bis zur nächsten Änderung bestehen. Der Checkout übernimmt automatisch nur die ausgewählten Artikel. Verifiziert per Puppeteer: Abwählen eines Artikels reduziert Summe/ Rechnungsliste sofort korrekt, Checkout zeigt nur den ausgewählten Artikel, keine Konsolenfehler.
This commit is contained in:
@@ -872,6 +872,38 @@ a:focus-visible, button:focus-visible {
|
||||
}
|
||||
.cart-item:hover { background: rgba(244, 241, 247, 0.02); }
|
||||
.cart-item:last-child { border-bottom: none; }
|
||||
|
||||
/* Checkbox "jetzt kaufen" — abgewählte Artikel bleiben sichtbar im Warenkorb liegen, zählen aber
|
||||
nicht mehr zur Summe/zum Checkout, bis sie wieder angehakt werden. */
|
||||
.cart-item .buy-toggle {
|
||||
appearance: none;
|
||||
width: 21px;
|
||||
height: 21px;
|
||||
border-radius: 6px;
|
||||
border: 2px solid rgba(244, 241, 247, 0.3);
|
||||
flex-shrink: 0;
|
||||
display: grid;
|
||||
place-content: center;
|
||||
cursor: pointer;
|
||||
transition: border-color 0.2s var(--ease), background 0.2s var(--ease);
|
||||
}
|
||||
.cart-item .buy-toggle::before {
|
||||
content: "";
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
clip-path: polygon(14% 44%, 0 65%, 45% 100%, 100% 16%, 80% 0%, 43% 68%);
|
||||
transform: scale(0);
|
||||
transition: transform 0.15s var(--ease);
|
||||
background: #08181c;
|
||||
}
|
||||
.cart-item .buy-toggle:checked {
|
||||
border-color: var(--c-accent);
|
||||
background: linear-gradient(135deg, var(--c-accent), var(--c-accent-hover));
|
||||
}
|
||||
.cart-item .buy-toggle:checked::before { transform: scale(1); }
|
||||
.cart-item.deselected { opacity: 0.55; }
|
||||
.cart-item.deselected:hover { opacity: 0.8; }
|
||||
.kept-in-cart-badge { color: var(--c-text-muted); margin-top: 0.15rem; }
|
||||
.cart-item .thumb {
|
||||
width: 76px;
|
||||
height: 76px;
|
||||
|
||||
Reference in New Issue
Block a user