Merge version_1 into main #2
361
src/app/page.tsx
361
src/app/page.tsx
@@ -13,257 +13,132 @@ import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="bounce-effect"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
defaultButtonVariant="bounce-effect"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "home",
|
||||
},
|
||||
{
|
||||
name: "Leaderboard",
|
||||
id: "leaderboard",
|
||||
},
|
||||
{
|
||||
name: "Matches",
|
||||
id: "matches",
|
||||
},
|
||||
{
|
||||
name: "Admin",
|
||||
id: "admin",
|
||||
},
|
||||
]}
|
||||
brandName="MarbleCityFC"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "Home", id: "home" },
|
||||
{ name: "Leaderboard", id: "leaderboard" },
|
||||
{ name: "Matches", id: "matches" },
|
||||
{ name: "Admin", id: "admin" },
|
||||
]}
|
||||
brandName="MarbleCityFC"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="home" data-section="home">
|
||||
<HeroBillboard
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
title="MarbleCityFC Performance Portal"
|
||||
description="The official internal dashboard for tracking matches, player stats, and club performance."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-928.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/figure-skating-girl-ice-arena_654080-1585.jpg",
|
||||
alt: "Staff profile 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-933.jpg",
|
||||
alt: "Staff profile 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/sports-center_1127-4160.jpg",
|
||||
alt: "Staff profile 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/basketball-players-big-professional-arena-game_654080-295.jpg",
|
||||
alt: "Staff profile 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/business-investor-analyzing-stock-market-trend-monitor-trading-capital-profit-exchange-investment-young-broker-investing-funds-using-financial-forex-market-sales-close-up-handheld-shot_482257-40948.jpg",
|
||||
alt: "Staff profile 5",
|
||||
},
|
||||
]}
|
||||
avatarText="Trusted by our elite staff"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "League Leader: #1",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Unbeaten Streak: 12",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Top Scorer: 12 Goals",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Match Win Rate: 85%",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Season Progress: 60%",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="home" data-section="home">
|
||||
<HeroBillboard
|
||||
background={{ variant: "plain" }}
|
||||
title="MarbleCityFC Performance Portal"
|
||||
description="The official internal dashboard for tracking matches, player stats, and club performance."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-928.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/figure-skating-girl-ice-arena_654080-1585.jpg", alt: "Staff profile 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-933.jpg", alt: "Staff profile 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/sports-center_1127-4160.jpg", alt: "Staff profile 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/basketball-players-big-professional-arena-game_654080-295.jpg", alt: "Staff profile 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/business-investor-analyzing-stock-market-trend-monitor-trading-capital-profit-exchange-investment-young-broker-investing-funds-using-financial-forex-market-sales-close-up-handheld-shot_482257-40948.jpg", alt: "Staff profile 5" },
|
||||
]}
|
||||
avatarText="Trusted by our elite staff"
|
||||
marqueeItems={[
|
||||
{ type: "text", text: "League Leader: #1" },
|
||||
{ type: "text", text: "Unbeaten Streak: 12" },
|
||||
{ type: "text", text: "Top Scorer: 12 Goals" },
|
||||
{ type: "text", text: "Match Win Rate: 85%" },
|
||||
{ type: "text", text: "Season Progress: 60%" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="leaderboard" data-section="leaderboard">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "James Wilson",
|
||||
price: "12 Goals",
|
||||
imageSrc: "asset://user-image-1",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Marcus Rashford",
|
||||
price: "10 Goals",
|
||||
imageSrc: "asset://user-image-2",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Liam Smith",
|
||||
price: "8 Goals",
|
||||
imageSrc: "asset://user-image-3",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Tom Baker",
|
||||
price: "7 Goals",
|
||||
imageSrc: "asset://user-image-4",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Alex Reed",
|
||||
price: "6 Goals",
|
||||
imageSrc: "asset://user-image-5",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Sam Field",
|
||||
price: "5 Goals",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-928.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
title="Player Leaderboard"
|
||||
description="Top performers based on seasonal statistics."
|
||||
/>
|
||||
</div>
|
||||
<div id="leaderboard" data-section="leaderboard">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "James Wilson", price: "12 Goals", imageSrc: "http://img.b2bpic.net/free-photo/figure-skating-girl-ice-arena_654080-1585.jpg" },
|
||||
{ id: "p2", name: "Marcus Rashford", price: "10 Goals", imageSrc: "http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-933.jpg" },
|
||||
{ id: "p3", name: "Liam Smith", price: "8 Goals", imageSrc: "http://img.b2bpic.net/free-photo/sports-center_1127-4160.jpg" },
|
||||
{ id: "p4", name: "Tom Baker", price: "7 Goals", imageSrc: "http://img.b2bpic.net/free-photo/basketball-players-big-professional-arena-game_654080-295.jpg" },
|
||||
{ id: "p5", name: "Alex Reed", price: "6 Goals", imageSrc: "http://img.b2bpic.net/free-photo/business-investor-analyzing-stock-market-trend-monitor-trading-capital-profit-exchange-investment-young-broker-investing-funds-using-financial-forex-market-sales-close-up-handheld-shot_482257-40948.jpg" },
|
||||
{ id: "p6", name: "Sam Field", price: "5 Goals", imageSrc: "http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-928.jpg" },
|
||||
]}
|
||||
title="Player Leaderboard"
|
||||
description="Top performers based on seasonal statistics."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="matches" data-section="matches">
|
||||
<FeatureCardTwentySeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "m1",
|
||||
title: "Oct 12 vs Tigers",
|
||||
descriptions: [
|
||||
"Score: 3-1",
|
||||
"Goal Scorers: Wilson, Smith, Baker",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/businessman-doing-research-analysis-computer-screen-plan-financial-statistics-with-charts-graphs-data-male-employee-working-with-diagram-report-find-sales-profit-e-commerce_482257-40940.jpg",
|
||||
imageAlt: "dashboard admin ui",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
title: "Oct 05 vs City Rovers",
|
||||
descriptions: [
|
||||
"Score: 2-2",
|
||||
"Goal Scorers: Rashford, Reed",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-928.jpg?_wi=3",
|
||||
imageAlt: "dashboard admin ui",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
title: "Sep 28 vs North United",
|
||||
descriptions: [
|
||||
"Score: 4-0",
|
||||
"Goal Scorers: Wilson, Smith, Baker, Field",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/figure-skating-girl-ice-arena_654080-1585.jpg",
|
||||
imageAlt: "dashboard admin ui",
|
||||
},
|
||||
]}
|
||||
title="Recent Match Logs"
|
||||
description="Historical data of recent league matches and outcomes."
|
||||
/>
|
||||
</div>
|
||||
<div id="matches" data-section="matches">
|
||||
<FeatureCardTwentySeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ id: "m1", title: "Oct 12 vs Tigers", descriptions: ["Score: 3-1", "Goal Scorers: Wilson, Smith, Baker"], imageSrc: "http://img.b2bpic.net/free-photo/businessman-doing-research-analysis-computer-screen-plan-financial-statistics-with-charts-graphs-data-male-employee-working-with-diagram-report-find-sales-profit-e-commerce_482257-40940.jpg", imageAlt: "dashboard admin ui" },
|
||||
{ id: "m2", title: "Oct 05 vs City Rovers", descriptions: ["Score: 2-2", "Goal Scorers: Rashford, Reed"], imageSrc: "http://img.b2bpic.net/free-photo/american-football-player-professional-stadium_654080-928.jpg", imageAlt: "dashboard admin ui" },
|
||||
{ id: "m3", title: "Sep 28 vs North United", descriptions: ["Score: 4-0", "Goal Scorers: Wilson, Smith, Baker, Field"], imageSrc: "http://img.b2bpic.net/free-photo/figure-skating-girl-ice-arena_654080-1585.jpg", imageAlt: "dashboard admin ui" },
|
||||
]}
|
||||
title="Recent Match Logs"
|
||||
description="Historical data of recent league matches and outcomes."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardFourteen
|
||||
useInvertedBackground={false}
|
||||
title="Club Performance Overview"
|
||||
tag="Live Metrics"
|
||||
metrics={[
|
||||
{
|
||||
id: "stat-1",
|
||||
value: "18",
|
||||
description: "Matches Played",
|
||||
},
|
||||
{
|
||||
id: "stat-2",
|
||||
value: "42",
|
||||
description: "Goals Scored",
|
||||
},
|
||||
{
|
||||
id: "stat-3",
|
||||
value: "12",
|
||||
description: "Clean Sheets",
|
||||
},
|
||||
{
|
||||
id: "stat-4",
|
||||
value: "2.4",
|
||||
description: "Goals Per Match",
|
||||
},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardFourteen
|
||||
useInvertedBackground={false}
|
||||
title="Club Performance Overview"
|
||||
tag="Live Metrics"
|
||||
metrics={[
|
||||
{ id: "stat-1", value: "18", description: "Matches Played" },
|
||||
{ id: "stat-2", value: "42", description: "Goals Scored" },
|
||||
{ id: "stat-3", value: "12", description: "Clean Sheets" },
|
||||
{ id: "stat-4", value: "2.4", description: "Goals Per Match" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="admin" data-section="admin">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Admin Tools"
|
||||
title="Match & Stats Entry"
|
||||
description="Use this secure panel to input new player data, match scores, and update weekly stats."
|
||||
inputPlaceholder="Enter admin authorization code"
|
||||
/>
|
||||
</div>
|
||||
<div id="admin" data-section="admin">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Admin Tools"
|
||||
title="Match & Stats Entry"
|
||||
description="Use this secure panel to input new player data, match scores, and update weekly stats."
|
||||
inputPlaceholder="Enter admin authorization code"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Platform",
|
||||
items: [
|
||||
{
|
||||
label: "Dashboard",
|
||||
href: "#home",
|
||||
},
|
||||
{
|
||||
label: "Stats",
|
||||
href: "#leaderboard",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "Contact Admin",
|
||||
href: "#admin",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="MarbleCityFC"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Platform", items: [
|
||||
{ label: "Dashboard", href: "#home" },
|
||||
{ label: "Stats", href: "#leaderboard" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [{ label: "Contact Admin", href: "#admin" }],
|
||||
},
|
||||
]}
|
||||
logoText="MarbleCityFC"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user