bender/b7802a5b-46bf-4a54-b6cc-92237b0aa2e1
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-06-05 19:38:37 +00:00
parent 93ceb7510b
commit bc576ec09e
1 changed files with 174 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

318
src/app/page.tsx
View File

@@ -11,7 +11,7 @@ import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
import TeamCardFive from "@/components/sections/team/TeamCardFive";
import FaqBase from "@/components/sections/faq/FaqBase";
import ContactCTA from "@/components/sections/contact/ContactCTA";
import FooterBase from "@/components/sections/footer/FooterBase";
import FooterMedia from "@/components/sections/footer/FooterMedia";
import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
import { Sparkles, ArrowUpRight, Monitor, Shield, Zap, Puzzle, TrendingUp, Lock, Phone, MessageCircle, BookOpen, Tv, Camera, Music, Settings, Award, Users, Globe, LayoutGrid, Palette, Handshake } from "lucide-react";
@@ -34,9 +34,10 @@ export default function WebAgency2Page() {
brandName="SyninUs"
navItems={[
{ name: "Home", id: "#" },
{ name: "About", id: "#team" },
{ name: "Our Team", id: "#team" },
{ name: "Services", id: "#services" },
{ name: "Features", id: "#comparison-features" },
{ name: "Our Work", id: "#work" },
{ name: "Why Us", id: "#comparison-features" },
{ name: "FAQ", id: "#faq" },
{ name: "Contact", id: "#contact" }
]}
@@ -47,89 +48,98 @@ export default function WebAgency2Page() {
description="SyninUs crafts responsive websites, compelling graphic designs, and strategic business solutions that propel your brand forward."
tag="SyninUs: Innovation Meets Excellence"
tagIcon={Sparkles}
tagAnimation="slide-up"
tagAnimation="none"
background={{ variant: "canvas-reveal" }}
buttons={[
{ text: "Start Your Project", href: "#contact" },
{ text: "Explore Services", href: "#services" },
{ text: "Explore Services", href: "#services" }
]}
buttonAnimation="slide-up"
buttonAnimation="none"
carouselPosition="right"
leftCarouselItems={[
{ imageSrc: "http://img.b2bpic.net/free-photo/high-angle-man-working-with-tablet_23-2149930989.jpg", imageAlt: "Responsive website design on laptop" },
{ imageSrc: "http://img.b2bpic.net/free-photo/high-angle-measuring-tools-still-life_23-2150440941.jpg", imageAlt: "Brand identity logo design" },
{ imageSrc: "http://img.b2bpic.net/free-photo/expert-engineer-designs-complex-circuit-board-connections-generated-by-ai_188544-24553.jpg", imageAlt: "Business strategy meeting" },
{ imageSrc: "http://img.b2bpic.net/free-photo/website-development-links-seo-webinar-cyberspace-concept_53876-120953.jpg", imageAlt: "Custom WordPress development" },
{ imageSrc: "http://img.b2bpic.net/free-photo/blank-open-folded-paper-brochure-template_9975-134356.jpg", imageAlt: "Creative graphic design portfolio" },
{ imageSrc: "http://img.b2bpic.net/free-photo/blank-open-folded-paper-brochure-template_9975-134356.jpg", imageAlt: "Creative graphic design portfolio" }
]}
rightCarouselItems={[
{ imageSrc: "http://img.b2bpic.net/free-photo/young-company-analyst-office-watching-business-presentation-pc_482257-118998.jpg", imageAlt: "Digital marketing strategy analytics" },
{ imageSrc: "http://img.b2bpic.net/free-photo/minimalist-workspace-with-laptop-mouse-coffee_23-2152003802.jpg", imageAlt: "Clean and modern website layout" },
{ imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-studio_23-2151320721.jpg", imageAlt: "Branding guidelines and color palette" },
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-using-mobile-phone_53876-167151.jpg", imageAlt: "Mobile responsive website view" },
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-using-mobile-phone_53876-167151.jpg", imageAlt: "Mobile responsive website view" }
]}
carouselItemClassName="!aspect-[4/5]"
/>
<FeatureBento
title="Our Core Digital Services"
description="Empowering your business with tailored solutions for a dominant online presence."
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
buttons={[{ text: "View All Services", href: "#services" }]}
buttonAnimation="slide-up"
features={[
{
title: "Responsive Website Development", description: "Crafting responsive, clean, and customized websites, including robust WordPress solutions.", bentoComponent: "media-stack", items: [
{ imageSrc: "http://img.b2bpic.net/free-photo/modern-office-desk-composition-with-technological-device_23-2147916743.jpg", imageAlt: "Responsive website on laptop and tablet" },
{ imageSrc: "http://img.b2bpic.net/free-photo/architect-with-wireless-headset-using-laptop-while-working-home-night-sitting-kitchen-industrial-female-engineer-studying-personal-computer-showing-cad-software_482257-14609.jpg", imageAlt: "Clean website design interface" },
{ imageSrc: "http://img.b2bpic.net/free-photo/crop-man-choosing-streaming-service-account_23-2147930580.jpg", imageAlt: "WordPress website backend and frontend" },
],
},
{
title: "Creative Graphics & Branding", description: "From captivating logos to comprehensive branding and more – visual excellence for your brand.", bentoComponent: "media-stack", items: [
{ imageSrc: "http://img.b2bpic.net/free-photo/pie-charts-wooden-cubes-arrangement_23-2148793809.jpg", imageAlt: "Modern logo design concept" },
{ imageSrc: "http://img.b2bpic.net/free-photo/clean-professional-corporate-identity-stationery-mockup_187299-47807.jpg", imageAlt: "Branding identity mockups" },
{ imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-studio_23-2151320699.jpg", imageAlt: "Creative design portfolio examples" },
],
},
{
title: "Strategic Business Consultancy", description: "Providing market analysis, competitive positioning, and digital transformation strategy to guide your growth.", bentoComponent: "reveal-icon", icon: Handshake,
},
]}
/>
<FeatureCardTwentySix
title="Showcasing Our Digital Craft"
description="Discover impactful projects in responsive web development and creative graphic design."
textboxLayout="default"
useInvertedBackground={false}
buttons={[{ text: "View All Work", href: "#work" }]}
buttonAnimation="slide-up"
cardClassName="!h-auto aspect-video"
features={[
{
title: "E-commerce Platform", description: "Custom responsive website for online retail", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hand-holding-card_23-2149241415.jpg", imageAlt: "Custom E-commerce Website", buttonIcon: ArrowUpRight,
buttonHref: "#"},
{
title: "Brand Identity for Startup", description: "Complete logo and branding package", imageSrc: "http://img.b2bpic.net/free-photo/3d-metallic-dollar-sign-symbol-neutral-gradient-background-finance-concepts_84443-91455.jpg", imageAlt: "Startup Brand Identity", buttonIcon: ArrowUpRight,
buttonHref: "#"},
{
title: "Corporate Website Redesign", description: "Modern, clean, and responsive corporate site", imageSrc: "http://img.b2bpic.net/free-photo/showroom-agent-organizing-test-drive-using-mockup-notebook_482257-123977.jpg", imageAlt: "Corporate Website Redesign", buttonIcon: ArrowUpRight,
buttonHref: "#"},
{
title: "Marketing Collateral Design", description: "Brochures, flyers, and digital ads", imageSrc: "http://img.b2bpic.net/free-psd/digital-marketing-brochure-template-design_23-2151921264.jpg", imageAlt: "Marketing Collateral Design", buttonIcon: ArrowUpRight,
buttonHref: "#"},
{
title: "WordPress Blog Development", description: "User-friendly and SEO-optimized blog", imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-office_23-2151345396.jpg", imageAlt: "WordPress Blog Development", buttonIcon: ArrowUpRight,
buttonHref: "#"},
]}
/>
<div id="services" data-section="services">
<FeatureBento
title="Our Core Digital Services"
description="Empowering your business with tailored solutions for a dominant online presence."
textboxLayout="default"
useInvertedBackground={false}
animationType="none"
buttons={[{ text: "View All Services", href: "#services" }]}
buttonAnimation="none"
features={[
{
title: "Responsive Website Development", description: "Crafting responsive, clean, and customized websites, including robust WordPress solutions.", bentoComponent: "media-stack", items: [
{ imageSrc: "http://img.b2bpic.net/free-photo/modern-office-desk-composition-with-technological-device_23-2147916743.jpg", imageAlt: "Responsive website on laptop and tablet" },
{ imageSrc: "http://img.b2bpic.net/free-photo/architect-with-wireless-headset-using-laptop-while-working-home-night-sitting-kitchen-industrial-female-engineer-studying-personal-computer-showing-cad-software_482257-14609.jpg", imageAlt: "Clean website design interface" },
{ imageSrc: "http://img.b2bpic.net/free-photo/crop-man-choosing-streaming-service-account_23-2147930580.jpg", imageAlt: "WordPress website backend and frontend" }
]
},
{
title: "Creative Graphics & Branding", description: "From captivating logos to comprehensive branding and more – visual excellence for your brand.", bentoComponent: "media-stack", items: [
{ imageSrc: "http://img.b2bpic.net/free-photo/pie-charts-wooden-cubes-arrangement_23-2148793809.jpg", imageAlt: "Modern logo design concept" },
{ imageSrc: "http://img.b2bpic.net/free-photo/clean-professional-corporate-identity-stationery-mockup_187299-47807.jpg", imageAlt: "Branding identity mockups" },
{ imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-studio_23-2151320699.jpg", imageAlt: "Creative design portfolio examples" }
]
},
{
title: "Strategic Business Consultancy", description: "Providing market analysis, competitive positioning, and digital transformation strategy to guide your growth.", bentoComponent: "reveal-icon", icon: Handshake
}
]}
/>
</div>
<div id="work" data-section="work">
<FeatureCardTwentySix
title="Showcasing Our Digital Craft"
description="Discover impactful projects in responsive web development and creative graphic design."
textboxLayout="default"
useInvertedBackground={false}
buttons={[{ text: "View All Work", href: "#work" }]}
buttonAnimation="none"
cardClassName="!h-auto aspect-video"
features={[
{
title: "E-commerce Platform", description: "Custom responsive website for online retail", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hand-holding-card_23-2149241415.jpg", imageAlt: "Custom E-commerce Website", buttonIcon: ArrowUpRight,
buttonHref: "#"
},
{
title: "Brand Identity for Startup", description: "Complete logo and branding package", imageSrc: "http://img.b2bpic.net/free-photo/3d-metallic-dollar-sign-symbol-neutral-gradient-background-finance-concepts_84443-91455.jpg", imageAlt: "Startup Brand Identity", buttonIcon: ArrowUpRight,
buttonHref: "#"
},
{
title: "Corporate Website Redesign", description: "Modern, clean, and responsive corporate site", imageSrc: "http://img.b2bpic.net/free-photo/showroom-agent-organizing-test-drive-using-mockup-notebook_482257-123977.jpg", imageAlt: "Corporate Website Redesign", buttonIcon: ArrowUpRight,
buttonHref: "#"
},
{
title: "Marketing Collateral Design", description: "Brochures, flyers, and digital ads", imageSrc: "http://img.b2bpic.net/free-psd/digital-marketing-brochure-template-design_23-2151921264.jpg", imageAlt: "Marketing Collateral Design", buttonIcon: ArrowUpRight,
buttonHref: "#"
},
{
title: "WordPress Blog Development", description: "User-friendly and SEO-optimized blog", imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-office_23-2151345396.jpg", imageAlt: "WordPress Blog Development", buttonIcon: ArrowUpRight,
buttonHref: "#"
}
]}
/>
</div>
<FeatureBento
title="Why Choose SyninUs?"
description="Experience the SyninUs advantage: where innovative solutions meet unwavering commitment to your success."
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
animationType="none"
features={[
{
title: "Seamless Multi-Device Experience", description: "Ensuring your website looks and performs flawlessly across all desktops, tablets, and mobile devices.", bentoComponent: "phone", statusIcon: Lock,
@@ -142,30 +152,32 @@ export default function WebAgency2Page() {
{ name: "Design", icon: Palette },
{ name: "Strategy", icon: TrendingUp },
{ name: "Settings", icon: Settings },
{ name: "Global", icon: Globe },
],
{ name: "Global", icon: Globe }
]
},
{
title: "Robust Security & Reliability", description: "Providing enterprise-grade security and 99.9% uptime for peace of mind.", bentoComponent: "reveal-icon", icon: Shield,
title: "Robust Security & Reliability", description: "Providing enterprise-grade security and 99.9% uptime for peace of mind.", bentoComponent: "reveal-icon", icon: Shield
},
{
title: "Efficient Project Delivery", description: "Streamlined processes for timely launch without compromising quality.", bentoComponent: "timeline", heading: "Project Launch", subheading: "Week 1", items: [
{ label: "Discovery & Planning", detail: "Day 1-3" },
{ label: "Design & Development", detail: "Day 4-10" },
{ label: "Testing & Deployment", detail: "Day 11-14" },
{ label: "Testing & Deployment", detail: "Day 11-14" }
],
completedLabel: "Live"},
completedLabel: "Live"
},
{
title: "Tailored Customization", description: "Delivering bespoke solutions perfectly aligned with your unique business needs and brand identity.", bentoComponent: "orbiting-icons", centerIcon: Puzzle,
items: [
{ icon: Shield },
{ icon: Monitor },
{ icon: Zap },
{ icon: TrendingUp },
],
{ icon: TrendingUp }
]
},
{
title: "Strategic Growth Partnership", description: "More than just a service provider, we're your partner in achieving sustainable digital growth.", bentoComponent: "line-chart"},
title: "Strategic Growth Partnership", description: "More than just a service provider, we're your partner in achieving sustainable digital growth.", bentoComponent: "line-chart"
}
]}
/>
<TestimonialCardFifteen
@@ -173,10 +185,10 @@ export default function WebAgency2Page() {
rating={5}
author="— A Satisfied Client, Business Owner"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/portrait-african-businesswoman-manage-meeting_329181-20101.jpg", alt: "Client Avatar" },
{ src: "http://img.b2bpic.net/free-photo/portrait-african-businesswoman-manage-meeting_329181-20101.jpg", alt: "Client Avatar" }
]}
ratingAnimation="slide-up"
avatarsAnimation="slide-up"
ratingAnimation="none"
avatarsAnimation="none"
useInvertedBackground={false}
/>
<MetricCardOne
@@ -185,92 +197,110 @@ export default function WebAgency2Page() {
textboxLayout="default"
useInvertedBackground={false}
gridVariant="uniform-all-items-equal"
animationType="slide-up"
animationType="none"
metrics={[
{ id: "projects", value: "100+", title: "Projects", description: "Successfully delivered creative and strategic projects.", icon: Award },
{ id: "satisfaction", value: "99%", title: "Satisfaction", description: "Client satisfaction rate – our commitment to your success.", icon: Users },
{ id: "years", value: "8+", title: "Years", description: "Of empowering businesses with innovative digital solutions.", icon: TrendingUp },
{ id: "years", value: "8+", title: "Years", description: "Of empowering businesses with innovative digital solutions.", icon: TrendingUp }
]}
/>
<FeatureCardSixteen
title="SyninUs vs. The Rest: The Clear Advantage"
description="Discover why partnering with SyninUs leads to superior digital outcomes compared to other agencies."
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
negativeCard={{
items: [
"Generic templates with no personality", "Slow load times and poor performance", "Lack of true customization and flexibility", "Outdated design that hurts credibility", "No dedicated post-launch support"],
}}
positiveCard={{
items: [
"Custom designs tailored to your unique brand", "Lightning-fast performance on all devices", "Bespoke solutions perfectly matching your vision", "Modern design that builds trust and engagement", "Dedicated support and ongoing maintenance"],
}}
/>
<TeamCardFive
title="Meet the Minds Behind SyninUs"
description="Our dedicated team of experts is passionate about bringing your vision to life with innovation and precision."
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
mediaClassName="object-[65%_center]"
team={[
{ id: "1", name: "Sarah Miller", role: "Lead Web Developer", imageSrc: "http://img.b2bpic.net/free-photo/startup-programmer-testing-debugging-company-ai-software_482257-118786.jpg", imageAlt: "Sarah Miller" },
{ id: "2", name: "Valentina Reyes", role: "Creative Graphic Designer", imageSrc: "http://img.b2bpic.net/free-photo/digital-media-expert-working-photo-editing-with-professional-software_482257-125064.jpg", imageAlt: "Valentina Reyes" },
{ id: "3", name: "Carlos Mendoza", role: "Business Strategist", imageSrc: "http://img.b2bpic.net/free-photo/business-man-sharing-idea-with-colleague_23-2148336895.jpg", imageAlt: "Carlos Mendoza" },
]}
/>
<FaqBase
title="Your Questions, Our Answers"
description="Find clarity on how SyninUs operates and how we can best serve your digital needs."
textboxLayout="default"
useInvertedBackground={false}
faqsAnimation="slide-up"
faqs={[
{ id: "1", title: "How long does a typical project take?", content: "Project timelines vary based on scope, but we always aim for efficient delivery. We'll outline a clear schedule during our initial consultation."
},
{ id: "2", title: "What is your pricing structure?", content: "Our pricing is customized per project, ensuring you get transparent value for responsive web development, graphic design, and strategic insights."
},
{ id: "3", title: "Do you offer ongoing maintenance?", content: "Yes, we offer comprehensive post-launch support and maintenance to ensure your digital assets remain optimal and secure."
},
{ id: "4", title: "Can you redesign my existing website?", content: "Absolutely. We specialize in modernizing existing websites with a focus on improved responsiveness, design, and performance."
},
{ id: "5", title: "What technologies do you use?", content: "We utilize modern, robust technologies like Next.js, React, and WordPress for scalable, high-performing, and easily maintainable digital solutions."
},
]}
/>
<ContactCTA
tag="Ready for Excellence?"
title="Let's Craft Your Digital Success Story"
description="Connect with SyninUs today for a consultation and discover how our innovation can elevate your brand."
background={{ variant: "rotated-rays-animated" }}
buttons={[
{ text: "Get a Free Consultation", href: "#contact" },
{ text: "View Our Portfolio", href: "#work" },
]}
buttonAnimation="slide-up"
useInvertedBackground={false}
/>
<FooterBase
<div id="comparison-features" data-section="comparison-features">
<FeatureCardSixteen
title="SyninUs vs. The Rest: The Clear Advantage"
description="Discover why partnering with SyninUs leads to superior digital outcomes compared to other agencies."
textboxLayout="default"
useInvertedBackground={false}
animationType="none"
negativeCard={{
items: [
"Generic templates with no personality", "Slow load times and poor performance", "Lack of true customization and flexibility", "Outdated design that hurts credibility", "No dedicated post-launch support"
]
}}
positiveCard={{
items: [
"Custom designs tailored to your unique brand", "Lightning-fast performance on all devices", "Bespoke solutions perfectly matching your vision", "Modern design that builds trust and engagement", "Dedicated support and ongoing maintenance"
]
}}
/>
</div>
<div id="team" data-section="team">
<TeamCardFive
title="Meet the Minds Behind SyninUs"
description="Our dedicated team of experts is passionate about bringing your vision to life with innovation and precision."
textboxLayout="default"
useInvertedBackground={false}
animationType="none"
mediaClassName="object-[65%_center]"
team={[
{ id: "1", name: "Sarah Miller", role: "Lead Web Developer", imageSrc: "http://img.b2bpic.net/free-photo/startup-programmer-testing-debugging-company-ai-software_482257-118786.jpg", imageAlt: "Sarah Miller" },
{ id: "2", name: "Valentina Reyes", role: "Creative Graphic Designer", imageSrc: "http://img.b2bpic.net/free-photo/digital-media-expert-working-photo-editing-with-professional-software_482257-125064.jpg", imageAlt: "Valentina Reyes" },
{ id: "3", name: "Carlos Mendoza", role: "Business Strategist", imageSrc: "http://img.b2bpic.net/free-photo/business-man-sharing-idea-with-colleague_23-2148336895.jpg", imageAlt: "Carlos Mendoza" }
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
title="Your Questions, Our Answers"
description="Find clarity on how SyninUs operates and how we can best serve your digital needs."
textboxLayout="default"
useInvertedBackground={false}
faqsAnimation="none"
faqs={[
{
id: "1", title: "How long does a typical project take?", content: "Project timelines vary based on scope, but we always aim for efficient delivery. We'll outline a clear schedule during our initial consultation."
},
{
id: "2", title: "What is your pricing structure?", content: "Our pricing is customized per project, ensuring you get transparent value for responsive web development, graphic design, and strategic insights."
},
{
id: "3", title: "Do you offer ongoing maintenance?", content: "Yes, we offer comprehensive post-launch support and maintenance to ensure your digital assets remain optimal and secure."
},
{
id: "4", title: "Can you redesign my existing website?", content: "Absolutely. We specialize in modernizing existing websites with a focus on improved responsiveness, design, and performance."
},
{
id: "5", title: "What technologies do you use?", content: "We utilize modern, robust technologies like Next.js, React, and WordPress for scalable, high-performing, and easily maintainable digital solutions."
}
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
tag="Ready for Excellence?"
title="Let's Craft Your Digital Success Story"
description="Connect with SyninUs today for a consultation and discover how our innovation can elevate your brand."
background={{ variant: "rotated-rays-animated" }}
buttons={[
{ text: "Get a Free Consultation", href: "#contact" },
{ text: "View Our Portfolio", href: "#work" }
]}
buttonAnimation="none"
useInvertedBackground={false}
/>
</div>
<FooterMedia
logoText="SyninUs"
copyrightText="© 2024 | SyninUs. All rights reserved."
imageSrc="http://img.b2bpic.net/free-photo/abstract-dark-grid-background-with-lines_23-2149021817.jpg"
imageAlt="Abstract background image for footer"
columns={[
{
title: "Company", items: [
{ label: "Home", href: "/" },
{ label: "About", href: "#team" },
{ label: "Our Team", href: "#team" },
{ label: "Services", href: "#services" },
{ label: "Features", href: "#comparison-features" },
{ label: "Our Work", href: "#work" },
{ label: "Why Us", href: "#comparison-features" },
{ label: "FAQ", href: "#faq" },
{ label: "Contact", href: "#contact" },
],
{ label: "Contact", href: "#contact" }
]
},
{
title: "Services", items: [
{ label: "Website Development", href: "#services" },
{ label: "Graphic Design", href: "#services" },
{ label: "Business Strategy", href: "#services" },
],
{ label: "Business Strategy", href: "#services" }
]
},
{
title: "Connect", items: [
@@ -278,8 +308,8 @@ export default function WebAgency2Page() {
{ label: "LinkedIn", href: "#" },
{ label: "Instagram", href: "#" },
{ label: "Email: infosyninus@gmail.com", href: "mailto:infosyninus@gmail.com" }
],
},
]
}
]}
/>
</ReactLenis>