bender/979f2f38-4ded-44d5-970c-6e061ca8d789
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_1 into main #2

Merged
bender merged 2 commits from version_1 into main 2026-03-13 09:28:36 +00:00
Conversation 0 Commits 2 Files Changed 2 +106 -267
2 changed files with 106 additions and 267 deletions
Download Patch File Download Diff File Expand all files Collapse all files

298
src/app/page.tsx
View File

@@ -2,17 +2,17 @@
import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel";
import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
import MetricCardTwo from "@/components/sections/metrics/MetricCardTwo";
import PricingCardTwo from "@/components/sections/pricing/PricingCardTwo";
import TestimonialCardOne from "@/components/sections/testimonial/TestimonialCardOne";
import FaqBase from "@/components/sections/faq/FaqBase";
import BlogCardThree from "@/components/sections/blog/BlogCardThree";
import ContactSplit from "@/components/sections/contact/ContactSplit";
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
import { Zap, Code2, TrendingUp, DollarSign, MessageSquare, HelpCircle, BookOpen, Mail } from "lucide-react";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import FaqBase from '@/components/sections/faq/FaqBase';
import BlogCardThree from '@/components/sections/blog/BlogCardThree';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { Zap, Code2, TrendingUp, DollarSign, MessageSquare, HelpCircle, BookOpen, Mail, Sparkles, Crown } from "lucide-react";
export default function HomePage() {
const navItems = [
@@ -25,8 +25,7 @@ export default function HomePage() {
const footerColumns = [
{
title: "Product",
items: [
title: "Product", items: [
{ label: "Learning Paths", href: "/learning-paths" },
{ label: "Challenges", href: "/challenges" },
{ label: "Courses", href: "/courses" },
@@ -35,8 +34,7 @@ export default function HomePage() {
],
},
{
title: "Learn",
items: [
title: "Learn", items: [
{ label: "Dashboard", href: "/dashboard" },
{ label: "Community", href: "/community" },
{ label: "Leaderboard", href: "/leaderboard" },
@@ -45,8 +43,7 @@ export default function HomePage() {
],
},
{
title: "Company",
items: [
title: "Company", items: [
{ label: "About Us", href: "#" },
{ label: "Contact", href: "/contact" },
{ label: "Careers", href: "#" },
@@ -55,8 +52,7 @@ export default function HomePage() {
],
},
{
title: "Legal",
items: [
title: "Legal", items: [
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" },
{ label: "Cookie Policy", href: "#" },
@@ -64,8 +60,7 @@ export default function HomePage() {
],
},
{
title: "Social",
items: [
title: "Social", items: [
{ label: "Twitter", href: "https://twitter.com" },
{ label: "GitHub", href: "https://github.com" },
{ label: "LinkedIn", href: "https://linkedin.com" },
@@ -98,46 +93,30 @@ export default function HomePage() {
tag="Interactive Learning Platform"
tagIcon={Zap}
tagAnimation="slide-up"
background={{ variant: "circleGradient" }}
background={{ variant: "glowing-orb" }}
leftCarouselItems={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/a-professional-coding-interface-with-a-d-1773393958879-392e4617.png?_wi=1",
imageAlt: "Professional code editor interface",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/a-professional-coding-interface-with-a-d-1773393958879-392e4617.png", imageAlt: "Professional code editor interface"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/advanced-code-editor-interface-with-synt-1773393958618-fba99c87.png?_wi=1",
imageAlt: "Advanced syntax highlighting",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/advanced-code-editor-interface-with-synt-1773393958618-fba99c87.png", imageAlt: "Advanced syntax highlighting"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/visual-learning-path-roadmap-showing-pro-1773393959520-7ae27592.png?_wi=1",
imageAlt: "Learning path visualization",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/visual-learning-path-roadmap-showing-pro-1773393959520-7ae27592.png", imageAlt: "Learning path visualization"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/comprehensive-dashboard-interface-showin-1773393959773-9cb948af.png?_wi=1",
imageAlt: "Dashboard overview",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/comprehensive-dashboard-interface-showin-1773393959773-9cb948af.png", imageAlt: "Dashboard overview"},
]}
rightCarouselItems={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/split-screen-showing-interactive-coding--1773393959332-8417ef0f.png?_wi=1",
imageAlt: "Interactive learning environment",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/split-screen-showing-interactive-coding--1773393959332-8417ef0f.png", imageAlt: "Interactive learning environment"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/gamification-interface-showing-xp-points-1773393962631-f69a902f.png?_wi=1",
imageAlt: "Gamification achievements",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/gamification-interface-showing-xp-points-1773393962631-f69a902f.png", imageAlt: "Gamification achievements"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/community-discussion-forum-showing-threa-1773393959228-c5cd868a.png?_wi=1",
imageAlt: "Community collaboration",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/community-discussion-forum-showing-threa-1773393959228-c5cd868a.png", imageAlt: "Community collaboration"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/pricing-tier-comparison-showing-three-ti-1773393958728-0bde1fd7.png?_wi=1",
imageAlt: "Pricing comparison",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/pricing-tier-comparison-showing-three-ti-1773393958728-0bde1fd7.png", imageAlt: "Pricing comparison"},
]}
carouselPosition="right"
buttons={[
{ text: "Start Learning Free", href: "/courses" },
{ text: "Start Learning Free", href: "/learning-paths" },
{ text: "Try Interactive Editor", href: "/challenges" },
]}
buttonAnimation="slide-up"
@@ -149,46 +128,22 @@ export default function HomePage() {
<FeatureCardOne
features={[
{
title: "Interactive Code Editor",
description: "Write, run, and debug code instantly with syntax highlighting, autocompletion, and real-time error detection.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/advanced-code-editor-interface-with-synt-1773393958618-fba99c87.png?_wi=2",
imageAlt: "Code editor interface",
button: { text: "Learn More", href: "#" },
title: "Interactive Code Editor", description: "Write, run, and debug code instantly with syntax highlighting, autocompletion, and real-time error detection.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/advanced-code-editor-interface-with-synt-1773393958618-fba99c87.png", imageAlt: "Code editor interface", button: { text: "Learn More", href: "#" },
},
{
title: "Structured Learning Paths",
description: "Progress from beginner to advanced with carefully designed lessons, exercises, and real-world projects.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/visual-learning-path-roadmap-showing-pro-1773393959520-7ae27592.png?_wi=2",
imageAlt: "Learning path progression",
button: { text: "Explore Paths", href: "/learning-paths" },
title: "Structured Learning Paths", description: "Progress from beginner to advanced with carefully designed lessons, exercises, and real-world projects.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/visual-learning-path-roadmap-showing-pro-1773393959520-7ae27592.png", imageAlt: "Learning path progression", button: { text: "Explore Paths", href: "/learning-paths" },
},
{
title: "Gamification System",
description: "Earn XP points, build coding streaks, unlock achievements, and compete on leaderboards.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/gamification-interface-showing-xp-points-1773393962631-f69a902f.png?_wi=2",
imageAlt: "Gamification achievements",
button: { text: "Check Leaderboard", href: "/leaderboard" },
title: "Gamification System", description: "Earn XP points, build coding streaks, unlock achievements, and compete on leaderboards.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/gamification-interface-showing-xp-points-1773393962631-f69a902f.png", imageAlt: "Gamification achievements", button: { text: "Check Leaderboard", href: "/leaderboard" },
},
{
title: "Coding Challenges",
description: "Practice with coding challenges ranging from easy to expert level with instant test case validation.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/advanced-code-editor-interface-with-synt-1773393958618-fba99c87.png?_wi=3",
imageAlt: "Challenge interface",
button: { text: "Start Challenges", href: "/challenges" },
title: "Coding Challenges", description: "Practice with coding challenges ranging from easy to expert level with instant test case validation.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/advanced-code-editor-interface-with-synt-1773393958618-fba99c87.png", imageAlt: "Challenge interface", button: { text: "Start Challenges", href: "/challenges" },
},
{
title: "Community Support",
description: "Ask questions, share code, get peer feedback, and learn from experienced mentors in the community forum.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/community-discussion-forum-showing-threa-1773393959228-c5cd868a.png?_wi=2",
imageAlt: "Community discussion",
button: { text: "Join Community", href: "/community" },
title: "Community Support", description: "Ask questions, share code, get peer feedback, and learn from experienced mentors in the community forum.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/community-discussion-forum-showing-threa-1773393959228-c5cd868a.png", imageAlt: "Community discussion", button: { text: "Join Community", href: "/community" },
},
{
title: "Real-World Projects",
description: "Build portfolio projects like todo apps, calculators, APIs, and more with guided instructions and solutions.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/comprehensive-dashboard-interface-showin-1773393959773-9cb948af.png?_wi=2",
imageAlt: "Project showcase",
button: { text: "View Projects", href: "/projects" },
title: "Real-World Projects", description: "Build portfolio projects like todo apps, calculators, APIs, and more with guided instructions and solutions.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/comprehensive-dashboard-interface-showin-1773393959773-9cb948af.png", imageAlt: "Project showcase", button: { text: "View Projects", href: "/projects" },
},
]}
title="Powerful Learning Tools"
@@ -221,7 +176,7 @@ export default function HomePage() {
textboxLayout="default"
gridVariant="uniform-all-items-equal"
animationType="slide-up"
buttons={[{ text: "Start Your Journey", href: "/courses" }]}
buttons={[{ text: "Start Your Journey", href: "/learning-paths" }]}
buttonAnimation="slide-up"
useInvertedBackground={false}
/>
@@ -231,65 +186,31 @@ export default function HomePage() {
<PricingCardTwo
plans={[
{
id: "starter",
badge: "Starter Plan",
badgeIcon: Zap,
price: "Free",
subtitle: "Perfect for beginners",
buttons: [
id: "starter", badge: "Starter Plan", badgeIcon: Sparkles,
price: "Free", subtitle: "Perfect for beginners", buttons: [
{ text: "Get Started", href: "#" },
{ text: "Learn More", href: "#" },
],
features: [
"Access to 50+ beginner courses",
"Interactive code editor with basic syntax highlighting",
"Up to 10 coding challenges per month",
"Community forum access",
"Basic progress tracking",
"Mobile app access",
],
"Access to 50+ beginner courses", "Interactive code editor with basic syntax highlighting", "Up to 10 coding challenges per month", "Community forum access", "Basic progress tracking", "Mobile app access"],
},
{
id: "pro",
badge: "Pro Plan",
badgeIcon: Zap,
price: "$12/month",
subtitle: "Best for active learners",
buttons: [
id: "pro", badge: "Pro Plan", badgeIcon: Zap,
price: "$12/month", subtitle: "Best for active learners", buttons: [
{ text: "Start Free Trial", href: "#" },
{ text: "Chat to Sales", href: "#" },
],
features: [
"Unlimited access to all 500+ courses",
"Advanced code editor with AI assistance",
"Unlimited coding challenges",
"Priority community support",
"Detailed analytics dashboard",
"Mentorship matching",
"Certificate of completion",
"Ad-free experience",
],
"Unlimited access to all 500+ courses", "Advanced code editor with AI assistance", "Unlimited coding challenges", "Priority community support", "Detailed analytics dashboard", "Mentorship matching", "Certificate of completion", "Ad-free experience"],
},
{
id: "enterprise",
badge: "Enterprise Plan",
badgeIcon: undefined,
price: "Custom",
subtitle: "For teams and organizations",
buttons: [
id: "enterprise", badge: "Enterprise Plan", badgeIcon: Crown,
price: "Custom", subtitle: "For teams and organizations", buttons: [
{ text: "Request Demo", href: "#" },
{ text: "Contact Sales", href: "#" },
],
features: [
"Everything in Pro Plan",
"Team management console",
"Custom learning paths",
"Dedicated account manager",
"Advanced reporting & analytics",
"SSO and enterprise security",
"API access",
"24/7 priority support",
],
"Everything in Pro Plan", "Team management console", "Custom learning paths", "Dedicated account manager", "Advanced reporting & analytics", "SSO and enterprise security", "API access", "24/7 priority support"],
},
]}
title="Simple, Transparent Pricing"
@@ -308,59 +229,23 @@ export default function HomePage() {
<TestimonialCardOne
testimonials={[
{
id: "1",
name: "Sarah Johnson",
role: "Junior Developer",
company: "TechCorp",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-photo-of-a-young-professional-d-1773393958255-f863766e.png?_wi=1",
imageAlt: "Sarah Johnson",
},
id: "1", name: "Sarah Johnson", role: "Junior Developer", company: "TechCorp", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-photo-of-a-young-professional-d-1773393958255-f863766e.png", imageAlt: "Sarah Johnson"},
{
id: "2",
name: "Michael Chen",
role: "Software Engineer",
company: "InnovateLab",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-a-female-software-engineer-w-1773393958850-d45f5ae9.png?_wi=1",
imageAlt: "Michael Chen",
},
id: "2", name: "Michael Chen", role: "Software Engineer", company: "InnovateLab", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-a-female-software-engineer-w-1773393958850-d45f5ae9.png", imageAlt: "Michael Chen"},
{
id: "3",
name: "Emily Rodriguez",
role: "Senior Developer",
company: "GrowthCo",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-a-middle-aged-male-developer-1773393958004-95cf3ebc.png?_wi=1",
imageAlt: "Emily Rodriguez",
},
id: "3", name: "Emily Rodriguez", role: "Senior Developer", company: "GrowthCo", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-a-middle-aged-male-developer-1773393958004-95cf3ebc.png", imageAlt: "Emily Rodriguez"},
{
id: "4",
name: "David Kim",
role: "Career Switcher",
company: "StartupXYZ",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-a-young-aspiring-developer-w-1773393959701-f0260340.png?_wi=1",
imageAlt: "David Kim",
},
id: "4", name: "David Kim", role: "Career Switcher", company: "StartupXYZ", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-a-young-aspiring-developer-w-1773393959701-f0260340.png", imageAlt: "David Kim"},
{
id: "5",
name: "Priya Patel",
role: "Full Stack Developer",
company: "CloudServices",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-diverse-software-engineer-ag-1773393958038-b800a773.png?_wi=1",
imageAlt: "Priya Patel",
},
id: "5", name: "Priya Patel", role: "Full Stack Developer", company: "CloudServices", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-diverse-software-engineer-ag-1773393958038-b800a773.png", imageAlt: "Priya Patel"},
{
id: "6",
name: "Jessica Lee",
role: "Tech Lead",
company: "ByteForce",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-confident-female-tech-lead-o-1773393958716-b30be03f.png?_wi=1",
imageAlt: "Jessica Lee",
},
id: "6", name: "Jessica Lee", role: "Tech Lead", company: "ByteForce", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-confident-female-tech-lead-o-1773393958716-b30be03f.png", imageAlt: "Jessica Lee"},
]}
title="What Our Learners Say"
description="Real feedback from developers who have transformed their coding skills with CodeMaster"
@@ -380,45 +265,21 @@ export default function HomePage() {
<FaqBase
faqs={[
{
id: "1",
title: "How does CodeMaster work?",
content: "CodeMaster provides an interactive learning platform where you learn programming through hands-on practice. You write actual code in our built-in editor, get instant feedback, complete challenges, and build real projects. Our structured learning paths guide you from beginner to advanced levels with curated courses and exercises.",
},
id: "1", title: "How does CodeMaster work?", content: "CodeMaster provides an interactive learning platform where you learn programming through hands-on practice. You write actual code in our built-in editor, get instant feedback, complete challenges, and build real projects. Our structured learning paths guide you from beginner to advanced levels with curated courses and exercises."},
{
id: "2",
title: "What programming languages can I learn?",
content: "CodeMaster supports 15+ programming languages including JavaScript, Python, Java, C++, C#, Go, Rust, TypeScript, PHP, Ruby, Swift, Kotlin, SQL, HTML/CSS, and more. Each language has its own comprehensive learning path with beginner to advanced courses.",
},
id: "2", title: "What programming languages can I learn?", content: "CodeMaster supports 15+ programming languages including JavaScript, Python, Java, C++, C#, Go, Rust, TypeScript, PHP, Ruby, Swift, Kotlin, SQL, HTML/CSS, and more. Each language has its own comprehensive learning path with beginner to advanced courses."},
{
id: "3",
title: "Do I need programming experience to start?",
content: "No! CodeMaster is perfect for complete beginners. We start with the basics and gradually introduce more complex concepts. Each course includes detailed explanations, hints, and our AI assistant helps answer your questions. You can also get help from our community of experienced developers.",
},
id: "3", title: "Do I need programming experience to start?", content: "No! CodeMaster is perfect for complete beginners. We start with the basics and gradually introduce more complex concepts. Each course includes detailed explanations, hints, and our AI assistant helps answer your questions. You can also get help from our community of experienced developers."},
{
id: "4",
title: "Can I get a certificate after completing a course?",
content: "Yes! With our Pro and Enterprise plans, you receive certificates of completion for each course you finish. These certificates are shareable on LinkedIn and other professional platforms, helping showcase your skills to potential employers.",
},
id: "4", title: "Can I get a certificate after completing a course?", content: "Yes! With our Pro and Enterprise plans, you receive certificates of completion for each course you finish. These certificates are shareable on LinkedIn and other professional platforms, helping showcase your skills to potential employers."},
{
id: "5",
title: "Is there a free trial for Pro?",
content: "Yes, we offer a 14-day free trial for the Pro plan with full access to all features. No credit card required to start. After the trial, you can continue with the free Starter plan or upgrade to Pro or Enterprise.",
},
id: "5", title: "Is there a free trial for Pro?", content: "Yes, we offer a 14-day free trial for the Pro plan with full access to all features. No credit card required to start. After the trial, you can continue with the free Starter plan or upgrade to Pro or Enterprise."},
{
id: "6",
title: "Can I get mentorship support?",
content: "Absolutely! Pro and Enterprise plans include mentorship matching with experienced developers. You can schedule 1-on-1 sessions, ask code reviews, get career advice, and receive personalized guidance on your learning journey.",
},
id: "6", title: "Can I get mentorship support?", content: "Absolutely! Pro and Enterprise plans include mentorship matching with experienced developers. You can schedule 1-on-1 sessions, ask code reviews, get career advice, and receive personalized guidance on your learning journey."},
{
id: "7",
title: "What if I'm stuck on a problem?",
content: "You have multiple resources: (1) Built-in hints system provides step-by-step guidance, (2) Interactive AI assistant answers coding questions, (3) Community forum where you can ask peers and mentors, (4) Solution code is available after attempting the challenge, and (5) Mentor support for Pro users.",
},
id: "7", title: "What if I'm stuck on a problem?", content: "You have multiple resources: (1) Built-in hints system provides step-by-step guidance, (2) Interactive AI assistant answers coding questions, (3) Community forum where you can ask peers and mentors, (4) Solution code is available after attempting the challenge, and (5) Mentor support for Pro users."},
{
id: "8",
title: "How often are new courses added?",
content: "We add new courses weekly, covering the latest programming languages, frameworks, and technologies. Our content team continuously updates existing courses based on community feedback and emerging industry trends.",
},
id: "8", title: "How often are new courses added?", content: "We add new courses weekly, covering the latest programming languages, frameworks, and technologies. Our content team continuously updates existing courses based on community feedback and emerging industry trends."},
]}
title="Frequently Asked Questions"
description="Find answers to common questions about CodeMaster, pricing, features, and more"
@@ -436,38 +297,11 @@ export default function HomePage() {
<BlogCardThree
blogs={[
{
id: "1",
category: "Best Practices",
title: "Clean Code Principles Every Developer Should Know",
excerpt: "Learn the fundamental principles of writing maintainable, readable code that your team will love working with.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/professional-blog-header-image-showing-c-1773393960137-bdbb17eb.png?_wi=1",
imageAlt: "Clean code principles",
authorName: "Alex Chen",
authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-photo-of-a-young-professional-d-1773393958255-f863766e.png",
date: "Jan 15, 2025",
},
id: "1", category: "Best Practices", title: "Clean Code Principles Every Developer Should Know", excerpt: "Learn the fundamental principles of writing maintainable, readable code that your team will love working with.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/professional-blog-header-image-showing-c-1773393960137-bdbb17eb.png", imageAlt: "Clean code principles", authorName: "Alex Chen", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-photo-of-a-young-professional-d-1773393958255-f863766e.png", date: "Jan 15, 2025"},
{
id: "2",
category: "Learning Path",
title: "Your Complete Roadmap to Full-Stack Development",
excerpt: "A comprehensive guide on the learning path from frontend to backend, covering essential tools and technologies.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/visual-representation-of-a-structured-le-1773393958991-d75ebd9a.png",
imageAlt: "Full stack roadmap",
authorName: "Sarah Johnson",
authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-a-female-software-engineer-w-1773393958850-d45f5ae9.png",
date: "Jan 12, 2025",
},
id: "2", category: "Learning Path", title: "Your Complete Roadmap to Full-Stack Development", excerpt: "A comprehensive guide on the learning path from frontend to backend, covering essential tools and technologies.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/visual-representation-of-a-structured-le-1773393958991-d75ebd9a.png", imageAlt: "Full stack roadmap", authorName: "Sarah Johnson", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-a-female-software-engineer-w-1773393958850-d45f5ae9.png", date: "Jan 12, 2025"},
{
id: "3",
category: "Advanced Techniques",
title: "Mastering Debugging: Techniques to Find and Fix Bugs Fast",
excerpt: "Advanced debugging strategies and tools to efficiently identify and resolve issues in your code.",
imageSrc: "/placeholders/placeholder1.webp",
imageAlt: "Debugging guide",
authorName: "Mike Rodriguez",
authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-a-middle-aged-male-developer-1773393958004-95cf3ebc.png",
date: "Jan 10, 2025",
},
id: "3", category: "Advanced Techniques", title: "Mastering Debugging: Techniques to Find and Fix Bugs Fast", excerpt: "Advanced debugging strategies and tools to efficiently identify and resolve issues in your code.", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Debugging guide", authorName: "Mike Rodriguez", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/portrait-of-a-middle-aged-male-developer-1773393958004-95cf3ebc.png", date: "Jan 10, 2025"},
]}
title="Latest Coding Insights"
description="Articles and tutorials to level up your programming skills and stay updated with industry trends"
@@ -491,7 +325,7 @@ export default function HomePage() {
tagAnimation="slide-up"
background={{ variant: "radial-gradient" }}
useInvertedBackground={false}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/modern-newsletter-signup-visualization-s-1773393959083-5a8d8a83.png?_wi=1"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Asv1E8ISitX5wbsKHtNkaN7Kj9/modern-newsletter-signup-visualization-s-1773393959083-5a8d8a83.png"
imageAlt="Newsletter subscription"
mediaAnimation="slide-up"
mediaPosition="right"

75
src/components/shared/SvgTextLogo/SvgTextLogo.tsx
View File

@@ -1,51 +1,56 @@
"use client";
import { memo } from "react";
import useSvgTextLogo from "./useSvgTextLogo";
import { cls } from "@/lib/utils";
import React from 'react';
interface SvgTextLogoProps {
logoText: string;
adjustHeightFactor?: number;
verticalAlign?: "top" | "center";
text: string;
className?: string;
textClassName?: string;
animationDuration?: number;
animationDelay?: number;
}
const SvgTextLogo = memo<SvgTextLogoProps>(function SvgTextLogo({
logoText,
adjustHeightFactor,
verticalAlign = "top",
className = "",
}) {
const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor);
const SvgTextLogo: React.FC<SvgTextLogoProps> = ({
text,
className = '',
textClassName = '',
animationDuration = 2,
animationDelay = 0,
}) => {
return (
<svg
ref={svgRef}
viewBox={viewBox}
className={cls("w-full", className)}
style={{ aspectRatio: aspectRatio }}
preserveAspectRatio="none"
role="img"
aria-label={`${logoText} logo`}
viewBox={`0 0 ${text.length * 60} 100`}
className={`w-full h-auto ${className}`}
xmlns="http://www.w3.org/2000/svg"
>
<defs>
<style>
{`
@keyframes wave {
0%, 100% { transform: translateY(0px); }
50% { transform: translateY(-10px); }
}
.wave-text {
animation: wave ${animationDuration}s ease-in-out infinite;
animation-delay: ${animationDelay}s;
}
`}
</style>
</defs>
<text
ref={textRef}
x="0"
y={verticalAlign === "center" ? "50%" : "0"}
className="font-bold fill-current"
x="50%"
y="50%"
dominantBaseline="middle"
textAnchor="middle"
className={`wave-text text-4xl font-bold ${textClassName}`}
style={{
fontSize: "20px",
letterSpacing: "-0.02em",
dominantBaseline: verticalAlign === "center" ? "middle" : "text-before-edge"
fontSize: '48px',
fontWeight: 'bold',
fill: 'currentColor',
}}
>
{logoText}
{text}
</text>
</svg>
);
});
};
SvgTextLogo.displayName = "SvgTextLogo";
export default SvgTextLogo;
export default SvgTextLogo;