diff --git a/src/App.jsx b/src/App.jsx index 68b1df3..65786df 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -18,6 +18,7 @@ import AboutUs from "./Pages/AboutUs"; import OrderPage from "./Pages/OrderPage"; import NotFound from "./Pages/NotFound"; import Feature from "./Pages/Feature"; +import Newsletter from "./Pages/Newsletter"; import Faq from "./Component/Faq"; const App = () => { @@ -71,6 +72,7 @@ const App = () => { } /> } /> } /> + } /> } /> diff --git a/src/Component/Navbar.jsx b/src/Component/Navbar.jsx index 8d30ebe..a3b0a7d 100644 --- a/src/Component/Navbar.jsx +++ b/src/Component/Navbar.jsx @@ -112,6 +112,15 @@ const Navbar = ({ darkMode, toggleDarkMode }) => { About + + + Newsletter + + {/* Auth Buttons */} @@ -212,6 +221,15 @@ const Navbar = ({ darkMode, toggleDarkMode }) => { About + + + Newsletter + + {token !== null ? (
{ + const [email, setEmail] = useState(""); + const [name, setName] = useState(""); + const [isSubscribed, setIsSubscribed] = useState(false); + const [isLoading, setIsLoading] = useState(false); + const [showSuccess, setShowSuccess] = useState(false); + + const handleSubmit = async (e) => { + e.preventDefault(); + if (!email || !name) return; + + setIsLoading(true); + + // Simulate API call + setTimeout(() => { + setIsLoading(false); + setIsSubscribed(true); + setShowSuccess(true); + setEmail(""); + setName(""); + + // Hide success message after 5 seconds + setTimeout(() => { + setShowSuccess(false); + }, 5000); + }, 1500); + }; + + const features = [ + { + icon: , + title: "Plant Care Tips", + description: "Weekly expert advice on caring for your air-purifying plants" + }, + { + icon: , + title: "Latest Research", + description: "Stay updated with the newest air quality research and findings" + }, + { + icon: , + title: "Community Stories", + description: "Read success stories from our Clean Breath community members" + } + ]; + + const containerVariants = { + hidden: { opacity: 0 }, + visible: { + opacity: 1, + transition: { + duration: 0.6, + staggerChildren: 0.2 + } + } + }; + + const itemVariants = { + hidden: { opacity: 0, y: 30 }, + visible: { + opacity: 1, + y: 0, + transition: { duration: 0.6 } + } + }; + + return ( +
+ {/* Success Notification */} + {showSuccess && ( + + + Successfully subscribed to our newsletter! + + + )} + + + {/* Header Section */} + +
+
+ +
+
+

+ Clean Breath Newsletter +

+

+ Join thousands of plant enthusiasts and air quality advocates. Get weekly insights, + expert tips, and the latest research delivered straight to your inbox. +

+
+ +
+ {/* Newsletter Features */} + +

+ What You'll Receive +

+
+ {features.map((feature, index) => ( + +
{feature.icon}
+
+

+ {feature.title} +

+

+ {feature.description} +

+
+
+ ))} +
+ + {/* Stats Section */} + +
+
+
15K+
+
Subscribers
+
+
+
98%
+
Satisfaction
+
+
+
Weekly
+
Delivery
+
+
+
+
+ + {/* Subscription Form */} + +
+

+ Subscribe Now +

+ +
+
+ + setName(e.target.value)} + className="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-transparent bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 transition-colors duration-200" + placeholder="Enter your full name" + required + /> +
+ +
+ + setEmail(e.target.value)} + className="w-full px-4 py-3 border border-gray-300 dark:border-gray-600 rounded-lg focus:ring-2 focus:ring-green-500 focus:border-transparent bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 transition-colors duration-200" + placeholder="Enter your email address" + required + /> +
+ + + {isLoading ? ( +
+
+ Subscribing... +
+ ) : ( +
+ + Subscribe to Newsletter +
+ )} +
+
+ +

+ We respect your privacy. Unsubscribe at any time. +

+
+ + {/* Testimonial */} + +

+ "The Clean Breath newsletter has transformed how I care for my plants. + The weekly tips are incredibly valuable!" +

+
+
+ S +
+
+
Sarah Johnson
+
Plant Enthusiast
+
+
+
+
+
+ + {/* FAQ Section */} + +

+ Frequently Asked Questions +

+
+ {[ + { + question: "How often will I receive newsletters?", + answer: "We send out newsletters weekly, every Wednesday morning." + }, + { + question: "Can I unsubscribe anytime?", + answer: "Yes, you can unsubscribe at any time with one click from any newsletter." + }, + { + question: "Is my email address safe?", + answer: "Absolutely. We never share your email with third parties and follow strict privacy policies." + }, + { + question: "What type of content do you share?", + answer: "Plant care tips, air quality research, community stories, and seasonal gardening advice." + } + ].map((faq, index) => ( +
+

+ {faq.question} +

+

+ {faq.answer} +

+
+ ))} +
+
+
+
+ ); +}; + +export default Newsletter;