about page added
This commit is contained in:
parent
ecf9b8a582
commit
57b015b62c
12 changed files with 579 additions and 8 deletions
BIN
public/assets/images/image-3.png
Normal file
BIN
public/assets/images/image-3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 120 KiB |
BIN
public/assets/images/teams/CEO.webp
Normal file
BIN
public/assets/images/teams/CEO.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
BIN
public/assets/images/teams/fahim.webp
Normal file
BIN
public/assets/images/teams/fahim.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 69 KiB |
BIN
public/assets/images/teams/forhadsir.webp
Normal file
BIN
public/assets/images/teams/forhadsir.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 79 KiB |
BIN
public/assets/images/teams/pintu.webp
Normal file
BIN
public/assets/images/teams/pintu.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 36 KiB |
BIN
public/assets/images/teams/sahin-vai.jpeg
Normal file
BIN
public/assets/images/teams/sahin-vai.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 72 KiB |
BIN
public/assets/images/teams/shakil.webp
Normal file
BIN
public/assets/images/teams/shakil.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 110 KiB |
470
src/app/about/page.tsx
Normal file
470
src/app/about/page.tsx
Normal file
|
|
@ -0,0 +1,470 @@
|
||||||
|
import Image from "next/image"
|
||||||
|
import Link from "next/link"
|
||||||
|
import { ArrowRight, Share2, Instagram, Twitter, Facebook, Linkedin, MapPin, BrainCircuit, Captions, Hash, ChartLine, CalendarCheck } from "lucide-react"
|
||||||
|
import Teams from "@/components/about/Teams"
|
||||||
|
|
||||||
|
export default function AboutPage() {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen bg-white">
|
||||||
|
{/* Hero Section */}
|
||||||
|
<section className="relative py-20 overflow-hidden bg-gradient-to-b from-blue-50 to-white">
|
||||||
|
<div className="container px-4 mx-auto max-w-7xl">
|
||||||
|
<div className="flex flex-col items-center text-center">
|
||||||
|
<h1 className="text-4xl font-bold tracking-tight text-gray-900 sm:text-5xl md:text-6xl">
|
||||||
|
About <span className="text-[#6a47ed]">Planpost AI</span>
|
||||||
|
</h1>
|
||||||
|
<p className="max-w-2xl mt-6 text-xl text-gray-600">
|
||||||
|
Revolutionizing social media content creation with the power of artificial intelligence.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="absolute -bottom-24 left-1/2 transform -translate-x-1/2">
|
||||||
|
<div className="w-64 h-64 bg-blue-100 rounded-full opacity-20"></div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Our Mission */}
|
||||||
|
<section className="py-20">
|
||||||
|
<div className="container px-4 mx-auto max-w-7xl">
|
||||||
|
<div className="grid grid-cols-1 gap-12 md:grid-cols-2 items-center">
|
||||||
|
<div>
|
||||||
|
<Image
|
||||||
|
src="/assets/images/teams/sahin-vai.jpeg"
|
||||||
|
alt="Our Mission"
|
||||||
|
width={500}
|
||||||
|
height={500}
|
||||||
|
className="rounded-lg shadow-xl"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h2 className="text-3xl font-bold text-gray-900">Our Mission</h2>
|
||||||
|
<div className="w-20 h-1 mt-2 bg-[#6a47ed]"></div>
|
||||||
|
<p className="mt-6 text-lg text-gray-600">
|
||||||
|
At Planpost AI, we're on a mission to simplify content creation for businesses and creators. We believe
|
||||||
|
that everyone should have access to powerful AI tools that can help them create engaging social media
|
||||||
|
content without the need for expensive designers or copywriters.
|
||||||
|
</p>
|
||||||
|
<p className="mt-4 text-lg text-gray-600">
|
||||||
|
Our platform is designed to democratize content creation, making it accessible to businesses of all
|
||||||
|
sizes, from solopreneurs to large enterprises.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* What We Offer */}
|
||||||
|
<section className="py-20 bg-gray-50">
|
||||||
|
<div className="container px-4 mx-auto max-w-7xl">
|
||||||
|
<div className="text-center mb-16">
|
||||||
|
<h2 className="text-3xl font-bold text-gray-900">What We Offer</h2>
|
||||||
|
<div className="w-20 h-1 mt-2 mx-auto bg-[#6a47ed]"></div>
|
||||||
|
<p className="mt-6 text-lg text-gray-600 max-w-3xl mx-auto">
|
||||||
|
Planpost AI combines cutting-edge artificial intelligence with intuitive design to help you create and
|
||||||
|
distribute social media content effortlessly.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid grid-cols-1 gap-8 md:grid-cols-2 lg:grid-cols-3">
|
||||||
|
{/* Feature 1 */}
|
||||||
|
<div className="p-6 bg-white rounded-lg shadow-md">
|
||||||
|
<div className="flex items-center justify-center w-12 h-12 mb-4 bg-blue-100 rounded-full">
|
||||||
|
|
||||||
|
<BrainCircuit className="w-6 h-6 text-blue-600" />
|
||||||
|
</div>
|
||||||
|
<h3 className="mb-3 text-xl font-semibold text-gray-900">AI-Generated Templates</h3>
|
||||||
|
<p className="text-gray-600">
|
||||||
|
Create stunning social media ad templates tailored to your brand with just a few clicks.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Feature 2 */}
|
||||||
|
<div className="p-6 bg-white rounded-lg shadow-md">
|
||||||
|
<div className="flex items-center justify-center w-12 h-12 mb-4 bg-blue-100 rounded-full">
|
||||||
|
<Captions className="w-6 h-6 text-blue-600" />
|
||||||
|
</div>
|
||||||
|
<h3 className="mb-3 text-xl font-semibold text-gray-900">Engaging Captions</h3>
|
||||||
|
<p className="text-gray-600">
|
||||||
|
Generate compelling captions that resonate with your audience and drive engagement.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Feature 3 */}
|
||||||
|
<div className="p-6 bg-white rounded-lg shadow-md">
|
||||||
|
<div className="flex items-center justify-center w-12 h-12 mb-4 bg-blue-100 rounded-full">
|
||||||
|
<Hash className="w-6 h-6 text-blue-600" />
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<h3 className="mb-3 text-xl font-semibold text-gray-900">Smart Hashtags</h3>
|
||||||
|
<p className="text-gray-600">
|
||||||
|
Discover trending and relevant hashtags that increase your content's visibility.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Feature 4 */}
|
||||||
|
<div className="p-6 bg-white rounded-lg shadow-md">
|
||||||
|
<div className="flex items-center justify-center w-12 h-12 mb-4 bg-blue-100 rounded-full">
|
||||||
|
<Share2 className="w-6 h-6 text-blue-600" />
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<h3 className="mb-3 text-xl font-semibold text-gray-900">One-Click Sharing</h3>
|
||||||
|
<p className="text-gray-600">
|
||||||
|
Share your content across multiple social media platforms with a single click.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Feature 5 */}
|
||||||
|
<div className="p-6 bg-white rounded-lg shadow-md">
|
||||||
|
<div className="flex items-center justify-center w-12 h-12 mb-4 bg-blue-100 rounded-full">
|
||||||
|
<ChartLine className="w-6 h-6 text-blue-600" />
|
||||||
|
</div>
|
||||||
|
<h3 className="mb-3 text-xl font-semibold text-gray-900">Performance Analytics</h3>
|
||||||
|
<p className="text-gray-600">
|
||||||
|
Track your content's performance and gain insights to optimize your strategy.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Feature 6 */}
|
||||||
|
<div className="p-6 bg-white rounded-lg shadow-md">
|
||||||
|
<div className="flex items-center justify-center w-12 h-12 mb-4 bg-blue-100 rounded-full">
|
||||||
|
<CalendarCheck className="w-6 h-6 text-blue-600" />
|
||||||
|
</div>
|
||||||
|
<h3 className="mb-3 text-xl font-semibold text-gray-900">Smart Scheduling</h3>
|
||||||
|
<p className="text-gray-600">Schedule your posts for optimal times to maximize engagement and reach.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* How It Works */}
|
||||||
|
<section className="py-20">
|
||||||
|
<div className="container px-4 mx-auto max-w-7xl">
|
||||||
|
<div className="text-center mb-16">
|
||||||
|
<h2 className="text-3xl font-bold text-gray-900">How It Works</h2>
|
||||||
|
<div className="w-20 h-1 mt-2 mx-auto bg-[#6a47ed]"></div>
|
||||||
|
<p className="mt-6 text-lg text-gray-600 max-w-3xl mx-auto">
|
||||||
|
Creating and sharing content with Planpost AI is simple and intuitive.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid grid-cols-1 gap-8 md:grid-cols-3">
|
||||||
|
{/* Step 1 */}
|
||||||
|
<div className="relative">
|
||||||
|
<div className="flex items-center justify-center w-16 h-16 mb-6 bg-[#6a47ed] rounded-full text-white text-2xl font-bold">
|
||||||
|
1
|
||||||
|
</div>
|
||||||
|
<h3 className="mb-3 text-xl font-semibold text-gray-900">Generate Content</h3>
|
||||||
|
<p className="text-gray-600">
|
||||||
|
Describe what you need, and our AI will create templates, captions, and hashtags tailored to your brand.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Step 2 */}
|
||||||
|
<div className="relative">
|
||||||
|
<div className="flex items-center justify-center w-16 h-16 mb-6 bg-[#6a47ed] rounded-full text-white text-2xl font-bold">
|
||||||
|
2
|
||||||
|
</div>
|
||||||
|
<h3 className="mb-3 text-xl font-semibold text-gray-900">Customize</h3>
|
||||||
|
<p className="text-gray-600">
|
||||||
|
Fine-tune the generated content to match your exact requirements and brand voice.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Step 3 */}
|
||||||
|
<div className="relative">
|
||||||
|
<div className="flex items-center justify-center w-16 h-16 mb-6 bg-[#6a47ed] rounded-full text-white text-2xl font-bold">
|
||||||
|
3
|
||||||
|
</div>
|
||||||
|
<h3 className="mb-3 text-xl font-semibold text-gray-900">Share</h3>
|
||||||
|
<p className="text-gray-600">
|
||||||
|
Share your content across multiple platforms with a single click or schedule it for later.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<Teams />
|
||||||
|
|
||||||
|
{/* CTA Section */}
|
||||||
|
<section className="py-20 bg-[#6a47ed]">
|
||||||
|
<div className="container px-4 mx-auto max-w-7xl">
|
||||||
|
<div className="text-center">
|
||||||
|
<h2 className="text-3xl font-bold text-white">Ready to Transform Your Social Media Strategy?</h2>
|
||||||
|
<p className="mt-4 text-xl text-blue-100 max-w-3xl mx-auto">
|
||||||
|
Join thousands of businesses and creators who are saving time and creating better content with Planpost
|
||||||
|
AI.
|
||||||
|
</p>
|
||||||
|
<div className="mt-8">
|
||||||
|
<Link
|
||||||
|
href="/signup"
|
||||||
|
className="inline-flex items-center px-6 py-3 text-base font-medium text-blue-600 bg-white border border-transparent rounded-md shadow-sm hover:bg-blue-50"
|
||||||
|
>
|
||||||
|
Get Started Free
|
||||||
|
<ArrowRight className="w-5 h-5 ml-2" />
|
||||||
|
</Link>
|
||||||
|
<Link
|
||||||
|
href="/demo"
|
||||||
|
className="inline-flex items-center px-6 py-3 ml-4 text-base font-medium text-white bg-transparent border border-white rounded-md hover:bg-[#6641ef]"
|
||||||
|
>
|
||||||
|
Request Demo
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Social Proof */}
|
||||||
|
<section className="py-20">
|
||||||
|
<div className="container px-4 mx-auto max-w-7xl">
|
||||||
|
<div className="text-center mb-16">
|
||||||
|
<h2 className="text-3xl font-bold text-gray-900">Trusted by Businesses Worldwide</h2>
|
||||||
|
<div className="w-20 h-1 mt-2 mx-auto bg-[#6a47ed]"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid grid-cols-2 gap-8 md:grid-cols-4 lg:grid-cols-6">
|
||||||
|
{[...Array(6)].map((_, i) => (
|
||||||
|
<div key={i} className="flex items-center justify-center">
|
||||||
|
<Image
|
||||||
|
src="/assets/images/logo.webp"
|
||||||
|
alt={`Company ${i + 1}`}
|
||||||
|
width={120}
|
||||||
|
height={60}
|
||||||
|
className="opacity-50 hover:opacity-100 transition-opacity"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Contact Section */}
|
||||||
|
<section className="py-20 bg-gray-50">
|
||||||
|
<div className="container px-4 mx-auto max-w-7xl">
|
||||||
|
<div className="grid grid-cols-1 gap-12 md:grid-cols-2">
|
||||||
|
<div>
|
||||||
|
<h2 className="text-3xl font-bold text-gray-900">Get in Touch</h2>
|
||||||
|
<div className="w-20 h-1 mt-2 bg-[#6a47ed]"></div>
|
||||||
|
<p className="mt-6 text-lg text-gray-600">
|
||||||
|
Have questions about Planpost AI? We're here to help. Reach out to our team for support, partnership
|
||||||
|
opportunities, or just to say hello.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="mt-8">
|
||||||
|
<div className="flex items-center mt-4">
|
||||||
|
<div className="flex items-center justify-center w-10 h-10 bg-blue-100 rounded-full">
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="w-5 h-5 text-blue-600"
|
||||||
|
fill="none"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
stroke="currentColor"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
strokeWidth={2}
|
||||||
|
d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div className="ml-4">
|
||||||
|
<p className="text-sm font-medium text-gray-900">Email</p>
|
||||||
|
<p className="text-sm text-gray-600"> <a
|
||||||
|
href="mailto:contact@adspillar.com"
|
||||||
|
className="hover:underline"
|
||||||
|
>
|
||||||
|
shahin@adspillar.com
|
||||||
|
</a></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex items-center mt-4">
|
||||||
|
<div className="flex items-center justify-center w-10 h-10 bg-blue-100 rounded-full">
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="w-5 h-5 text-blue-600"
|
||||||
|
fill="none"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
stroke="currentColor"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
strokeWidth={2}
|
||||||
|
d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div className="ml-4">
|
||||||
|
<p className="text-sm font-medium text-gray-900">Phone</p>
|
||||||
|
<p className="text-sm text-gray-600"> <a
|
||||||
|
href="tel:+8801784493232"
|
||||||
|
className="hover:underline"
|
||||||
|
>
|
||||||
|
+880 1784-493232
|
||||||
|
</a></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex items-center mt-4">
|
||||||
|
<div className="flex items-center justify-center w-10 h-10 bg-blue-100 rounded-full">
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="w-5 h-5 text-blue-600"
|
||||||
|
fill="none"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
stroke="currentColor"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
strokeWidth={2}
|
||||||
|
d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
strokeWidth={2}
|
||||||
|
d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
<div className="ml-4">
|
||||||
|
<p className="text-sm font-medium text-gray-900">Address</p>
|
||||||
|
<p className="text-sm text-gray-600">Ads Pillar - 965 (6th Floor, Apartment D, Begum Rokeya Avenue, Dhaka 1216)</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="flex mt-8 space-x-4">
|
||||||
|
<a
|
||||||
|
href="https://www.facebook.com/PlanPostAI/"
|
||||||
|
className="bg-pink-500 text-white p-3 rounded-full hover:bg-pink-600 transition-colors"
|
||||||
|
aria-label="Facebook"
|
||||||
|
>
|
||||||
|
<Facebook size={20} />
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
href="https://x.com/planpost_ai"
|
||||||
|
className="bg-pink-500 text-white p-3 rounded-full hover:bg-pink-600 transition-colors"
|
||||||
|
aria-label="Twitter"
|
||||||
|
>
|
||||||
|
<Twitter size={20} />
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
href="https://www.linkedin.com/company/planpost-ai"
|
||||||
|
className="bg-pink-500 text-white p-3 rounded-full hover:bg-pink-600 transition-colors"
|
||||||
|
aria-label="LinkedIn"
|
||||||
|
>
|
||||||
|
<Linkedin size={20} />
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
href="https://www.instagram.com/planpostai"
|
||||||
|
className="bg-pink-500 text-white p-3 rounded-full hover:bg-pink-600 transition-colors"
|
||||||
|
aria-label="Instagram"
|
||||||
|
>
|
||||||
|
<Instagram size={20} />
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="p-6 bg-white rounded-lg shadow-md">
|
||||||
|
<h3 className="mb-4 text-xl font-semibold text-gray-900">Send Us a Message</h3>
|
||||||
|
<form>
|
||||||
|
<div className="grid grid-cols-1 gap-6 sm:grid-cols-2">
|
||||||
|
<div>
|
||||||
|
<label htmlFor="first-name" className="block text-sm font-medium text-gray-700">
|
||||||
|
First Name
|
||||||
|
</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="first-name"
|
||||||
|
className="w-full px-3 py-2 mt-1 border border-gray-300 rounded-md focus:outline-none focus:ring-blue-500 focus:border-blue-500"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label htmlFor="last-name" className="block text-sm font-medium text-gray-700">
|
||||||
|
Last Name
|
||||||
|
</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="last-name"
|
||||||
|
className="w-full px-3 py-2 mt-1 border border-gray-300 rounded-md focus:outline-none focus:ring-blue-500 focus:border-blue-500"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="mt-4">
|
||||||
|
<label htmlFor="email" className="block text-sm font-medium text-gray-700">
|
||||||
|
Email
|
||||||
|
</label>
|
||||||
|
<input
|
||||||
|
type="email"
|
||||||
|
id="email"
|
||||||
|
className="w-full px-3 py-2 mt-1 border border-gray-300 rounded-md focus:outline-none focus:ring-blue-500 focus:border-blue-500"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="mt-4">
|
||||||
|
<label htmlFor="subject" className="block text-sm font-medium text-gray-700">
|
||||||
|
Subject
|
||||||
|
</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="subject"
|
||||||
|
className="w-full px-3 py-2 mt-1 border border-gray-300 rounded-md focus:outline-none focus:ring-blue-500 focus:border-blue-500"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="mt-4">
|
||||||
|
<label htmlFor="message" className="block text-sm font-medium text-gray-700">
|
||||||
|
Message
|
||||||
|
</label>
|
||||||
|
<textarea
|
||||||
|
id="message"
|
||||||
|
rows={4}
|
||||||
|
className="w-full px-3 py-2 mt-1 border border-gray-300 rounded-md focus:outline-none focus:ring-blue-500 focus:border-blue-500"
|
||||||
|
></textarea>
|
||||||
|
</div>
|
||||||
|
<div className="mt-6">
|
||||||
|
<button
|
||||||
|
type="submit"
|
||||||
|
className="w-full px-4 py-2 text-white font-bold bg-pink-500 rounded-md hover:bg-pink-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-pink-500"
|
||||||
|
>
|
||||||
|
Send Message
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/* Map Section */}
|
||||||
|
<div className="mt-16 space-y-6">
|
||||||
|
<div className="flex items-center space-x-2">
|
||||||
|
<MapPin className="text-pink-500" size={24} />
|
||||||
|
<h2 className="text-2xl font-semibold">Our Location</h2>
|
||||||
|
</div>
|
||||||
|
<p className="text-lg">
|
||||||
|
Ads Pillar - 965 (6th Floor, Apartment D, Begum Rokeya Avenue, Dhaka
|
||||||
|
1216)
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="w-full h-[400px] rounded-lg overflow-hidden shadow-md">
|
||||||
|
<iframe
|
||||||
|
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3650.7368281727336!2d90.37267777531028!3d23.792384087163313!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3755c5548eab48e1%3A0xdadd813caa2f692a!2sAds%20Pillar%20-!5e0!3m2!1sen!2sbd!4v1740984344459!5m2!1sen!2sbd"
|
||||||
|
width="100%"
|
||||||
|
height="100%"
|
||||||
|
style={{ border: 0 }}
|
||||||
|
allowFullScreen
|
||||||
|
loading="lazy"
|
||||||
|
referrerPolicy="no-referrer-when-downgrade"
|
||||||
|
title="Ads Pillar Location"
|
||||||
|
></iframe>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
@ -71,7 +71,7 @@ const FeatureSection: React.FC<DesignToolProps> = ({
|
||||||
className="clip-path"
|
className="clip-path"
|
||||||
src={imageUrl}
|
src={imageUrl}
|
||||||
alt={imageAlt}
|
alt={imageAlt}
|
||||||
width={650}
|
width={560}
|
||||||
height={491}
|
height={491}
|
||||||
style={
|
style={
|
||||||
imageUrl.endsWith(".gif") ? { clipPath: "inset(0 4px 0 0)" } : {}
|
imageUrl.endsWith(".gif") ? { clipPath: "inset(0 4px 0 0)" } : {}
|
||||||
|
|
@ -84,10 +84,10 @@ const FeatureSection: React.FC<DesignToolProps> = ({
|
||||||
const contentContainer = (
|
const contentContainer = (
|
||||||
<div className="details-box-content p-5 md:p-[50px]">
|
<div className="details-box-content p-5 md:p-[50px]">
|
||||||
<div className="">
|
<div className="">
|
||||||
<span className="text-[#252525] text-xs md:text-2xl font-bold font-['Inter'] leading-normal">
|
<span className="text-[#252525] text-xs md:text-xl font-bold font-['Inter'] leading-normal">
|
||||||
{headingText}
|
{headingText}
|
||||||
</span>
|
</span>
|
||||||
<span className="text-[#6a47ed] text-2xl md:text-[56px] font-bold font-['Inter'] leading-8 md:leading-[56px] block">
|
<span className="text-[#6a47ed] text-2xl md:text-5xl font-bold font-['Inter'] leading-8 md:leading-4xl block">
|
||||||
{coloredHeading}
|
{coloredHeading}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -34,7 +34,7 @@ export default function Footer() {
|
||||||
];
|
];
|
||||||
|
|
||||||
const planpostAi = [
|
const planpostAi = [
|
||||||
{ label: "About Us", url: "https://blog.planpostai.com/about/" },
|
{ label: "About Us", url: "/about/" },
|
||||||
{ label: "Contact", url: "/contact" },
|
{ label: "Contact", url: "/contact" },
|
||||||
{ label: "FAQ", url: "/#faqSection" },
|
{ label: "FAQ", url: "/#faqSection" },
|
||||||
{ label: "Privacy Policy", url: "/privacy-policy" },
|
{ label: "Privacy Policy", url: "/privacy-policy" },
|
||||||
|
|
|
||||||
101
src/components/about/Teams.tsx
Normal file
101
src/components/about/Teams.tsx
Normal file
|
|
@ -0,0 +1,101 @@
|
||||||
|
"use client";
|
||||||
|
import Image from "next/image";
|
||||||
|
import * as React from "react";
|
||||||
|
|
||||||
|
|
||||||
|
export default function Teams() {
|
||||||
|
|
||||||
|
return (
|
||||||
|
|
||||||
|
< section className="py-20 bg-gray-50" >
|
||||||
|
<div className="container px-4 mx-auto max-w-7xl">
|
||||||
|
<div className="text-center mb-16">
|
||||||
|
<h2 className="text-3xl font-bold text-gray-900">Meet Our Team</h2>
|
||||||
|
<div className="w-20 h-1 mt-2 mx-auto bg-[#6a47ed]"></div>
|
||||||
|
<p className="mt-6 text-lg text-gray-600 max-w-3xl mx-auto">
|
||||||
|
We're a passionate team of AI experts, designers, and social media enthusiasts dedicated to making content
|
||||||
|
creation accessible to everyone.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid grid-cols-2 gap-8 sm:grid-cols-3 lg:grid-cols-5">
|
||||||
|
{/* Team Member 1 */}
|
||||||
|
<div className="text-center">
|
||||||
|
<div className="relative mx-auto w-40 h-40 mb-4 overflow-hidden rounded-full">
|
||||||
|
<Image
|
||||||
|
src="/assets/images/teams/CEO.webp"
|
||||||
|
alt="Team Member"
|
||||||
|
width={160}
|
||||||
|
height={160}
|
||||||
|
className="object-cover"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<h3 className="text-xl font-semibold text-gray-900">Md. Shaniur Rahman</h3>
|
||||||
|
<p className="text-[#6a47ed]">CEO & Founder</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Team Member 2 */}
|
||||||
|
<div className="text-center">
|
||||||
|
<div className="relative mx-auto w-40 h-40 mb-4 overflow-hidden rounded-full">
|
||||||
|
<Image
|
||||||
|
src="/assets/images/teams/forhadsir.webp"
|
||||||
|
alt="Team Member"
|
||||||
|
width={160}
|
||||||
|
height={160}
|
||||||
|
className="object-cover"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<h3 className="text-xl font-semibold text-gray-900">Forhad Hossen</h3>
|
||||||
|
<p className="text-[#6a47ed]">COO</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Team Member 3 */}
|
||||||
|
<div className="text-center">
|
||||||
|
<div className="relative mx-auto w-40 h-40 mb-4 overflow-hidden rounded-full">
|
||||||
|
<Image
|
||||||
|
src="/assets/images/teams/shakil.webp"
|
||||||
|
alt="Team Member"
|
||||||
|
width={160}
|
||||||
|
height={160}
|
||||||
|
className="object-cover"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<h3 className="text-xl font-semibold text-gray-900">Shahriar Kabir Shakil</h3>
|
||||||
|
<p className="text-[#6a47ed]">Software Engineer</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Team Member 4 */}
|
||||||
|
<div className="text-center">
|
||||||
|
<div className="relative mx-auto w-40 h-40 mb-4 overflow-hidden rounded-full">
|
||||||
|
<Image
|
||||||
|
src="/assets/images/teams/fahim.webp"
|
||||||
|
alt="Team Member"
|
||||||
|
width={160}
|
||||||
|
height={160}
|
||||||
|
className="object-cover"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<h3 className="text-xl font-semibold text-gray-900">Fahim Hossen</h3>
|
||||||
|
<p className="text-[#6a47ed]">Software Engineer</p>
|
||||||
|
</div>
|
||||||
|
{/* Team Member 5 */}
|
||||||
|
<div className="text-center">
|
||||||
|
<div className="relative mx-auto w-40 h-40 mb-4 overflow-hidden rounded-full">
|
||||||
|
<Image
|
||||||
|
src="/assets/images/teams/pintu.webp"
|
||||||
|
alt="Team Member"
|
||||||
|
width={160}
|
||||||
|
height={160}
|
||||||
|
className="object-cover"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<h3 className="text-xl font-semibold text-gray-900">Jahid Hasan Pintu</h3>
|
||||||
|
<p className="text-[#6a47ed]">Software Engineer</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
@ -84,28 +84,28 @@ export default function ContactPage() {
|
||||||
<h3 className="text-xl font-semibold mb-4">Follow us:</h3>
|
<h3 className="text-xl font-semibold mb-4">Follow us:</h3>
|
||||||
<div className="flex space-x-4">
|
<div className="flex space-x-4">
|
||||||
<a
|
<a
|
||||||
href="#"
|
href="https://www.facebook.com/PlanPostAI/"
|
||||||
className="bg-pink-500 text-white p-3 rounded-full hover:bg-pink-600 transition-colors"
|
className="bg-pink-500 text-white p-3 rounded-full hover:bg-pink-600 transition-colors"
|
||||||
aria-label="Facebook"
|
aria-label="Facebook"
|
||||||
>
|
>
|
||||||
<Facebook size={20} />
|
<Facebook size={20} />
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
href="#"
|
href="https://x.com/planpost_ai"
|
||||||
className="bg-pink-500 text-white p-3 rounded-full hover:bg-pink-600 transition-colors"
|
className="bg-pink-500 text-white p-3 rounded-full hover:bg-pink-600 transition-colors"
|
||||||
aria-label="Twitter"
|
aria-label="Twitter"
|
||||||
>
|
>
|
||||||
<Twitter size={20} />
|
<Twitter size={20} />
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
href="#"
|
href="https://www.linkedin.com/company/planpost-ai"
|
||||||
className="bg-pink-500 text-white p-3 rounded-full hover:bg-pink-600 transition-colors"
|
className="bg-pink-500 text-white p-3 rounded-full hover:bg-pink-600 transition-colors"
|
||||||
aria-label="LinkedIn"
|
aria-label="LinkedIn"
|
||||||
>
|
>
|
||||||
<Linkedin size={20} />
|
<Linkedin size={20} />
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
href="#"
|
href="https://www.instagram.com/planpostai"
|
||||||
className="bg-pink-500 text-white p-3 rounded-full hover:bg-pink-600 transition-colors"
|
className="bg-pink-500 text-white p-3 rounded-full hover:bg-pink-600 transition-colors"
|
||||||
aria-label="Instagram"
|
aria-label="Instagram"
|
||||||
>
|
>
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue