Compare commits
5 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 9370d9173a | |||
| c7ae348cd8 | |||
| d245e0ffdb | |||
| 41b34f98a3 | |||
| 18c03e63ab |
271
src/app/page.tsx
271
src/app/page.tsx
@@ -7,10 +7,11 @@ import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||||
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
|
||||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
||||
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
|
||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import SplitAbout from '@/components/sections/about/SplitAbout';
|
||||
import TeamCardTwo from '@/components/sections/team/TeamCardTwo';
|
||||
import { BarChart2, Edit3, Zap } from "lucide-react";
|
||||
import { BarChart2, Edit3, Zap, BrainCircuit } from "lucide-react";
|
||||
|
||||
export default function GamingPage() {
|
||||
return (
|
||||
@@ -27,138 +28,156 @@ export default function GamingPage() {
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "Getting Started", id: "hero" },
|
||||
{ name: "Fabric Features", id: "features" },
|
||||
{ name: "Modding API", id: "about" },
|
||||
{ name: "Community", id: "team" }
|
||||
]}
|
||||
brandName="FabricForge"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "Getting Started", id: "hero" },
|
||||
{ name: "Fabric Features", id: "features" },
|
||||
{ name: "Mod Idea Guide", id: "mod-guide" },
|
||||
{ name: "Community", id: "team" }
|
||||
]}
|
||||
brandName="FabricForge"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
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."
|
||||
buttons={[
|
||||
{ text: "Get Started", href: "#features" },
|
||||
{ text: "View Docs", href: "#contact" }
|
||||
]}
|
||||
carouselItems={[
|
||||
{ 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: "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: "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" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="Master the Fabric Modding Ecosystem"
|
||||
description="Reduce mod development time by 50% with our lightweight, high-performance toolkit. Join the thriving Fabric community and start creating your own game experience today."
|
||||
buttons={[
|
||||
{ text: "Get Started", href: "#features" },
|
||||
{ text: "View Docs", href: "#contact" }
|
||||
]}
|
||||
carouselItems={[
|
||||
{ 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: "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: "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" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
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."
|
||||
bulletPoints={[
|
||||
{ title: "Blazing Fast Updates", description: "Fabric updates almost instantly with new game snapshots." },
|
||||
{ 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." }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-gamer-playing-computer_23-2149829145.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
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."
|
||||
bulletPoints={[
|
||||
{ title: "Blazing Fast Updates", description: "Fabric updates almost instantly with new game snapshots." },
|
||||
{ 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." }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-gamer-playing-computer_23-2149829145.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Advanced Mod Loader", description: "Lightning-fast load times for all your custom modifications.", icon: Zap,
|
||||
mediaItems: [
|
||||
{ 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" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/person-working-animation-porject_23-2149269912.jpg" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Voxel Rendering API", description: "State-of-the-art rendering tools for custom biomes and structures.", icon: Edit3,
|
||||
mediaItems: [
|
||||
{ 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="mod-guide" data-section="mod-guide">
|
||||
<MetricCardTwo
|
||||
title="Mod Idea Brainstorming Guide"
|
||||
description="Turn your spark of an idea into a fully-fledged Minecraft mod with our interactive workflow."
|
||||
tag="Innovation"
|
||||
tagIcon={BrainCircuit}
|
||||
animationType="slide-up"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ 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." }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardTwo
|
||||
animationType="slide-up"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Core Contributors"
|
||||
description="Meet the passionate individuals keeping the Fabric ecosystem healthy and thriving."
|
||||
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" },
|
||||
{ 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" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Advanced Mod Loader", description: "Lightning-fast load times for all your custom modifications.", icon: Zap,
|
||||
mediaItems: [
|
||||
{ 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" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/person-working-animation-porject_23-2149269912.jpg" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Voxel Rendering API", description: "State-of-the-art rendering tools for custom biomes and structures.", icon: Edit3,
|
||||
mediaItems: [
|
||||
{ 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="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
title="Fabric Modding FAQ"
|
||||
description="Common questions about the Fabric toolchain."
|
||||
faqs={[
|
||||
{ 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." },
|
||||
{ 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." },
|
||||
{ id: "3", title: "Where to download?", content: "Visit the official Fabric website for the latest launcher and installer." }
|
||||
]}
|
||||
faqsAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardTwo
|
||||
animationType="slide-up"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
title="Core Contributors"
|
||||
description="Meet the passionate individuals keeping the Fabric ecosystem healthy and thriving."
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
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" },
|
||||
{ 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" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
tag="Connect"
|
||||
title="Join our Hub"
|
||||
description="Sign up to stay updated on the latest Fabric developments and news."
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
title="Fabric Modding FAQ"
|
||||
description="Answers to common questions about the Fabric ecosystem."
|
||||
faqs={[
|
||||
{ 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." },
|
||||
{ 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." },
|
||||
{ id: "3", title: "Where to download?", content: "Visit the official Fabric website for the latest launcher and installer." }
|
||||
]}
|
||||
faqsAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</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>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
tag="Connect"
|
||||
title="Join our Hub"
|
||||
description="Sign up to stay updated on the latest Fabric developments and news."
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</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>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user