Add: Prominent 'Shop plain items' section to homepage
Added a standout section that highlights customers can buy plain items without personalization. Features: - Eye-catching orange gradient background - Clear messaging about skipping the design step - Direct link to plain items collection - Positioned between path choice and gallery sections
This commit is contained in:
@@ -84,7 +84,8 @@
|
|||||||
"Bash(git commit -m 'Fix: Route photo requests to design canvas instead of approval upload *)",
|
"Bash(git commit -m 'Fix: Route photo requests to design canvas instead of approval upload *)",
|
||||||
"Bash(git commit -m 'Fix: Pass photo request ID instead of data URL *)",
|
"Bash(git commit -m 'Fix: Pass photo request ID instead of data URL *)",
|
||||||
"Bash(git commit -m 'Feature: Add product selection when starting design from photo request *)",
|
"Bash(git commit -m 'Feature: Add product selection when starting design from photo request *)",
|
||||||
"Bash(git commit -m 'Refactor: Move start design server action to separate file *)"
|
"Bash(git commit -m 'Refactor: Move start design server action to separate file *)",
|
||||||
|
"Bash(git commit -m 'Add: Prominent '\\\\''Shop plain items'\\\\'' section to homepage *)"
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -188,6 +188,41 @@ export default async function HomePage() {
|
|||||||
</Reveal>
|
</Reveal>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
{/* Shop plain items — stand-out section */}
|
||||||
|
<section className="mx-auto max-w-6xl px-6 py-16">
|
||||||
|
<Reveal>
|
||||||
|
<div className="relative overflow-hidden rounded-lg border-2 border-splash-orange bg-gradient-to-br from-splash-orange/5 to-splash-pink/5 p-12">
|
||||||
|
<div className="absolute -right-20 -top-20 h-60 w-60 rounded-full bg-splash-orange opacity-10 blur-3xl" />
|
||||||
|
<div className="absolute -bottom-10 -left-10 h-40 w-40 rounded-full bg-splash-pink opacity-10 blur-2xl" />
|
||||||
|
|
||||||
|
<div className="relative z-10">
|
||||||
|
<p className="tag-label text-splash-orange">Skip the design step</p>
|
||||||
|
<h2 className="mt-3 font-display text-4xl">Just want to buy plain items?</h2>
|
||||||
|
<p className="mt-4 max-w-2xl text-base text-muted">
|
||||||
|
Not everyone wants to personalize. We offer a range of plain, ready-to-wear items with no
|
||||||
|
customization needed — perfect if you just love the style as-is. Pick a color, choose your size,
|
||||||
|
and you're done. It's that simple.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="mt-8 flex flex-wrap gap-4">
|
||||||
|
<Link
|
||||||
|
href="/products"
|
||||||
|
className="bg-splash-orange px-8 py-4 text-base font-medium text-paper transition-colors hover:bg-splash-orange/90"
|
||||||
|
>
|
||||||
|
Browse plain items
|
||||||
|
</Link>
|
||||||
|
<Link
|
||||||
|
href="/#how-it-works"
|
||||||
|
className="border-2 border-splash-orange px-8 py-4 text-base font-medium text-splash-orange transition-colors hover:bg-splash-orange/10"
|
||||||
|
>
|
||||||
|
How it works
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
</section>
|
||||||
|
|
||||||
{/* Gallery preview — completed work, prominent placement near the top. Always
|
{/* Gallery preview — completed work, prominent placement near the top. Always
|
||||||
shown (with a "coming soon" state when empty) so it never disappears
|
shown (with a "coming soon" state when empty) so it never disappears
|
||||||
entirely — a link this prominent shouldn't come and go with photo count. */}
|
entirely — a link this prominent shouldn't come and go with photo count. */}
|
||||||
|
|||||||
Reference in New Issue
Block a user