Merge version_2 into main #1
232
src/app/page.tsx
232
src/app/page.tsx
@@ -13,6 +13,20 @@ import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCar
|
||||
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
||||
|
||||
export default function LandingPage() {
|
||||
const handleDownload = (fileUrl: string, fileName: string) => {
|
||||
fetch(fileUrl)
|
||||
.then((response) => response.blob())
|
||||
.then((blob) => {
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
const a = document.createElement('a');
|
||||
a.href = url;
|
||||
a.download = fileName;
|
||||
document.body.appendChild(a);
|
||||
a.click();
|
||||
a.remove();
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
@@ -31,17 +45,11 @@ export default function LandingPage() {
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Products",
|
||||
id: "products",
|
||||
},
|
||||
name: "Products", id: "products"},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="PPT Store"
|
||||
/>
|
||||
@@ -50,66 +58,40 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
variant: "gradient-bars"}}
|
||||
title="Professional PPT Templates"
|
||||
description="High-quality, ready-to-use presentation templates for only 10 HKD. Buy once, use forever."
|
||||
buttons={[
|
||||
{
|
||||
text: "Shop Now",
|
||||
href: "#products",
|
||||
},
|
||||
text: "Shop Now", href: "#products"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/corporate-building-with-empty-room-chairs_23-2148727504.jpg"
|
||||
imageAlt="professional presentation layout minimalist"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/working-wall_1098-13458.jpg",
|
||||
alt: "Working behind wall",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/working-wall_1098-13458.jpg", alt: "Working behind wall"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/3d-rendering-business-meeting-yellow-working-room-with-stair_105762-1996.jpg",
|
||||
alt: "3d rendering business meeting and yellow working room with stair",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/3d-rendering-business-meeting-yellow-working-room-with-stair_105762-1996.jpg", alt: "3d rendering business meeting and yellow working room with stair"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/corporate-building-with-empty-room_23-2148727503.jpg",
|
||||
alt: "Corporate building with empty room",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/corporate-building-with-empty-room_23-2148727503.jpg", alt: "Corporate building with empty room"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/beautiful-shot-modern-style-open-space-office-interior_181624-19369.jpg",
|
||||
alt: "Beautiful shot of the modern style open space office interior",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/beautiful-shot-modern-style-open-space-office-interior_181624-19369.jpg", alt: "Beautiful shot of the modern style open space office interior"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/mockup-copy-space-blank-screen-concept_53876-120374.jpg",
|
||||
alt: "Mockup Copy Space Blank Screen Concept",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/mockup-copy-space-blank-screen-concept_53876-120374.jpg", alt: "Mockup Copy Space Blank Screen Concept"},
|
||||
]}
|
||||
avatarText="Trusted by 1000+ professionals"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/office-desk-with-pc-mobile-phone-belongings_1252-929.jpg",
|
||||
alt: "Office desk with pc, mobile phone and belongings",
|
||||
},
|
||||
type: "image", src: "http://img.b2bpic.net/free-photo/office-desk-with-pc-mobile-phone-belongings_1252-929.jpg", alt: "Office desk with pc, mobile phone and belongings"},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/laptop-digital-graphic-tablet-with-headphone-pink-backdrop_23-2147880583.jpg",
|
||||
alt: "Laptop and digital graphic tablet with headphone on pink backdrop",
|
||||
},
|
||||
type: "image", src: "http://img.b2bpic.net/free-photo/laptop-digital-graphic-tablet-with-headphone-pink-backdrop_23-2147880583.jpg", alt: "Laptop and digital graphic tablet with headphone on pink backdrop"},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/hand-graphic-designer-working-with-stilus-tablet_93675-131317.jpg",
|
||||
alt: "Hand of graphic designer working with stilus and tablet",
|
||||
},
|
||||
type: "image", src: "http://img.b2bpic.net/free-photo/hand-graphic-designer-working-with-stilus-tablet_93675-131317.jpg", alt: "Hand of graphic designer working with stilus and tablet"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Instant Download",
|
||||
},
|
||||
type: "text", text: "Instant Download"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Alipay HK Verified",
|
||||
},
|
||||
type: "text", text: "Alipay HK Verified"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -122,41 +104,17 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Business Pro",
|
||||
price: "10 HKD",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-minimalist-office-black-white_23-2151777530.jpg",
|
||||
},
|
||||
id: "1", name: "Business Pro", price: "10 HKD", imageSrc: "http://img.b2bpic.net/free-photo/modern-minimalist-office-black-white_23-2151777530.jpg"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Creative Agency",
|
||||
price: "10 HKD",
|
||||
imageSrc: "http://img.b2bpic.net/free-psd/business-card-template-set_53876-98674.jpg",
|
||||
},
|
||||
id: "2", name: "Creative Agency", price: "10 HKD", imageSrc: "http://img.b2bpic.net/free-psd/business-card-template-set_53876-98674.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Data Analyst",
|
||||
price: "10 HKD",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/five-business-slide-templates-set_1262-4132.jpg",
|
||||
},
|
||||
id: "3", name: "Data Analyst", price: "10 HKD", imageSrc: "http://img.b2bpic.net/free-vector/five-business-slide-templates-set_1262-4132.jpg"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Startup Pitch",
|
||||
price: "10 HKD",
|
||||
imageSrc: "http://img.b2bpic.net/free-psd/flat-design-renewable-energy-landing-page_23-2150218824.jpg",
|
||||
},
|
||||
id: "4", name: "Startup Pitch", price: "10 HKD", imageSrc: "http://img.b2bpic.net/free-psd/flat-design-renewable-energy-landing-page_23-2150218824.jpg"},
|
||||
{
|
||||
id: "5",
|
||||
name: "Academic Study",
|
||||
price: "10 HKD",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/front-back-design-card_1308-86654.jpg",
|
||||
},
|
||||
id: "5", name: "Academic Study", price: "10 HKD", imageSrc: "http://img.b2bpic.net/free-vector/front-back-design-card_1308-86654.jpg"},
|
||||
{
|
||||
id: "6",
|
||||
name: "Creative Portfolio",
|
||||
price: "10 HKD",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=dm6lxo",
|
||||
},
|
||||
id: "6", name: "Creative Portfolio", price: "10 HKD", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=dm6lxo"},
|
||||
]}
|
||||
title="Our PPT Collection"
|
||||
description="Choose your perfect slide deck design."
|
||||
@@ -168,9 +126,7 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
title="Why Our PPTs?"
|
||||
description={[
|
||||
"We craft professional, clean, and highly customizable PPT templates to help you shine in your presentations.",
|
||||
"Simply pay 10 HKD to our Alipay HK account (84025713) and contact us with your receipt to receive your files instantly.",
|
||||
]}
|
||||
"We craft professional, clean, and highly customizable PPT templates to help you shine in your presentations.", "Simply pay 10 HKD to our Alipay HK account (84025713) and contact us with your receipt to receive your files instantly."]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -180,26 +136,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
tag: "Design",
|
||||
title: "Modern Layouts",
|
||||
subtitle: "Contemporary styles",
|
||||
description: "Designed by experts.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5aw6ii",
|
||||
},
|
||||
tag: "Design", title: "Modern Layouts", subtitle: "Contemporary styles", description: "Designed by experts.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5aw6ii"},
|
||||
{
|
||||
tag: "Editable",
|
||||
title: "Fully Custom",
|
||||
subtitle: "Edit every pixel",
|
||||
description: "Customizable content.",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/six-geometric-business-cards_1207-237.jpg",
|
||||
},
|
||||
tag: "Editable", title: "Fully Custom", subtitle: "Edit every pixel", description: "Customizable content.", imageSrc: "http://img.b2bpic.net/free-vector/six-geometric-business-cards_1207-237.jpg"},
|
||||
{
|
||||
tag: "Fast",
|
||||
title: "Instant Delivery",
|
||||
subtitle: "Quick workflow",
|
||||
description: "Just pay and get.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/no-people-contemporary-building-exterior-skyscraper-design-concept_53876-124197.jpg",
|
||||
},
|
||||
tag: "Fast", title: "Instant Delivery", subtitle: "Quick workflow", description: "Just pay and get.", imageSrc: "http://img.b2bpic.net/free-photo/no-people-contemporary-building-exterior-skyscraper-design-concept_53876-124197.jpg"},
|
||||
]}
|
||||
title="Everything You Need"
|
||||
description="Our templates are designed for maximum impact and minimal effort."
|
||||
@@ -213,40 +154,15 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alex Wong",
|
||||
role: "Marketing",
|
||||
testimonial: "The best templates I have ever used for my meetings.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-cheerful-man-sitting-desk_329181-15290.jpg",
|
||||
},
|
||||
id: "1", name: "Alex Wong", role: "Marketing", testimonial: "The best templates I have ever used for my meetings.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-cheerful-man-sitting-desk_329181-15290.jpg"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Sarah Lee",
|
||||
role: "Designer",
|
||||
testimonial: "Very professional and easy to customize.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-positive-businesswoman_1098-3531.jpg",
|
||||
},
|
||||
id: "2", name: "Sarah Lee", role: "Designer", testimonial: "Very professional and easy to customize.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-positive-businesswoman_1098-3531.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Ken Chan",
|
||||
role: "Startup Founder",
|
||||
testimonial: "Saved me hours of work for just 10 HKD.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-good-looking-smiling-friendly-female-trainee-ready-tackle-assignments-smiling-broadly-feeling-lucky-day-work-self-assured-encouraged-achieve-success-goal-white-wall_176420-35567.jpg",
|
||||
},
|
||||
id: "3", name: "Ken Chan", role: "Startup Founder", testimonial: "Saved me hours of work for just 10 HKD.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-good-looking-smiling-friendly-female-trainee-ready-tackle-assignments-smiling-broadly-feeling-lucky-day-work-self-assured-encouraged-achieve-success-goal-white-wall_176420-35567.jpg"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Joey Ng",
|
||||
role: "Student",
|
||||
testimonial: "Great value for money templates.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman-posing-near-office-building_1262-21023.jpg",
|
||||
},
|
||||
id: "4", name: "Joey Ng", role: "Student", testimonial: "Great value for money templates.", imageSrc: "http://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman-posing-near-office-building_1262-21023.jpg"},
|
||||
{
|
||||
id: "5",
|
||||
name: "Sam Tam",
|
||||
role: "Manager",
|
||||
testimonial: "Highly recommended for all presentations.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-sitting-couch_23-2148415817.jpg",
|
||||
},
|
||||
id: "5", name: "Sam Tam", role: "Manager", testimonial: "Highly recommended for all presentations.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-sitting-couch_23-2148415817.jpg"},
|
||||
]}
|
||||
title="Loved by Professionals"
|
||||
description="Hear from our happy clients across Hong Kong."
|
||||
@@ -259,20 +175,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "How to pay?",
|
||||
content: "Send 10 HKD to Alipay HK account 84025713.",
|
||||
},
|
||||
id: "1", title: "How to pay?", content: "Send 10 HKD to Alipay HK account 84025713."},
|
||||
{
|
||||
id: "2",
|
||||
title: "How to get file?",
|
||||
content: "Message us your payment screenshot on the contact form.",
|
||||
},
|
||||
id: "2", title: "How to get file?", content: "Message us your payment screenshot on the contact form."},
|
||||
{
|
||||
id: "3",
|
||||
title: "Any refund?",
|
||||
content: "Since these are digital, we do not offer refunds.",
|
||||
},
|
||||
id: "3", title: "Any refund?", content: "Since these are digital, we do not offer refunds."},
|
||||
]}
|
||||
title="Common Questions"
|
||||
description="Everything you need to know about purchasing."
|
||||
@@ -287,26 +194,21 @@ export default function LandingPage() {
|
||||
description="After sending 10 HKD to 84025713, enter your details here."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
},
|
||||
name: "name", type: "text", placeholder: "Your Name"},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Your Email",
|
||||
},
|
||||
name: "email", type: "email", placeholder: "Your Email"},
|
||||
{
|
||||
name: "order",
|
||||
type: "text",
|
||||
placeholder: "Product Name",
|
||||
},
|
||||
name: "order", type: "text", placeholder: "Product Name"},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Attach payment proof description",
|
||||
}}
|
||||
name: "message", placeholder: "Attach payment proof description"}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/modern-office-with-nobody-present_482257-122002.jpg"
|
||||
onSubmit={(data) => {
|
||||
console.log("Order submitted:", data);
|
||||
// Simulate delivery
|
||||
navigator.clipboard.writeText("https://example.com/download/template.pptx");
|
||||
handleDownload("/template.pptx", "template.pptx");
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -316,25 +218,17 @@ export default function LandingPage() {
|
||||
logoText="PPT Store"
|
||||
columns={[
|
||||
{
|
||||
title: "Shop",
|
||||
items: [
|
||||
title: "Shop", items: [
|
||||
{
|
||||
label: "Products",
|
||||
href: "#products",
|
||||
},
|
||||
label: "Products", href: "#products"},
|
||||
{
|
||||
label: "FAQs",
|
||||
href: "#faq",
|
||||
},
|
||||
label: "FAQs", href: "#faq"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Help",
|
||||
items: [
|
||||
title: "Help", items: [
|
||||
{
|
||||
label: "Contact Us",
|
||||
href: "#contact",
|
||||
},
|
||||
label: "Contact Us", href: "#contact"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
@@ -343,4 +237,4 @@ export default function LandingPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user