Merge version_1 into main #8
@@ -14,7 +14,7 @@ import { Zap, Shield, Users, Star } from 'lucide-react';
|
||||
export default function HomePage() {
|
||||
const navItems = [{ name: 'Home', id: '/' }];
|
||||
return (
|
||||
<ThemeProvider>
|
||||
<ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered navItems={navItems} brandName="Brand" />
|
||||
</div>
|
||||
@@ -22,22 +22,22 @@ export default function HomePage() {
|
||||
<HeroOverlay title="Welcome" description="This is our hero section." />
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric title="About Us" metrics={[{ icon: Shield, label: 'Quality', value: '100%' }, { icon: Users, label: 'Team', value: '50+' }]} metricsAnimation="slide-up" />
|
||||
<AboutMetric title="About Us" metrics={[{ icon: Shield, label: 'Quality', value: '100%' }, { icon: Users, label: 'Team', value: '50+' }]} metricsAnimation="slide-up" useInvertedBackground={false} />
|
||||
</div>
|
||||
<div id="menu" data-section="menu">
|
||||
<ProductCardTwo title="Products" gridVariant="uniform-all-items-equal" animationType="slide-up" textboxLayout="default" products={[{ id: '1', brand: 'Brand', name: 'Product A', price: '$10', rating: 5, reviewCount: '10', imageSrc: '/placeholder.svg' }, { id: '2', brand: 'Brand', name: 'Product B', price: '$20', rating: 4, reviewCount: '5', imageSrc: '/placeholder.svg' }, { id: '3', brand: 'Brand', name: 'Product C', price: '$30', rating: 5, reviewCount: '8', imageSrc: '/placeholder.svg' }]} />
|
||||
<ProductCardTwo title="Products" gridVariant="uniform-all-items-equal" animationType="slide-up" textboxLayout="default" products={[{ id: '1', brand: 'Brand', name: 'Product A', price: '$10', rating: 5, reviewCount: '10', imageSrc: '/placeholder.svg' }, { id: '2', brand: 'Brand', name: 'Product B', price: '$20', rating: 4, reviewCount: '5', imageSrc: '/placeholder.svg' }, { id: '3', brand: 'Brand', name: 'Product C', price: '$30', rating: 5, reviewCount: '8', imageSrc: '/placeholder.svg' }]} description="Explore our products." useInvertedBackground={false} />
|
||||
</div>
|
||||
<div id="atmosphere" data-section="atmosphere">
|
||||
<FeatureCardMedia title="Features" description="Discover our core capabilities." animationType="slide-up" textboxLayout="default" features={[{ id: '1', title: 'Speed', description: 'Blazing fast.', tag: 'New' }, { id: '2', title: 'Security', description: 'Top tier safety.', tag: 'Trusted' }]} />
|
||||
<FeatureCardMedia title="Features" description="Discover our core capabilities." animationType="slide-up" textboxLayout="default" features={[{ id: '1', title: 'Speed', description: 'Blazing fast.', tag: 'New' }, { id: '2', title: 'Security', description: 'Top tier safety.', tag: 'Trusted' }]} useInvertedBackground={false} />
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwo title="Testimonials" animationType="slide-up" textboxLayout="default" testimonials={[{ id: '1', name: 'User 1', role: 'CEO', testimonial: 'Great service!', icon: Star }, { id: '2', name: 'User 2', role: 'CTO', testimonial: 'Exceeded expectations!', icon: Star }]} />
|
||||
<TestimonialCardTwo title="Testimonials" description="What our clients say." animationType="slide-up" textboxLayout="default" testimonials={[{ id: '1', name: 'User 1', role: 'CEO', testimonial: 'Great service!', icon: Star }, { id: '2', name: 'User 2', role: 'CTO', testimonial: 'Exceeded expectations!', icon: Star }]} useInvertedBackground={false} />
|
||||
</div>
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardTwo title="Our Team" gridVariant="uniform-all-items-equal" animationType="slide-up" textboxLayout="default" members={[{ id: '1', name: 'Alice', role: 'Designer', description: 'Expert creator.' }, { id: '2', name: 'Bob', role: 'Developer', description: 'Code wizard.' }]} />
|
||||
<TeamCardTwo title="Our Team" gridVariant="uniform-all-items-equal" animationType="slide-up" textboxLayout="default" description="Meet the team." members={[{ id: '1', name: 'Alice', role: 'Designer', description: 'Expert creator.' }, { id: '2', name: 'Bob', role: 'Developer', description: 'Code wizard.' }]} useInvertedBackground={false} />
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm title="Contact Us" description="We are here to help." inputs={[{ name: 'email', type: 'email', placeholder: 'Email' }, { name: 'name', type: 'text', placeholder: 'Name' }]} />
|
||||
<ContactSplitForm title="Contact Us" description="We are here to help." inputs={[{ name: 'email', type: 'email', placeholder: 'Email' }, { name: 'name', type: 'text', placeholder: 'Name' }]} useInvertedBackground={false} />
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal logoText="Brand" columns={[{ title: 'Links', items: [{ label: 'Home', href: '/' }] }]} />
|
||||
|
||||
Reference in New Issue
Block a user