Merge version_1 into main #2
290
src/app/page.tsx
290
src/app/page.tsx
@@ -19,137 +19,60 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "#hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "#services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
{ name: "Home", id: "#hero" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Services", id: "#services" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="Creative Studio"
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Creative Solutions for a Global Audience"
|
||||
description="Professional video editing, design, and translation services. I bridge the gap between ideas and impact through high-quality visual and written content."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Sarah Miller",
|
||||
handle: "@smiller",
|
||||
testimonial: "Exceptional video editing and design work. Highly professional.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/chicken-quail-eggs-feathers-bowl-near-quills-old-can_23-2148073856.jpg?_wi=1",
|
||||
imageAlt: "minimalist abstract dark background",
|
||||
},
|
||||
{
|
||||
name: "Thomas Weber",
|
||||
handle: "@tweber",
|
||||
testimonial: "Perfect translation and language support. Exceeded expectations.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-video-editor-works-editing-film-footage-home-setup_482257-126399.jpg?_wi=1",
|
||||
imageAlt: "minimalist abstract dark background",
|
||||
},
|
||||
{
|
||||
name: "Marko Ilic",
|
||||
handle: "@milic",
|
||||
testimonial: "Reliable and precise translation for my business documents.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-office_23-2151345460.jpg?_wi=1",
|
||||
imageAlt: "minimalist abstract dark background",
|
||||
},
|
||||
{
|
||||
name: "Elena Kovac",
|
||||
handle: "@ekovac",
|
||||
testimonial: "Brilliant design vision and very quick turnaround times.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-with-beard-holding-many-flags-making-unimportant-gesture_1368-7848.jpg?_wi=1",
|
||||
imageAlt: "minimalist abstract dark background",
|
||||
},
|
||||
{
|
||||
name: "David Stein",
|
||||
handle: "@dstein",
|
||||
testimonial: "My go-to expert for English and German creative content.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-businesswoman-suit-cross-arms-chest-looking-like-real-professional-smili_1258-122403.jpg?_wi=1",
|
||||
imageAlt: "minimalist abstract dark background",
|
||||
},
|
||||
{ name: "Sarah Miller", handle: "@smiller", testimonial: "Exceptional video editing and design work. Highly professional.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/chicken-quail-eggs-feathers-bowl-near-quills-old-can_23-2148073856.jpg", imageAlt: "minimalist abstract dark background" },
|
||||
{ name: "Thomas Weber", handle: "@tweber", testimonial: "Perfect translation and language support. Exceeded expectations.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-man-video-editor-works-editing-film-footage-home-setup_482257-126399.jpg", imageAlt: "minimalist abstract dark background" },
|
||||
{ name: "Marko Ilic", handle: "@milic", testimonial: "Reliable and precise translation for my business documents.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-office_23-2151345460.jpg", imageAlt: "minimalist abstract dark background" },
|
||||
{ name: "Elena Kovac", handle: "@ekovac", testimonial: "Brilliant design vision and very quick turnaround times.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-with-beard-holding-many-flags-making-unimportant-gesture_1368-7848.jpg", imageAlt: "minimalist abstract dark background" },
|
||||
{ name: "David Stein", handle: "@dstein", testimonial: "My go-to expert for English and German creative content.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-businesswoman-suit-cross-arms-chest-looking-like-real-professional-smili_1258-122403.jpg", imageAlt: "minimalist abstract dark background" },
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "View Portfolio",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
text: "Contact Me",
|
||||
href: "#contact",
|
||||
},
|
||||
{ text: "View Portfolio", href: "#services" },
|
||||
{ text: "Contact Me", href: "#contact" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/chicken-quail-eggs-feathers-bowl-near-quills-old-can_23-2148073856.jpg?_wi=2"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/chicken-quail-eggs-feathers-bowl-near-quills-old-can_23-2148073856.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/pretty-attractive-young-mixed-race-model-with-large-afro-wearing-navy-jacket-her-naked-body-shorts_633478-1216.jpg",
|
||||
alt: "Portrait of professional client 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-male-holding-hands-pockets-white-shirt-jacket-looking-elegant-front-view_176474-99655.jpg",
|
||||
alt: "Portrait of professional client 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiling-camera-with-crossed-arms-happy-confident-satisfied-expression-lateral-view_1194-633413.jpg",
|
||||
alt: "Portrait of professional client 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman_1262-20882.jpg",
|
||||
alt: "Portrait of professional client 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg",
|
||||
alt: "Portrait of professional client 5",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/pretty-attractive-young-mixed-race-model-with-large-afro-wearing-navy-jacket-her-naked-body-shorts_633478-1216.jpg", alt: "Portrait of professional client 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-male-holding-hands-pockets-white-shirt-jacket-looking-elegant-front-view_176474-99655.jpg", alt: "Portrait of professional client 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/smiling-camera-with-crossed-arms-happy-confident-satisfied-expression-lateral-view_1194-633413.jpg", alt: "Portrait of professional client 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman_1262-20882.jpg", alt: "Portrait of professional client 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg", alt: "Portrait of professional client 5" },
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "High-Quality Production",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Brand Identity Design",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Multilingual Translation",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Fast Turnaround",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Creative Storytelling",
|
||||
},
|
||||
{ type: "text", text: "High-Quality Production" },
|
||||
{ type: "text", text: "Brand Identity Design" },
|
||||
{ type: "text", text: "Multilingual Translation" },
|
||||
{ type: "text", text: "Fast Turnaround" },
|
||||
{ type: "text", text: "Creative Storytelling" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -159,21 +82,9 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
title="My Expertise"
|
||||
metrics={[
|
||||
{
|
||||
icon: Film,
|
||||
label: "Videos Edited",
|
||||
value: "150+",
|
||||
},
|
||||
{
|
||||
icon: Palette,
|
||||
label: "Design Projects",
|
||||
value: "80+",
|
||||
},
|
||||
{
|
||||
icon: Globe,
|
||||
label: "Words Translated",
|
||||
value: "200k+",
|
||||
},
|
||||
{ icon: Film, label: "Videos Edited", value: "150+" },
|
||||
{ icon: Palette, label: "Design Projects", value: "80+" },
|
||||
{ icon: Globe, label: "Words Translated", value: "200k+" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -184,27 +95,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
tag: "Visual",
|
||||
title: "Video Editing",
|
||||
subtitle: "Storytelling through movement",
|
||||
description: "Dynamic editing, motion graphics, and color grading for YouTube, marketing, and film.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-video-editor-works-editing-film-footage-home-setup_482257-126399.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
tag: "Creative",
|
||||
title: "Design",
|
||||
subtitle: "Visual identity and assets",
|
||||
description: "Clean, classy design work for branding, social media, and presentations.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-office_23-2151345460.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
tag: "Linguistic",
|
||||
title: "Translation",
|
||||
subtitle: "English, German, Serbian",
|
||||
description: "Accurate, culturally nuanced translations ensuring your message remains authentic in every language.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-with-beard-holding-many-flags-making-unimportant-gesture_1368-7848.jpg?_wi=2",
|
||||
},
|
||||
{ tag: "Visual", title: "Video Editing", subtitle: "Storytelling through movement", description: "Dynamic editing, motion graphics, and color grading for YouTube, marketing, and film.", imageSrc: "http://img.b2bpic.net/free-photo/young-man-video-editor-works-editing-film-footage-home-setup_482257-126399.jpg" },
|
||||
{ tag: "Creative", title: "Design", subtitle: "Visual identity and assets", description: "Clean, classy design work for branding, social media, and presentations.", imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-office_23-2151345460.jpg" },
|
||||
{ tag: "Linguistic", title: "Translation", subtitle: "English, German, Serbian", description: "Accurate, culturally nuanced translations ensuring your message remains authentic in every language.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-with-beard-holding-many-flags-making-unimportant-gesture_1368-7848.jpg" },
|
||||
]}
|
||||
title="My Core Services"
|
||||
description="I offer end-to-end creative solutions to help you communicate effectively."
|
||||
@@ -218,42 +111,12 @@ export default function LandingPage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Corporate Promo Video",
|
||||
price: "Featured Work",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/focused-editor-woman-works-video-montage-creative-software_482257-120176.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Brand Identity Redesign",
|
||||
price: "Design",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylus-graphic-digital-tablet-with-stationery-pink-background_23-2147880570.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Marketing Strategy Document",
|
||||
price: "Translation",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-lady-holding-world-globe_114579-58660.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Social Media Ad Edit",
|
||||
price: "Video",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-filmmaker-woman-working-video-post-production_482257-119351.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "UI/UX Design Mockup",
|
||||
price: "Design",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pastel-crayons-high-quality-photo_72229-824.jpg",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
name: "Technical Manual Translation",
|
||||
price: "Translation",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/world-braille-day-arrangement_23-2148718125.jpg",
|
||||
},
|
||||
{ id: "1", name: "Corporate Promo Video", price: "Featured Work", imageSrc: "http://img.b2bpic.net/free-photo/focused-editor-woman-works-video-montage-creative-software_482257-120176.jpg" },
|
||||
{ id: "2", name: "Brand Identity Redesign", price: "Design", imageSrc: "http://img.b2bpic.net/free-photo/stylus-graphic-digital-tablet-with-stationery-pink-background_23-2147880570.jpg" },
|
||||
{ id: "3", name: "Marketing Strategy Document", price: "Translation", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-lady-holding-world-globe_114579-58660.jpg" },
|
||||
{ id: "4", name: "Social Media Ad Edit", price: "Video", imageSrc: "http://img.b2bpic.net/free-photo/young-filmmaker-woman-working-video-post-production_482257-119351.jpg" },
|
||||
{ id: "5", name: "UI/UX Design Mockup", price: "Design", imageSrc: "http://img.b2bpic.net/free-photo/pastel-crayons-high-quality-photo_72229-824.jpg" },
|
||||
{ id: "6", name: "Technical Manual Translation", price: "Translation", imageSrc: "http://img.b2bpic.net/free-photo/world-braille-day-arrangement_23-2148718125.jpg" },
|
||||
]}
|
||||
title="Selected Works"
|
||||
description="A collection of recent projects across design and video editing domains."
|
||||
@@ -266,46 +129,11 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alex R.",
|
||||
handle: "@alexr",
|
||||
testimonial: "Incredible designer and editor. Always delivers.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-businesswoman-suit-cross-arms-chest-looking-like-real-professional-smili_1258-122403.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Julia M.",
|
||||
handle: "@juliam",
|
||||
testimonial: "Very professional approach, excellent translation skills.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-woman-black-jacket-happy-short-haired-girl-dark-suit-widely-sincerely-smiles-isolated-background_197531-18508.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Hans S.",
|
||||
handle: "@hanss",
|
||||
testimonial: "My preferred partner for German localization tasks.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-hispanic-woman-wearing-business-jacket-looking-confident-camera-smiling-with-crossed-arms-hand-raised-chin-thinking-positive_839833-8974.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Luka B.",
|
||||
handle: "@lukab",
|
||||
testimonial: "Understands the Serbian market and design needs perfectly.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/confident-beautiful-young-businesswoman-looking-camera-head-shot-portrait_1163-4928.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Chris D.",
|
||||
handle: "@chrisd",
|
||||
testimonial: "Highly recommended for all your creative service needs.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-logo-designer-working-her-office_23-2149119230.jpg",
|
||||
},
|
||||
{ id: "1", name: "Alex R.", handle: "@alexr", testimonial: "Incredible designer and editor. Always delivers.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-businesswoman-suit-cross-arms-chest-looking-like-real-professional-smili_1258-122403.jpg" },
|
||||
{ id: "2", name: "Julia M.", handle: "@juliam", testimonial: "Very professional approach, excellent translation skills.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-woman-black-jacket-happy-short-haired-girl-dark-suit-widely-sincerely-smiles-isolated-background_197531-18508.jpg" },
|
||||
{ id: "3", name: "Hans S.", handle: "@hanss", testimonial: "My preferred partner for German localization tasks.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beautiful-hispanic-woman-wearing-business-jacket-looking-confident-camera-smiling-with-crossed-arms-hand-raised-chin-thinking-positive_839833-8974.jpg" },
|
||||
{ id: "4", name: "Luka B.", handle: "@lukab", testimonial: "Understands the Serbian market and design needs perfectly.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/confident-beautiful-young-businesswoman-looking-camera-head-shot-portrait_1163-4928.jpg" },
|
||||
{ id: "5", name: "Chris D.", handle: "@chrisd", testimonial: "Highly recommended for all your creative service needs.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/female-logo-designer-working-her-office_23-2149119230.jpg" },
|
||||
]}
|
||||
showRating={true}
|
||||
title="Client Feedback"
|
||||
@@ -317,21 +145,9 @@ export default function LandingPage() {
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "What is your typical turnaround time?",
|
||||
content: "Depending on project complexity, video projects usually take 3-7 days, while translation projects can be expedited.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Do you accept rush jobs?",
|
||||
content: "Yes, I offer rush services for an additional fee depending on the project type.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "What file formats do you work with?",
|
||||
content: "I support all standard industry video, design, and document formats.",
|
||||
},
|
||||
{ id: "1", title: "What is your typical turnaround time?", content: "Depending on project complexity, video projects usually take 3-7 days, while translation projects can be expedited." },
|
||||
{ id: "2", title: "Do you accept rush jobs?", content: "Yes, I offer rush services for an additional fee depending on the project type." },
|
||||
{ id: "3", title: "What file formats do you work with?", content: "I support all standard industry video, design, and document formats." },
|
||||
]}
|
||||
sideTitle="Frequently Asked Questions"
|
||||
sideDescription="Common questions regarding my workflows, rates, and availability."
|
||||
@@ -342,9 +158,7 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
tag="Let's connect"
|
||||
title="Ready to get started?"
|
||||
description="Send me a message to discuss your upcoming project requirements."
|
||||
|
||||
Reference in New Issue
Block a user