Marco
8d4f167374
- /todo-cards's detail page (the only page resolving a product regardless of active status) now renders both CTAs as "Ausverkauft" and disabled when the product is deactivated, instead of fully buyable — variants are dropped too, since AddToCartButton's outOfStock prop is otherwise ignored whenever variants is non-empty. - StepArrow: brand orange didn't fit here after all, switched to near-black (#222221) per feedback. - Newsletter/"Impulse & Tipps" checklist checkmarks (WeeklyImpulsesHero.tsx, WeeklyBenefits.tsx) were still the old un-recolorable icon-check.svg — same inline-SVG orange-checkmark fix as todo-cards/Challenge, plus items-start instead of items-center on WeeklyImpulsesHero's list for top-alignment consistency.
27 lines
1.3 KiB
TypeScript
27 lines
1.3 KiB
TypeScript
// Shared "how it works" step connector — used by Challenge's, /todo-cards's,
|
|
// and /newsletter's ("Impulse & Tipps") step sections. Used to be
|
|
// /icon-arrow-connector.svg (a thin gray line+chevron) loaded via next/image;
|
|
// replaced 2026-07-24 for two reasons that both needed an inline SVG to fix:
|
|
// 1. It read as a faint gray line, not a real arrow, even after the
|
|
// object-contain aspect-ratio fix — too thin/subtle at these sizes.
|
|
// 2. Its color lives in a `var(--stroke-0, #C9C9C9)` CSS custom property
|
|
// that's scoped to the SVG file's own document when loaded via <img
|
|
// src>/next/image — un-recolorable from the host page's CSS, so it could
|
|
// never actually become a solid dark color like the rest of this file's
|
|
// icons. Inline SVG sidesteps that entirely. Stroke color tried brand
|
|
// orange first, then switched to near-black (#222221, same as
|
|
// icon-check.svg's original fill) per feedback the same day.
|
|
export function StepArrow({ className }: { className?: string }) {
|
|
return (
|
|
<svg width="40" height="16" viewBox="0 0 40 16" fill="none" aria-hidden="true" className={className}>
|
|
<path
|
|
d="M1 8H33M26 14.5L34.5 8L26 1.5"
|
|
stroke="#222221"
|
|
strokeWidth="2.5"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
/>
|
|
</svg>
|
|
);
|
|
}
|