RecentRunner/group-2-threaded-project-petshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Styling refactor

Browse Source
This commit is contained in:
augmentedpotato
2026-04-18 16:12:43 -06:00
committed by Harkamal Randhawa
parent 148b587c05
commit 79c42574f6
21 changed files with 829 additions and 4509 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
web/app/about/page.js
View File

@@ -1,23 +1,23 @@
export default function AboutPage() {
return (
<main className="info-page">
<section className="info-hero">
<h1 className="info-title">About Leon&apos;s Pet Store</h1>
<p className="info-subtitle">Pet care, adoption support, grooming, and everyday essentials in one place.</p>
<div className="title-decoration"></div>
<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&apos;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="info-content">
<div className="info-card">
<h2>What We Do</h2>
<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&apos;s Pet Store connects families with adoptable pets, helpful services, and quality products for day-to-day pet care.
</p>
</div>
<div className="info-card">
<h2>Our Focus</h2>
<ul className="info-list">
<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>
@@ -25,8 +25,8 @@ export default function AboutPage() {
</ul>
</div>
<div className="info-card">
<h2>Visit the Store</h2>
<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>