44 lines
1.9 KiB
TypeScript
44 lines
1.9 KiB
TypeScript
export function PhotoGallery() {
|
|
return (
|
|
<section className="py-20 bg-white">
|
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div className="text-center mb-16">
|
|
<h2 className="text-3xl md:text-4xl font-playfair font-semibold text-rose mb-4">
|
|
Follow My Journey
|
|
</h2>
|
|
<p className="max-w-3xl mx-auto text-gray-600">
|
|
See the latest from my Pilates practice and teaching on Instagram
|
|
</p>
|
|
</div>
|
|
|
|
<div className="flex justify-center">
|
|
<div className="w-full max-w-4xl">
|
|
{/* Instagram Feed Embed */}
|
|
<div className="bg-gray-50 rounded-lg p-8 text-center">
|
|
<div className="mb-6">
|
|
<i className="fab fa-instagram text-6xl text-pink-500 mb-4"></i>
|
|
<p className="text-gray-600 mb-6">Follow me on Instagram for daily inspiration, movement tips, and behind-the-scenes content from my classes.</p>
|
|
</div>
|
|
|
|
|
|
|
|
{/* Instagram embed placeholder - this would typically be replaced with actual Instagram embed code */}
|
|
<div className="mt-8 bg-white rounded-lg border border-gray-200 p-6">
|
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
|
{[1, 2, 3, 4, 5, 6].map((index) => (
|
|
<div key={index} className="aspect-square bg-gray-100 rounded-lg flex items-center justify-center">
|
|
<i className="fab fa-instagram text-3xl text-gray-400"></i>
|
|
</div>
|
|
))}
|
|
</div>
|
|
<p className="text-sm text-gray-500 mt-4">
|
|
Instagram feed will display here. For the best experience, visit my Instagram profile directly.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
} |