47 lines
2.0 KiB
JavaScript
47 lines
2.0 KiB
JavaScript
/*
|
|
* Page that shows information about the pet store and what it offers.
|
|
*
|
|
* Author: Shiv
|
|
* Date: April 2026
|
|
*/
|
|
|
|
//About page
|
|
//Three info cards covering what the store does, its focus, and how to visit
|
|
export default function AboutPage() {
|
|
return (
|
|
<main className="bg-gradient-to-b from-[#f9f9f9] to-white">
|
|
<section className="text-center px-8 pt-10 pb-6">
|
|
<h1 className="text-[1.6rem] font-bold text-[#333] mb-2 uppercase tracking-[0.08em]">About Leon's Pet Store</h1>
|
|
<p className="text-base text-[#888] mb-4 max-w-[520px] mx-auto leading-relaxed">Pet care, adoption support, grooming, and everyday essentials in one place.</p>
|
|
<div className="w-[100px] h-1 bg-[#e68672] mx-auto mt-8 rounded-sm"></div>
|
|
</section>
|
|
|
|
<section className="max-w-[1200px] mx-auto px-8 pb-6 grid grid-cols-3 gap-6 max-[768px]:grid-cols-1">
|
|
<div className="bg-white rounded-2xl shadow-[0_4px_12px_rgba(0,0,0,0.08)] p-6">
|
|
<h2 className="mt-0 mb-4 text-[#222]">What We Do</h2>
|
|
<p>
|
|
Leon's Pet Store connects families with adoptable pets, helpful services, and quality products for day-to-day pet care.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="bg-white rounded-2xl shadow-[0_4px_12px_rgba(0,0,0,0.08)] p-6">
|
|
<h2 className="mt-0 mb-4 text-[#222]">Our Focus</h2>
|
|
<ul className="m-0 pl-5 grid gap-2 list-disc">
|
|
<li>Support responsible pet adoption</li>
|
|
<li>Provide grooming and care services</li>
|
|
<li>Offer reliable pet supplies and essentials</li>
|
|
<li>Create a friendly experience for customers and staff</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div className="bg-white rounded-2xl shadow-[0_4px_12px_rgba(0,0,0,0.08)] p-6">
|
|
<h2 className="mt-0 mb-4 text-[#222]">Visit the Store</h2>
|
|
<p>
|
|
Browse adoptable pets, schedule appointments, shop products, or contact the team for help finding the right fit for a pet and household.
|
|
</p>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
);
|
|
}
|