Merge version_2_1781440899513 into main #1

Merged
bender merged 3 commits from version_2_1781440899513 into main 2026-06-14 12:45:04 +00:00
4 changed files with 46 additions and 1 deletions

View File

@@ -2,11 +2,13 @@ import { Routes, Route } from 'react-router-dom';
import Layout from './components/Layout';
import HomePage from './pages/HomePage';
import ProductPage from "@/pages/ProductPage";
export default function App() {
return (
<Routes>
<Route element={<Layout />}>
<Route path="/" element={<HomePage />} />
<Route path="/product" element={<ProductPage />} />
</Route>
</Routes>
);

View File

@@ -35,7 +35,9 @@ export default function Layout() {
{
"name": "Featured",
"href": "#featured"
}
},
{ name: "Product", href: "/product" },
];
return (

40
src/pages/ProductPage.tsx Normal file
View File

@@ -0,0 +1,40 @@
import Button from "@/components/ui/Button";
import HeroBackgroundSlot from "@/components/ui/HeroBackgroundSlot";
import TextAnimation from "@/components/ui/TextAnimation";
import ImageOrVideo from "@/components/ui/ImageOrVideo";
import ScrollReveal from "@/components/ui/ScrollReveal";
import FaqSimple from "@/components/sections/faq/FaqSimple";
export default function ProductPage() {
return (
<>
<div data-webild-section="HeroSplit"><section aria-label="Hero section" className="relative flex items-center h-fit md:h-svh md:py-0"><HeroBackgroundSlot /><div className="flex flex-col md:flex-row items-center w-content-width mx-auto"><div className="w-full md:w-1/2"><div className="flex flex-col items-center md:items-start gap-3"><div className="px-3 py-1 mb-1 text-sm card rounded w-fit"><p>🔥 Limited Stock</p></div><TextAnimation text="Ultra-Slim Magnetic Power Bank" variant="slide-up" gradientText={true} tag="h1" className="text-7xl 2xl:text-8xl leading-[1.15] font-semibold text-center md:text-left text-balance" /><TextAnimation text="Never run out of battery again. Snap on this premium power bank for instant, fast charging. Over 450 units sold today—grab yours before stock runs out!" variant="slide-up" gradientText={false} tag="p" className="md:max-w-8/10 text-lg md:text-xl leading-snug text-center md:text-left text-balance" /><div className="flex flex-wrap max-md:justify-center gap-3 mt-2 md:mt-3"><Button text="Buy Now (COD)" href="#checkout" variant="primary" /><Button text="View Specs" href="#details" variant="secondary" animationDelay={0.1} /></div></div></div><ScrollReveal variant="fade-blur" delay={0.2} className="w-full md:w-1/2 h-100 md:h-[65vh] md:max-h-[75svh] p-2 xl:p-3 2xl:p-4 card rounded overflow-hidden"><ImageOrVideo imageSrc="https://img.freepik.com/free-photo/smartphone-with-wireless-charging-pad-desk_23-2148288210.jpg" /></ScrollReveal></div></section></div>
<div data-webild-section="SocialProofMarquee"><section aria-label="Social proof section" className=""><div className="flex flex-col gap-8"><div className="flex flex-col items-center gap-2 w-content-width mx-auto"><div className="px-3 py-1 mb-1 text-sm card rounded w-fit"><p>Verified Buyers</p></div><TextAnimation text="Loved by Our Customers" variant="fade-blur" gradientText={true} tag="h2" className="md:max-w-8/10 text-6xl 2xl:text-7xl leading-[1.15] font-semibold text-center text-balance" /><TextAnimation text="Experience the premium quality and fast delivery that our customers rave about." variant="fade-blur" gradientText={false} tag="p" className="md:max-w-7/10 text-lg md:text-xl leading-snug text-center text-balance" /><div className="flex flex-wrap justify-center gap-3 mt-2 md:mt-3"><Button text="Shop Trending" href="#products" variant="primary" /><Button text="Read Reviews" href="#reviews" variant="secondary" animationDelay={0.1} /></div></div><ScrollReveal variant="fade" className="w-content-width mx-auto overflow-hidden mask-fade-x"><div className="flex w-max animate-marquee-horizontal" style={{"animationDuration":"45s"}}><div key={0} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Ananya S.</span></div>
<div key={1} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Rahul V.</span></div>
<div key={2} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Priya M.</span></div>
<div key={3} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Vikram J.</span></div>
<div key={4} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Sneha K.</span></div>
<div key={5} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Ananya S.</span></div>
<div key={6} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Rahul V.</span></div>
<div key={7} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Priya M.</span></div>
<div key={8} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Vikram J.</span></div>
<div key={9} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Sneha K.</span></div>
<div key={10} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Ananya S.</span></div>
<div key={11} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Rahul V.</span></div>
<div key={12} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Priya M.</span></div>
<div key={13} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Vikram J.</span></div>
<div key={14} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Sneha K.</span></div>
<div key={15} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Ananya S.</span></div>
<div key={16} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Rahul V.</span></div>
<div key={17} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Priya M.</span></div>
<div key={18} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Vikram J.</span></div>
<div key={19} className="shrink-0 mx-3 px-5 py-3 rounded card"><span className="text-2xl font-semibold whitespace-nowrap opacity-75">Sneha K.</span></div></div></ScrollReveal></div></section></div>
<div data-webild-section="FaqSimple"><FaqSimple
tag="Got Questions?"title="Frequently Asked Questions"
description="Everything you need to know about shopping with MalwaDrop. Fast delivery, easy returns, and secure payments."
primaryButton={{"text":"Contact Support","href":"/contact"}}
items={[{"question":"Do you offer Cash on Delivery (COD)?","answer":"Yes! We offer Cash on Delivery across all major pin codes. You can pay when your order arrives at your doorstep."},{"question":"How long does delivery take?","answer":"Most orders are dispatched within 24 hours and delivered within 3-5 business days depending on your location."},{"question":"What is your return policy?","answer":"We offer a hassle-free 7-day return policy. If you're not satisfied, simply initiate a return from your account dashboard."},{"question":"Are the products genuine?","answer":"Absolutely. We source all our trending products directly from verified manufacturers to ensure premium quality and authenticity."},{"question":"How can I track my order?","answer":"Once your order ships, you'll receive a tracking link via SMS and email to monitor your delivery in real-time."}]}
/></div>
</>
);
}

View File

@@ -6,4 +6,5 @@ export interface Route {
export const routes: Route[] = [
{ path: '/', label: 'Home', pageFile: 'HomePage' },
{ path: '/product', label: 'Product', pageFile: 'ProductPage' },
];