1 Commits

Author SHA1 Message Date
3d84977f39 Update src/app/page.tsx 2026-04-15 13:39:14 +00:00

View File

@@ -7,11 +7,10 @@ import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive'; import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal'; import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel'; import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered'; import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import SplitAbout from '@/components/sections/about/SplitAbout'; import SplitAbout from '@/components/sections/about/SplitAbout';
import TeamCardTwo from '@/components/sections/team/TeamCardTwo'; import TeamCardTwo from '@/components/sections/team/TeamCardTwo';
import { BarChart2, Edit3, Zap, BrainCircuit } from "lucide-react"; import { BarChart2, Edit3, Zap } from "lucide-react";
export default function GamingPage() { export default function GamingPage() {
return ( return (
@@ -28,157 +27,139 @@ export default function GamingPage() {
headingFontWeight="bold" headingFontWeight="bold"
> >
<ReactLenis root> <ReactLenis root>
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarStyleCentered <NavbarStyleCentered
navItems={[ navItems={[
{ name: "Getting Started", id: "hero" }, { name: "Getting Started", id: "hero" },
{ name: "Fabric Features", id: "features" }, { name: "Fabric Features", id: "features" },
{ name: "Mod Idea Guide", id: "mod-guide" }, { name: "Modding API", id: "about" },
{ name: "Community", id: "team" } { name: "Community", id: "team" }
]} ]}
brandName="FabricForge" brandName="FabricForge"
/> />
</div> </div>
<div id="hero" data-section="hero"> <div id="hero" data-section="hero">
<HeroBillboardRotatedCarousel <HeroBillboardRotatedCarousel
background={{ variant: "sparkles-gradient" }} background={{ variant: "sparkles-gradient" }}
title="Master the Fabric Modding Ecosystem" title="Master the Fabric Modding Ecosystem"
description="Build lightweight, high-performance mods for modern Minecraft versions. Join the thriving Fabric community and start creating your own game experience today." description="Build lightweight, high-performance mods for modern Minecraft versions. Join the thriving Fabric community and start creating your own game experience today."
buttons={[ buttons={[
{ text: "Get Started", href: "#features" }, { text: "Get Started", href: "#features" },
{ text: "View Docs", href: "#contact" } { text: "View Docs", href: "#contact" }
]} ]}
carouselItems={[ carouselItems={[
{ id: "1", imageSrc: "http://img.b2bpic.net/free-photo/3d-fantasy-scene_23-2151128059.jpg", imageAlt: "Modded Gameplay" }, { id: "1", imageSrc: "http://img.b2bpic.net/free-photo/3d-fantasy-scene_23-2151128059.jpg", imageAlt: "Modded Gameplay" },
{ id: "2", imageSrc: "http://img.b2bpic.net/free-photo/river-landscape-illustration-pixel-art-style_23-2151793132.jpg", imageAlt: "Pixel Art World" }, { id: "2", imageSrc: "http://img.b2bpic.net/free-photo/river-landscape-illustration-pixel-art-style_23-2151793132.jpg", imageAlt: "Pixel Art World" },
{ id: "3", imageSrc: "http://img.b2bpic.net/free-photo/financial-software-ui-pc-screen-apartment-office-desk_482257-122945.jpg", imageAlt: "Code IDE" }, { id: "3", imageSrc: "http://img.b2bpic.net/free-photo/financial-software-ui-pc-screen-apartment-office-desk_482257-122945.jpg", imageAlt: "Code IDE" },
{ id: "4", imageSrc: "http://img.b2bpic.net/free-photo/3d-fantasy-scene_23-2151128032.jpg", imageAlt: "Game Assets" }, { id: "4", imageSrc: "http://img.b2bpic.net/free-photo/3d-fantasy-scene_23-2151128032.jpg", imageAlt: "Game Assets" },
{ id: "5", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-futuristic-sci-fi-colorful-techno-lights-creating-cool-shapes-cool-background_181624-19814.jpg", imageAlt: "Techno Lights" }, { id: "5", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-futuristic-sci-fi-colorful-techno-lights-creating-cool-shapes-cool-background_181624-19814.jpg", imageAlt: "Techno Lights" },
{ id: "6", imageSrc: "http://img.b2bpic.net/free-photo/people-hangout-together-coffee-shop_53876-95318.jpg", imageAlt: "Modding Community" } { id: "6", imageSrc: "http://img.b2bpic.net/free-photo/people-hangout-together-coffee-shop_53876-95318.jpg", imageAlt: "Modding Community" }
]} ]}
/> />
</div> </div>
<div id="about" data-section="about"> <div id="about" data-section="about">
<SplitAbout <SplitAbout
textboxLayout="split" textboxLayout="split"
useInvertedBackground={false} useInvertedBackground={false}
title="Why Choose Fabric?" title="Why Choose Fabric?"
description="Fabric is a lightweight, modular modding toolchain for Minecraft. It offers faster update times, a cleaner development experience, and modular design that lets you use only the features you need." description="Fabric is a lightweight, modular modding toolchain for Minecraft. It offers faster update times, a cleaner development experience, and modular design that lets you use only the features you need."
bulletPoints={[ bulletPoints={[
{ title: "Blazing Fast Updates", description: "Fabric updates almost instantly with new game snapshots." }, { title: "Blazing Fast Updates", description: "Fabric updates almost instantly with new game snapshots." },
{ title: "Modular Design", description: "Easily mix and match modding components." }, { title: "Modular Design", description: "Easily mix and match modding components." },
{ title: "Rich API Ecosystem", description: "Access a wide range of APIs for rendering, networking, and game logic." } { title: "Rich API Ecosystem", description: "Access a wide range of APIs for rendering, networking, and game logic." }
]} ]}
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-gamer-playing-computer_23-2149829145.jpg" imageSrc="http://img.b2bpic.net/free-photo/medium-shot-gamer-playing-computer_23-2149829145.jpg"
/> />
</div> </div>
<div id="mod-guide" data-section="mod-guide"> <div id="features" data-section="features">
<MetricCardTwo <FeatureCardTwentyFive
title="Mod Idea Brainstorming Guide" animationType="slide-up"
description="Turn your spark of an idea into a fully-fledged Minecraft mod with our interactive workflow." textboxLayout="default"
tag="Innovation" useInvertedBackground={false}
tagIcon={BrainCircuit} features={[
animationType="slide-up" {
gridVariant="uniform-all-items-equal" title: "Advanced Mod Loader", description: "Lightning-fast load times for all your custom modifications.", icon: Zap,
textboxLayout="default" mediaItems: [
useInvertedBackground={false} { imageSrc: "http://img.b2bpic.net/free-vector/video-producing-computer-hardware-25-flat-color-icon-pack-including-directors-chair-movie-lady-character_1142-24873.jpg" },
metrics={[ { imageSrc: "http://img.b2bpic.net/free-photo/person-working-animation-porject_23-2149269912.jpg" }
{ id: "1", value: "01", description: "Conceptualize: Identify a gameplay niche or quality-of-life improvement." }, ]
{ id: "2", value: "02", description: "Prototype: Sketch mechanics, logic, and necessary assets." }, },
{ id: "3", value: "03", description: "Refine: Validate concepts with experienced Fabric developers." } {
]} title: "Voxel Rendering API", description: "State-of-the-art rendering tools for custom biomes and structures.", icon: Edit3,
/> mediaItems: [
</div> { imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150165975.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/executive-workspace-features-digital-dashboard-with-financial-charts_482257-123845.jpg" }
]
},
{
title: "WorldGen Tools", description: "Create unique terrain generation without complex setup.", icon: BarChart2,
mediaItems: [
{ imageSrc: "http://img.b2bpic.net/free-photo/settings-icon-front-side_187299-39535.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/pc-data-center-managing-network-resources-using-node-tree-software_482257-126003.jpg" }
]
}
]}
title="Fabric Features"
description="Unlock the full potential of your modding creativity."
/>
</div>
<div id="features" data-section="features"> <div id="team" data-section="team">
<FeatureCardTwentyFive <TeamCardTwo
animationType="slide-up" animationType="slide-up"
textboxLayout="default" gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false} textboxLayout="default"
features={[ useInvertedBackground={false}
{ title="Core Contributors"
title: "Advanced Mod Loader", description: "Lightning-fast load times for all your custom modifications.", icon: Zap, description="Meet the passionate individuals keeping the Fabric ecosystem healthy and thriving."
mediaItems: [ members={[
{ imageSrc: "http://img.b2bpic.net/free-vector/video-producing-computer-hardware-25-flat-color-icon-pack-including-directors-chair-movie-lady-character_1142-24873.jpg" }, { id: "1", name: "Alex Smith", role: "Loader Architect", description: "Dedicated to low-level optimization and game performance.", imageSrc: "http://img.b2bpic.net/free-photo/entertainer-unpacking-mobile-phone-review-it-technology-online-channel_482257-121555.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/person-working-animation-porject_23-2149269912.jpg" } { id: "2", name: "Jordan Lee", role: "Documentation Lead", description: "Ensuring every API function is well-documented for developers.", imageSrc: "http://img.b2bpic.net/free-photo/senior-woman-patient-asking-her-physician-about-new-treatment-plan_482257-117646.jpg" },
] { id: "3", name: "Sam Taylor", role: "Server Expert", description: "Building tools for stable, efficient server modding.", imageSrc: "http://img.b2bpic.net/free-photo/it-operator-prevents-servers-overload_482257-75899.jpg" },
}, { id: "4", name: "Jamie Reed", role: "Asset Lead", description: "Managing the massive collection of community mods.", imageSrc: "http://img.b2bpic.net/free-photo/shoulder-view-caucasian-man-using-pc-setup-playing-multiplayer-online-action-game-talking-team-headset-gamer-streaming-fast-paced-space-shooter-while-explaining-gameplay-subscribers_482257-50437.jpg" }
{ ]}
title: "Voxel Rendering API", description: "State-of-the-art rendering tools for custom biomes and structures.", icon: Edit3, />
mediaItems: [ </div>
{ imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150165975.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/executive-workspace-features-digital-dashboard-with-financial-charts_482257-123845.jpg" }
]
},
{
title: "WorldGen Tools", description: "Create unique terrain generation without complex setup.", icon: BarChart2,
mediaItems: [
{ imageSrc: "http://img.b2bpic.net/free-photo/settings-icon-front-side_187299-39535.jpg" },
{ imageSrc: "http://img.b2bpic.net/free-photo/pc-data-center-managing-network-resources-using-node-tree-software_482257-126003.jpg" }
]
}
]}
title="Fabric Features"
description="Unlock the full potential of your modding creativity."
/>
</div>
<div id="team" data-section="team"> <div id="faq" data-section="faq">
<TeamCardTwo <FaqDouble
animationType="slide-up" title="Fabric Modding FAQ"
gridVariant="four-items-2x2-equal-grid" description="Common questions about the Fabric toolchain."
title="Core Contributors" faqs={[
description="Meet the passionate individuals keeping the Fabric ecosystem healthy and thriving." { id: "1", title: "Is Fabric compatible with Forge?", content: "Fabric and Forge are distinct ecosystems. Mods for one will not run natively on the other, though bridges are available." },
textboxLayout="default" { id: "2", title: "How hard is it to switch?", content: "Fabric's modern approach makes it easy to learn for anyone with basic Java skills." },
useInvertedBackground={false} { id: "3", title: "Where to download?", content: "Visit the official Fabric website for the latest launcher and installer." }
members={[ ]}
{ id: "1", name: "Alex Smith", role: "Loader Architect", description: "Dedicated to low-level optimization and game performance.", imageSrc: "http://img.b2bpic.net/free-photo/entertainer-unpacking-mobile-phone-review-it-technology-online-channel_482257-121555.jpg" }, faqsAnimation="slide-up"
{ id: "2", name: "Jordan Lee", role: "Documentation Lead", description: "Ensuring every API function is well-documented for developers.", imageSrc: "http://img.b2bpic.net/free-photo/senior-woman-patient-asking-her-physician-about-new-treatment-plan_482257-117646.jpg" }, textboxLayout="default"
{ id: "3", name: "Sam Taylor", role: "Server Expert", description: "Building tools for stable, efficient server modding.", imageSrc: "http://img.b2bpic.net/free-photo/it-operator-prevents-servers-overload_482257-75899.jpg" }, useInvertedBackground={false}
{ id: "4", name: "Jamie Reed", role: "Asset Lead", description: "Managing the massive collection of community mods.", imageSrc: "http://img.b2bpic.net/free-photo/shoulder-view-caucasian-man-using-pc-setup-playing-multiplayer-online-action-game-talking-team-headset-gamer-streaming-fast-paced-space-shooter-while-explaining-gameplay-subscribers_482257-50437.jpg" } />
]} </div>
/>
</div>
<div id="faq" data-section="faq"> <div id="contact" data-section="contact">
<FaqDouble <ContactCenter
title="Fabric Modding FAQ" tag="Connect"
description="Answers to common questions about the Fabric ecosystem." title="Join our Hub"
faqs={[ description="Sign up to stay updated on the latest Fabric developments and news."
{ id: "1", title: "Is Fabric compatible with Forge?", content: "Fabric and Forge are distinct ecosystems. Mods for one will not run natively on the other, though bridges are available." }, background={{ variant: "sparkles-gradient" }}
{ id: "2", title: "How hard is it to switch?", content: "Fabric's modern approach makes it easy to learn for anyone with basic Java skills." }, useInvertedBackground={false}
{ id: "3", title: "Where to download?", content: "Visit the official Fabric website for the latest launcher and installer." } />
]} </div>
faqsAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="contact" data-section="contact"> <div id="footer" data-section="footer">
<ContactCenter <FooterBaseReveal
tag="Connect" logoText="FabricForge"
title="Join our Hub" columns={[
description="Sign up to stay updated on the latest Fabric developments and news." { title: "Fabric", items: [{ label: "Home", href: "#" }, { label: "Download", href: "#" }] },
background={{ variant: "sparkles-gradient" }} { title: "Community", items: [{ label: "Discord", href: "#" }, { label: "Forum", href: "#" }] },
useInvertedBackground={false} { title: "Resources", items: [{ label: "Documentation", href: "#" }, { label: "API Reference", href: "#" }] }
/> ]}
</div> />
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
logoText="FabricForge"
columns={[
{ title: "Fabric", items: [{ label: "Home", href: "#" }, { label: "Download", href: "#" }] },
{ title: "Community", items: [{ label: "Discord", href: "#" }, { label: "Forum", href: "#" }] },
{ title: "Resources", items: [{ label: "Documentation", href: "#" }, { label: "API Reference", href: "#" }] }
]}
/>
</div>
</ReactLenis> </ReactLenis>
</ThemeProvider> </ThemeProvider>
); );
} }