Merge version_1 into main
Merge version_1 into main
This commit was merged in pull request #1.
This commit is contained in:
530
src/app/page.tsx
530
src/app/page.tsx
@@ -1,280 +1,276 @@
|
|||||||
"use client"
|
"use client";
|
||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import React, { useState, useEffect, useRef } from 'react';
|
||||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
import { ChevronRight, ArrowRight, Star, Users, Zap, Shield, Globe, Sparkles } from 'lucide-react';
|
||||||
import HeroBillboard from "@/components/sections/hero/HeroBillboard";
|
|
||||||
import SplitAbout from "@/components/sections/about/SplitAbout";
|
const LandingPage = () => {
|
||||||
import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
|
const [activeTab, setActiveTab] = useState(0);
|
||||||
import TestimonialCardTwo from "@/components/sections/testimonial/TestimonialCardTwo";
|
const [isVisible, setIsVisible] = useState(false);
|
||||||
import ProductCardOne from "@/components/sections/product/ProductCardOne";
|
const heroRef = useRef(null);
|
||||||
import FeatureCardTwelve from "@/components/sections/feature/FeatureCardTwelve";
|
|
||||||
import PricingCardTwo from "@/components/sections/pricing/PricingCardTwo";
|
useEffect(() => {
|
||||||
import FaqBase from "@/components/sections/faq/FaqBase";
|
const observer = new IntersectionObserver(
|
||||||
import ContactCenter from "@/components/sections/contact/ContactCenter";
|
([entry]) => {
|
||||||
import FooterBase from "@/components/sections/footer/FooterBase";
|
setIsVisible(entry.isIntersecting);
|
||||||
import { Zap, Target, Award, Users, Video, Edit3, Smartphone, TrendingUp, Star, Shield, CheckCircle, Play } from "lucide-react";
|
},
|
||||||
|
{ threshold: 0.1 }
|
||||||
|
);
|
||||||
|
|
||||||
|
if (heroRef.current) {
|
||||||
|
observer.observe(heroRef.current);
|
||||||
|
}
|
||||||
|
|
||||||
|
return () => observer.disconnect();
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
const features = [
|
||||||
|
{
|
||||||
|
icon: Zap,
|
||||||
|
title: "Lightning Fast", description: "Optimized for speed and performance"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Shield,
|
||||||
|
title: "Secure", description: "Enterprise-grade security built-in"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Globe,
|
||||||
|
title: "Global Scale", description: "Works anywhere, anytime"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Users,
|
||||||
|
title: "Team Collaboration", description: "Built for teams of all sizes"
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
const testimonials = [
|
||||||
|
{
|
||||||
|
name: "Sarah Johnson", role: "CEO, TechCorp", content: "This platform has transformed how we work. Incredible results!", avatar: "/images/avatar1.jpg"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "Mike Chen", role: "CTO, StartupXYZ", content: "The best investment we've made for our team's productivity.", avatar: "/images/avatar2.jpg"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "Emma Wilson", role: "Product Manager, InnovateCo", content: "Game-changing technology that delivers on its promises.", avatar: "/images/avatar3.jpg"
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
const stats = [
|
||||||
|
{ number: "10K+", label: "Active Users" },
|
||||||
|
{ number: "99.9%", label: "Uptime" },
|
||||||
|
{ number: "24/7", label: "Support" },
|
||||||
|
{ number: "50+", label: "Countries" }
|
||||||
|
];
|
||||||
|
|
||||||
export default function PeakCreationsPage() {
|
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<div className="min-h-screen bg-gradient-to-br from-slate-50 to-blue-50">
|
||||||
defaultButtonVariant="hover-magnetic"
|
{/* Navigation */}
|
||||||
defaultTextAnimation="entrance-slide"
|
<nav className="fixed top-0 w-full z-50 bg-white/80 backdrop-blur-md border-b border-gray-200">
|
||||||
borderRadius="soft"
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
contentWidth="medium"
|
<div className="flex justify-between items-center h-16">
|
||||||
sizing="large"
|
<div className="flex items-center space-x-2">
|
||||||
background="circleGradient"
|
<Sparkles className="h-8 w-8 text-blue-600" />
|
||||||
cardStyle="elevated"
|
<span className="text-xl font-bold text-gray-900">WebILD</span>
|
||||||
primaryButtonStyle="gradient"
|
</div>
|
||||||
secondaryButtonStyle="glass"
|
|
||||||
headingFontWeight="semibold"
|
<div className="hidden md:flex items-center space-x-8">
|
||||||
>
|
<a href="#features" className="text-gray-600 hover:text-blue-600 transition-colors">Features</a>
|
||||||
<div id="nav" data-section="nav">
|
<a href="#pricing" className="text-gray-600 hover:text-blue-600 transition-colors">Pricing</a>
|
||||||
<NavbarLayoutFloatingInline
|
<a href="#about" className="text-gray-600 hover:text-blue-600 transition-colors">About</a>
|
||||||
navItems={[
|
<a href="#contact" className="text-gray-600 hover:text-blue-600 transition-colors">Contact</a>
|
||||||
{ name: "Projektid", id: "projects" },
|
</div>
|
||||||
{ name: "Teenused", id: "services" },
|
|
||||||
{ name: "Hinnakiri", id: "pricing" },
|
|
||||||
{ name: "Küsimused", id: "faq" }
|
|
||||||
]}
|
|
||||||
brandName="Peak Creations"
|
|
||||||
button={{ text: "Broneeri kõne", href: "#contact" }}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="hero" data-section="hero">
|
<div className="flex items-center space-x-4">
|
||||||
<HeroBillboard
|
<button className="text-gray-600 hover:text-blue-600 transition-colors">Sign In</button>
|
||||||
title="Silmapaistvalt head lühivideod, mis tõstavad lati uutesse kõrgustesse"
|
<button className="bg-blue-600 text-white px-4 py-2 rounded-lg hover:bg-blue-700 transition-colors">
|
||||||
description="Ainulaadsed lahendused Eestis - maailmatasemel lühivideod, muljetavaldavad maketid ja sotsiaalmeedia bränding"
|
Get Started
|
||||||
background={{ variant: "sparkles-gradient" }}
|
</button>
|
||||||
tag="Uus! Esimene nädal on täiesti tasuta!"
|
</div>
|
||||||
tagIcon={Star}
|
</div>
|
||||||
buttons={[
|
</div>
|
||||||
{ text: "Broneeri kõne", href: "#contact" },
|
</nav>
|
||||||
{ text: "Vaata töid", href: "#projects" }
|
|
||||||
]}
|
|
||||||
imageSrc="https://peak-q6u8.vercel.app/images/logoimage.png"
|
|
||||||
imageAlt="Peak Creations videoproduktsioon"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="about" data-section="about">
|
{/* Hero Section */}
|
||||||
<SplitAbout
|
<section ref={heroRef} className="pt-24 pb-12 px-4 sm:px-6 lg:px-8">
|
||||||
title="Meie teenused"
|
<div className="max-w-7xl mx-auto">
|
||||||
description="Pakume täielikku lühivideo tootmist ja sotsiaalmeedia brändingut, mis aitab teie brändi silma paista."
|
<div className="text-center">
|
||||||
textboxLayout="default"
|
<div className={`transition-all duration-1000 ${isVisible ? 'opacity-100 translate-y-0' : 'opacity-0 translate-y-10'}`}>
|
||||||
useInvertedBackground="invertDefault"
|
<h1 className="text-4xl md:text-6xl font-bold text-gray-900 mb-6">
|
||||||
bulletPoints={[
|
Build Amazing
|
||||||
{
|
<span className="text-blue-600 block">Digital Experiences</span>
|
||||||
title: "Lühivideod", description: "Kaasaegsed ja atraktiivsed lühivideod kõikidele sotsiaalmeedia platvormidele", icon: Video
|
</h1>
|
||||||
},
|
<p className="text-xl text-gray-600 mb-8 max-w-3xl mx-auto">
|
||||||
{
|
The most powerful platform for creating, managing, and scaling your digital products.
|
||||||
title: "Professionaalne montaazh", description: "Maailmatasemel monteermine ja kvaliteetsed animatsioonid", icon: Edit3
|
Join thousands of companies already using WebILD.
|
||||||
},
|
</p>
|
||||||
{
|
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
||||||
title: "Sotsiaalmeedia bränding", description: "Täielik sotsiaalmeedia haldus ja sisuplaanide loomine", icon: Smartphone
|
<button className="bg-blue-600 text-white px-8 py-3 rounded-lg text-lg font-semibold hover:bg-blue-700 transition-all duration-300 transform hover:scale-105 flex items-center justify-center space-x-2">
|
||||||
}
|
<span>Start Free Trial</span>
|
||||||
]}
|
<ArrowRight className="h-5 w-5" />
|
||||||
imageSrc="https://peak-q6u8.vercel.app/shapes/graphic.png"
|
</button>
|
||||||
imageAlt="Peak Creations teenused"
|
<button className="border-2 border-gray-300 text-gray-700 px-8 py-3 rounded-lg text-lg font-semibold hover:border-blue-600 hover:text-blue-600 transition-all duration-300">
|
||||||
imagePosition="right"
|
Watch Demo
|
||||||
/>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div id="features" data-section="features">
|
{/* Stats Section */}
|
||||||
<FeatureCardOne
|
<section className="py-16 bg-white">
|
||||||
title="Miks valida lühivideod?"
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
description="Lühivideod on tõhus viis vaatajate tähelepanu püüdmiseks ja sõnumi kiireks edastamiseks."
|
<div className="grid grid-cols-2 md:grid-cols-4 gap-8">
|
||||||
textboxLayout="default"
|
{stats.map((stat, index) => (
|
||||||
gridVariant="uniform-all-items-equal"
|
<div key={index} className="text-center">
|
||||||
animationType="slide-up"
|
<div className="text-3xl md:text-4xl font-bold text-blue-600 mb-2">{stat.number}</div>
|
||||||
useInvertedBackground="noInvert"
|
<div className="text-gray-600">{stat.label}</div>
|
||||||
features={[
|
</div>
|
||||||
{
|
))}
|
||||||
title: "Kiire mõju ja tähelepanu", description: "Lühivideod püüavad vaatajate tähelepanu kiiremini kui pikemad videod. 60% tarbijatest eelistab brändide lühivideoid.", imageSrc: "https://peak-q6u8.vercel.app/shapes/lightning.png", imageAlt: "Kiire mõju"
|
</div>
|
||||||
},
|
</div>
|
||||||
{
|
</section>
|
||||||
title: "Efektiivne investeering", description: "Lühivideod on kiiremad ja odavamad toota, pakkudes samal ajal kõrgemat ROI-d ja laiemat vaatajaskondi.", imageSrc: "https://peak-q6u8.vercel.app/shapes/coins2.png", imageAlt: "Efektiivne investeering"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Brändi teadlikkuse tõstmine", description: "Kiire ja tõhus viis uute vaatajateni jõudmiseks, luues emotsionaalseid sidemeid ja tõstes brändi tuntust.", imageSrc: "https://peak-q6u8.vercel.app/shapes/target2.png", imageAlt: "Brändi teadlikkus"
|
|
||||||
}
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="testimonials" data-section="testimonials">
|
{/* Features Section */}
|
||||||
<TestimonialCardTwo
|
<section id="features" className="py-20 bg-gray-50">
|
||||||
title="Mida meie kliendid arvavad"
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
description="Kuulake, mida meie rahulolev kliendid meie töö kohta arvavad."
|
<div className="text-center mb-16">
|
||||||
textboxLayout="default"
|
<h2 className="text-3xl md:text-4xl font-bold text-gray-900 mb-4">
|
||||||
animationType="slide-up"
|
Powerful Features for Modern Teams
|
||||||
useInvertedBackground="invertDefault"
|
</h2>
|
||||||
testimonials={[
|
<p className="text-xl text-gray-600 max-w-3xl mx-auto">
|
||||||
{
|
Everything you need to build, deploy, and scale your applications with confidence.
|
||||||
id: "1", name: "Moritz Thomas", role: "Siemenste", testimonial: "Peak tegi meie uue videode puhul erakordset tööd. Alates algusest lõpuni ületasid nad kõik ootused.", icon: Star
|
</p>
|
||||||
},
|
</div>
|
||||||
{
|
|
||||||
id: "2", name: "Matthew Tent", role: "UCLA", testimonial: "Olen väga rahul saadud tulemusega! Kommunikatsioon oli suurepärane ja protsess kiire.", icon: Award
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "3", name: "Vishal Air", role: "Sente AI", testimonial: "Väga rahul tulemusega! Soovitan animatsioonidega loovate lühivideote jaoks.", icon: CheckCircle
|
|
||||||
}
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="projects" data-section="projects">
|
<div className="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
|
||||||
<ProductCardOne
|
{features.map((feature, index) => {
|
||||||
title="Tehtud tööd"
|
const IconComponent = feature.icon;
|
||||||
description="Kollektsioon meie esiletõstetud lühivideodest ja projektidest."
|
return (
|
||||||
textboxLayout="default"
|
<div key={index} className="bg-white p-6 rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 transform hover:-translate-y-2">
|
||||||
gridVariant="uniform-all-items-equal"
|
<div className="bg-blue-100 w-12 h-12 rounded-lg flex items-center justify-center mb-4">
|
||||||
animationType="slide-up"
|
<IconComponent className="h-6 w-6 text-blue-600" />
|
||||||
useInvertedBackground="noInvert"
|
</div>
|
||||||
products={[
|
<h3 className="text-xl font-semibold text-gray-900 mb-2">{feature.title}</h3>
|
||||||
{
|
<p className="text-gray-600">{feature.description}</p>
|
||||||
id: "1", name: "Podcast montaazh", price: "Vaata", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Podcast montaazh näide"
|
</div>
|
||||||
},
|
);
|
||||||
{
|
})}
|
||||||
id: "2", name: "Marketing video", price: "Vaata", imageSrc: "/placeholders/placeholder2.webp", imageAlt: "Marketing video näide"
|
</div>
|
||||||
},
|
</div>
|
||||||
{
|
</section>
|
||||||
id: "3", name: "Sotsiaalmeedia sisu", price: "Vaata", imageSrc: "/placeholders/placeholder3.webp", imageAlt: "Sotsiaalmeedia sisu näide"
|
|
||||||
}
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="services" data-section="services">
|
{/* Testimonials Section */}
|
||||||
<FeatureCardTwelve
|
<section className="py-20 bg-blue-600">
|
||||||
title="Meie teenused"
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
description="Valige endale sobiv teenuste pakett meie pakkumiste seast."
|
<div className="text-center mb-16">
|
||||||
textboxLayout="default"
|
<h2 className="text-3xl md:text-4xl font-bold text-white mb-4">
|
||||||
animationType="slide-up"
|
What Our Customers Say
|
||||||
useInvertedBackground="invertDefault"
|
</h2>
|
||||||
features={[
|
<p className="text-xl text-blue-100 max-w-3xl mx-auto">
|
||||||
{
|
Don't just take our word for it. Here's what industry leaders have to say about WebILD.
|
||||||
id: "luhivideod", label: "Lühivideod", title: "Professionaalsed lühivideod kõikidele platvormidele", items: [
|
</p>
|
||||||
"TikTok, Instagram, Facebook optimeeritud", "Montaazh ja heliefektid", "Subtiitrid ja animatsioonid", "Kiire täitmisaeg"
|
</div>
|
||||||
],
|
|
||||||
buttons: [
|
|
||||||
{ text: "Saa pakkumine", href: "#contact" }
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "branding", label: "Bränding", title: "Täielik sotsiaalmeedia bränding ja haldus", items: [
|
|
||||||
"Sisuplaan ja ideede genereerimine", "Postitamine ja jälgijatega suhtlemine", "Igakuine raport ja analüüs", "Professionaalne visuaalse identiteedi loomine"
|
|
||||||
],
|
|
||||||
buttons: [
|
|
||||||
{ text: "Broneeri kõne", href: "#contact" }
|
|
||||||
]
|
|
||||||
}
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="pricing" data-section="pricing">
|
<div className="grid md:grid-cols-3 gap-8">
|
||||||
<PricingCardTwo
|
{testimonials.map((testimonial, index) => (
|
||||||
title="Hinnakiri"
|
<div key={index} className="bg-white p-6 rounded-xl shadow-lg">
|
||||||
description: "Valige endale sobiv pakett. Esimene nädal on täiesti tasuta!"
|
<div className="flex items-center mb-4">
|
||||||
textboxLayout="default"
|
{[...Array(5)].map((_, i) => (
|
||||||
animationType="slide-up"
|
<Star key={i} className="h-5 w-5 text-yellow-400 fill-current" />
|
||||||
useInvertedBackground="noInvert"
|
))}
|
||||||
plans={[
|
</div>
|
||||||
{
|
<p className="text-gray-700 mb-6 italic">"{testimonial.content}"</p>
|
||||||
id: "luhivideomeister", badge: "Populaarne", badgeIcon: Star,
|
<div className="flex items-center">
|
||||||
price: "2999€/kuu", subtitle: "Ideaalne valik uudisteportaalidele, podcastidele ja YouTuberitele", buttons: [
|
<img
|
||||||
{ text: "Alusta kohe", href: "#contact" },
|
src={testimonial.avatar}
|
||||||
{ text: "Saa rohkem infot", href: "#faq" }
|
alt={testimonial.name}
|
||||||
],
|
className="w-12 h-12 rounded-full mr-4"
|
||||||
features: [
|
onError={(e) => {
|
||||||
"6-10x lühivideot, oleneb vajadusest", "Sisuplaan ja ideede genereerimine", "Monteerimine ja postitamine", "Sotsiaalmeedia bränding ja haldus", "Igakuine raport ja põhjalik analüüs"
|
e.currentTarget.src = '/images/default-avatar.png';
|
||||||
]
|
}}
|
||||||
},
|
/>
|
||||||
{
|
<div>
|
||||||
id: "custom", badge: "Paindlik", badgeIcon: Shield,
|
<div className="font-semibold text-gray-900">{testimonial.name}</div>
|
||||||
price: "Kokkuleppe järgi", subtitle: "Personaalne pakett teie vajadustele", buttons: [
|
<div className="text-gray-600 text-sm">{testimonial.role}</div>
|
||||||
{ text: "Broneeri kõne", href: "#contact" },
|
</div>
|
||||||
{ text: "Küsi pakkumist", href: "#contact" }
|
</div>
|
||||||
],
|
</div>
|
||||||
features: [
|
))}
|
||||||
"Personaalne lahendus", "Paindlik teenuste valik", "Individuaalne hinnapoliitika", "Primaarne klienditugi", "Kohandatud töövoog"
|
</div>
|
||||||
]
|
</div>
|
||||||
}
|
</section>
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="faq" data-section="faq">
|
{/* CTA Section */}
|
||||||
<FaqBase
|
<section className="py-20 bg-gradient-to-r from-blue-600 to-purple-600">
|
||||||
title="Korduma kippuvad küsimused"
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
||||||
description="Leiate vastused kõige tavalisematele küsimustele meie teenuste kohta."
|
<h2 className="text-3xl md:text-4xl font-bold text-white mb-4">
|
||||||
textboxLayout="default"
|
Ready to Get Started?
|
||||||
useInvertedBackground="invertDefault"
|
</h2>
|
||||||
faqs={[
|
<p className="text-xl text-blue-100 mb-8 max-w-2xl mx-auto">
|
||||||
{
|
Join thousands of companies that trust WebILD to power their digital transformation.
|
||||||
id: "1", title: "Kes me oleme?", content: "Oleme Peak Creations, kaks noort, kes loovad lühivideoid, tuues Eestisse rahvusvaheliselt tunnustatud montaažistiile. Spetsialiseerume TikToki turundusele, kasvatades jälgijaskondi ja kogudes tuhandeid meeldimisi."
|
</p>
|
||||||
},
|
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
||||||
{
|
<button className="bg-white text-blue-600 px-8 py-3 rounded-lg text-lg font-semibold hover:bg-gray-100 transition-all duration-300 transform hover:scale-105">
|
||||||
id: "2", title: "Kellele sobivad Peak Creationsi teenused?", content: "Meie teenused sobivad ideaalselt nii ettevõtetele (poed, restoranid, pangad jne) kui ka eraisikutele, nagu poliitikud, näitlejad, sportlased, kinnisvaramaaklerid ja teised."
|
Start Free Trial
|
||||||
},
|
</button>
|
||||||
{
|
<button className="border-2 border-white text-white px-8 py-3 rounded-lg text-lg font-semibold hover:bg-white hover:text-blue-600 transition-all duration-300">
|
||||||
id: "3", title: "Miks on lühivideod vajalikud minu brändi jaoks?", content: "Tänapäeva infoühiskonnas, kus inimeste tähelepanuvõime on lühike, on lühivideod (15 sekundit kuni minut) ideaalsed sõnumi kiireks edastamiseks ja vaatajate tähelepanu hoidmiseks. Need videod suudavad kiiresti luua emotsionaalse sideme vaatajaga."
|
Contact Sales
|
||||||
},
|
</button>
|
||||||
{
|
</div>
|
||||||
id: "4", title: "Milline on tööprotsess ja kui suur on minu ajakulu?", content: "Teie ajakulu on minimaalne. Tööprotsess algab videokõnega, kus tutvustame end ja oma teenuseid. Seejärel paneme koos paika plaani ja valime sobiva paketi. Edasine töö toimub meie poolt, nii et teie panus on väga väike."
|
</div>
|
||||||
},
|
</section>
|
||||||
{
|
|
||||||
id: "5", title: "Mida tähendab 'esimene nädal on täiesti tasuta'?", content: "Esimesel nädalal saad kõiki teenuseid tasuta proovida. Pärast seda saad valida endale sobiva paketi."
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "6", title: "Mis platvormidele postitate videod?", content: "Loome sisu kõigile teie soovitud sotsiaalmeedia platvormidele, olgu selleks TikTok, Instagram, Facebook, YouTube, LinkedIn või Twitter."
|
|
||||||
}
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="contact" data-section="contact">
|
{/* Footer */}
|
||||||
<ContactCenter
|
<footer className="bg-gray-900 py-12">
|
||||||
tag="Broneeri kõne"
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||||
tagIcon={Play}
|
<div className="grid md:grid-cols-4 gap-8">
|
||||||
title="Alustame koostööd"
|
<div>
|
||||||
description="Videokõne, kus tutvustame end ja oma teenuseid. Ei leidnud sobivat? Ära muretse, loome Teile personaalse paketi."
|
<div className="flex items-center space-x-2 mb-4">
|
||||||
useInvertedBackground="noInvert"
|
<Sparkles className="h-8 w-8 text-blue-400" />
|
||||||
inputPlaceholder="Sisesta oma e-mail"
|
<span className="text-xl font-bold text-white">WebILD</span>
|
||||||
buttonText="Broneeri kõne"
|
</div>
|
||||||
termsText="Klikkides 'Broneeri kõne' nõustute meie tingimuste ja privaatsuspoliitikaga."
|
<p className="text-gray-400">
|
||||||
/>
|
Building the future of digital experiences, one component at a time.
|
||||||
</div>
|
</p>
|
||||||
|
</div>
|
||||||
<div id="footer" data-section="footer">
|
|
||||||
<FooterBase
|
<div>
|
||||||
logoText="Peak Creations"
|
<h3 className="text-white font-semibold mb-4">Product</h3>
|
||||||
copyrightText="© 2025 | Peak Creations"
|
<ul className="space-y-2">
|
||||||
columns={[
|
<li><a href="#" className="text-gray-400 hover:text-white transition-colors">Features</a></li>
|
||||||
{
|
<li><a href="#" className="text-gray-400 hover:text-white transition-colors">Pricing</a></li>
|
||||||
title: "Teenused", items: [
|
<li><a href="#" className="text-gray-400 hover:text-white transition-colors">Documentation</a></li>
|
||||||
{ label: "Lühivideod", href: "#services" },
|
</ul>
|
||||||
{ label: "Montaazh", href: "#services" },
|
</div>
|
||||||
{ label: "Bränding", href: "#services" }
|
|
||||||
]
|
<div>
|
||||||
},
|
<h3 className="text-white font-semibold mb-4">Company</h3>
|
||||||
{
|
<ul className="space-y-2">
|
||||||
title: "Ettevõte", items: [
|
<li><a href="#" className="text-gray-400 hover:text-white transition-colors">About</a></li>
|
||||||
{ label: "Meist", href: "#about" },
|
<li><a href="#" className="text-gray-400 hover:text-white transition-colors">Blog</a></li>
|
||||||
{ label: "Projektid", href: "#projects" },
|
<li><a href="#" className="text-gray-400 hover:text-white transition-colors">Careers</a></li>
|
||||||
{ label: "Kontakt", href: "#contact" }
|
</ul>
|
||||||
]
|
</div>
|
||||||
},
|
|
||||||
{
|
<div>
|
||||||
title: "Tugi", items: [
|
<h3 className="text-white font-semibold mb-4">Support</h3>
|
||||||
{ label: "KKK", href: "#faq" },
|
<ul className="space-y-2">
|
||||||
{ label: "Hinnakiri", href: "#pricing" }
|
<li><a href="#" className="text-gray-400 hover:text-white transition-colors">Help Center</a></li>
|
||||||
]
|
<li><a href="#" className="text-gray-400 hover:text-white transition-colors">Contact</a></li>
|
||||||
}
|
<li><a href="#" className="text-gray-400 hover:text-white transition-colors">Status</a></li>
|
||||||
]}
|
</ul>
|
||||||
/>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</ThemeProvider>
|
|
||||||
|
<div className="border-t border-gray-800 mt-8 pt-8 text-center">
|
||||||
|
<p className="text-gray-400">
|
||||||
|
© 2024 WebILD. All rights reserved.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
};
|
||||||
|
|
||||||
|
export default LandingPage;
|
||||||
Reference in New Issue
Block a user