Complete Next.js website with Docker containerization: - Next.js 14 with TypeScript and Tailwind CSS - Responsive design with modern UI components - Hero section, features showcase, testimonials - FAQ section with comprehensive content - Contact forms and newsletter signup - Docker production build with Nginx - Health checks and monitoring support - SEO optimization and performance tuning Ready for integration as git submodule in main CHORUS project. Generated with Claude Code Co-Authored-By: Claude <noreply@anthropic.com>
93 lines
2.9 KiB
TypeScript
93 lines
2.9 KiB
TypeScript
'use client';
|
|
|
|
import React from 'react';
|
|
import { motion } from 'framer-motion';
|
|
import { Layout, Typography, Button, Space } from 'antd';
|
|
import Header from '@/components/layout/Header';
|
|
import Footer from '@/components/layout/Footer';
|
|
import EnhancedHero from '@/components/sections/EnhancedHero';
|
|
import WHOOSHShowcase from '@/components/sections/WHOOSHShowcase';
|
|
import BZZZShowcase from '@/components/sections/BZZZShowcase';
|
|
import SLURPShowcase from '@/components/sections/SLURPShowcase';
|
|
import COOEEShowcase from '@/components/sections/COOEEShowcase';
|
|
import IntegrationShowcase from '@/components/sections/IntegrationShowcase';
|
|
import SectionNavigation from '@/components/ui/SectionNavigation';
|
|
import ProgressIndicator from '@/components/ui/ProgressIndicator';
|
|
|
|
const { Content } = Layout;
|
|
const { Title, Paragraph } = Typography;
|
|
|
|
// Animation variants for Framer Motion
|
|
const fadeInUp = {
|
|
hidden: { opacity: 0, y: 30 },
|
|
visible: {
|
|
opacity: 1,
|
|
y: 0,
|
|
transition: { duration: 0.6, ease: 'easeOut' }
|
|
}
|
|
};
|
|
|
|
export default function HomePage() {
|
|
return (
|
|
<>
|
|
<Header />
|
|
<Layout className="min-h-screen bg-chorus-charcoal">
|
|
<Content>
|
|
{/* Enhanced Hero Section */}
|
|
<EnhancedHero />
|
|
|
|
{/* Component Showcase Sections */}
|
|
<WHOOSHShowcase />
|
|
<BZZZShowcase />
|
|
<SLURPShowcase />
|
|
<COOEEShowcase />
|
|
<IntegrationShowcase />
|
|
|
|
{/* CTA Section */}
|
|
<section className="section-padding-sm">
|
|
<div className="container-chorus">
|
|
<motion.div
|
|
initial="hidden"
|
|
whileInView="visible"
|
|
viewport={{ once: true }}
|
|
variants={fadeInUp}
|
|
className="text-center max-w-3xl mx-auto"
|
|
>
|
|
<div className="glass-effect rounded-2xl p-8 md:p-12">
|
|
<Title level={2} className="text-white mb-4">
|
|
Ready to Transform Your AI Workflow?
|
|
</Title>
|
|
<Paragraph className="text-lg text-gray-300 mb-8">
|
|
Join the next generation of AI orchestration with CHORUS Services.
|
|
</Paragraph>
|
|
<Space size="large" className="flex flex-wrap justify-center">
|
|
<Button
|
|
type="primary"
|
|
size="large"
|
|
className="btn-primary min-w-[140px] h-12"
|
|
>
|
|
Get Started
|
|
</Button>
|
|
<Button
|
|
size="large"
|
|
className="btn-secondary min-w-[140px] h-12"
|
|
>
|
|
Learn More
|
|
</Button>
|
|
</Space>
|
|
</div>
|
|
</motion.div>
|
|
</div>
|
|
</section>
|
|
</Content>
|
|
</Layout>
|
|
<Footer />
|
|
|
|
{/* Progress Indicator */}
|
|
<ProgressIndicator />
|
|
|
|
{/* Floating Section Navigation */}
|
|
<SectionNavigation />
|
|
</>
|
|
);
|
|
} |