63 lines
2.2 KiB
TypeScript
63 lines
2.2 KiB
TypeScript
import Link from "next/link";
|
|
|
|
export default function NotFound() {
|
|
return (
|
|
<div className="nf-hero">
|
|
{/* subtle brick grid overlay */}
|
|
<div className="nf-bg-grid" aria-hidden="true" />
|
|
|
|
{/* radial glow behind 404 */}
|
|
<div className="nf-glow" aria-hidden="true" />
|
|
|
|
<div className="nf-inner">
|
|
<p className="nf-eyebrow">ERROR</p>
|
|
|
|
<h1 className="nf-number" aria-label="404">404</h1>
|
|
|
|
<h2 className="nf-heading">
|
|
That page is not part of<br />the current yard layout.
|
|
</h2>
|
|
|
|
<p className="nf-sub">
|
|
Head back to the homepage, check our material catalogs,
|
|
or contact the yard — we'll find what you're looking for.
|
|
</p>
|
|
|
|
<div className="nf-actions">
|
|
<Link href="/" className="button button-primary">
|
|
← Back home
|
|
</Link>
|
|
<Link href="/contact" className="nf-btn-ghost">
|
|
Contact the yard
|
|
</Link>
|
|
</div>
|
|
|
|
<div className="nf-cards">
|
|
<Link href="/masonry-supplies#catalog" className="nf-card">
|
|
<span className="nf-card-label">Masonry Catalog</span>
|
|
<strong className="nf-card-title">
|
|
Brick, mortar, cement & tools
|
|
</strong>
|
|
<span className="nf-card-cta">
|
|
Open masonry inventory
|
|
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true"><path d="M5 12h14M12 5l7 7-7 7" /></svg>
|
|
</span>
|
|
</Link>
|
|
|
|
<Link href="/landscaping-supplies#catalog" className="nf-card">
|
|
<span className="nf-card-label">Natural Stone</span>
|
|
<strong className="nf-card-title">
|
|
Flagstone, gravel & decorative rock
|
|
</strong>
|
|
<span className="nf-card-cta">
|
|
Browse landscaping materials
|
|
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true"><path d="M5 12h14M12 5l7 7-7 7" /></svg>
|
|
</span>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|