225 lines
17 KiB
TypeScript
225 lines
17 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="shift-hover"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="pill"
|
|
contentWidth="small"
|
|
sizing="medium"
|
|
background="floatingGradient"
|
|
cardStyle="gradient-bordered"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{ name: "Home", id: "home" },
|
|
{ name: "Apps", id: "apps" },
|
|
{ name: "Search", id: "search" },
|
|
{ name: "Trending", id: "trending" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
brandName="MiniHub"
|
|
bottomLeftText="Discover Mini Apps"
|
|
bottomRightText="hello@minihub.app"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroOverlay
|
|
title="Discover Mini Apps That Matter"
|
|
description="Explore a curated library of powerful mini-apps designed to boost your productivity. Search, discover, and launch your next essential tool in seconds."
|
|
tag="Mini App Library"
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-modern-sleek-dark-background-with-tech-1772513126252-1a0bb5cb.png"
|
|
imageAlt="Dark tech background with orange accents"
|
|
textPosition="bottom-left"
|
|
showBlur={true}
|
|
showDimOverlay={true}
|
|
buttons={[
|
|
{ text: "Browse All Apps", href: "#apps" },
|
|
{ text: "Submit Your App", href: "#contact" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="apps" data-section="apps">
|
|
<ProductCardFour
|
|
title="Featured Mini Apps"
|
|
description="Trusted by thousands—explore productivity, design, AI, and more in seconds"
|
|
tag="New Additions"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
gridVariant="four-items-2x2-equal-grid"
|
|
animationType="slide-up"
|
|
carouselMode="buttons"
|
|
products={[
|
|
{
|
|
id: "1", name: "TaskFlow Pro", price: "Free", variant: "Productivity • 4.9★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-colorful-mini-app-icon-representing-a--1772513125998-665d1a01.png?_wi=1", imageAlt: "TaskFlow Pro productivity app icon"
|
|
},
|
|
{
|
|
id: "2", name: "WeatherSync", price: "Free", variant: "Weather • 4.7★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-stylized-weather-or-utility-mini-app-i-1772513125549-cfa51aea.png?_wi=1", imageAlt: "WeatherSync weather application icon"
|
|
},
|
|
{
|
|
id: "3", name: "DesignStudio", price: "Pro", variant: "Design • 4.8★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-creative-artistic-mini-app-icon-for-a--1772513126440-5b005a51.png?_wi=1", imageAlt: "DesignStudio creative tools icon"
|
|
},
|
|
{
|
|
id: "4", name: "FinanceTracker", price: "Free", variant: "Finance • 4.6★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-finance-or-analytics-mini-app-icon-cle-1772513125762-3fba0145.png?_wi=1", imageAlt: "FinanceTracker analytics app icon"
|
|
},
|
|
{
|
|
id: "5", name: "ConnectHub", price: "Free", variant: "Communication • 4.9★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-communication-or-social-mini-app-icon--1772513126224-7b287ecc.png?_wi=1", imageAlt: "ConnectHub messaging platform icon"
|
|
},
|
|
{
|
|
id: "6", name: "NoteKeeper", price: "Free", variant: "Notes • 4.5★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-colorful-mini-app-icon-representing-a--1772513125998-665d1a01.png?_wi=2", imageAlt: "NoteKeeper notes app icon"
|
|
},
|
|
{
|
|
id: "7", name: "FocusMode", price: "Premium", variant: "Focus • 4.8★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-stylized-weather-or-utility-mini-app-i-1772513125549-cfa51aea.png?_wi=2", imageAlt: "FocusMode concentration app icon"
|
|
},
|
|
{
|
|
id: "8", name: "DataViz Pro", price: "Pro", variant: "Analytics • 4.7★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-creative-artistic-mini-app-icon-for-a--1772513126440-5b005a51.png?_wi=2", imageAlt: "DataViz Pro visualization tool icon"
|
|
},
|
|
{
|
|
id: "9", name: "TimeShift", price: "Free", variant: "Time Management • 4.6★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-finance-or-analytics-mini-app-icon-cle-1772513125762-3fba0145.png?_wi=2", imageAlt: "TimeShift scheduling app icon"
|
|
},
|
|
{
|
|
id: "10", name: "CodeHelper", price: "Pro", variant: "Development • 4.9★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-communication-or-social-mini-app-icon--1772513126224-7b287ecc.png?_wi=2", imageAlt: "CodeHelper developer tool icon"
|
|
},
|
|
{
|
|
id: "11", name: "HealthHub", price: "Free", variant: "Wellness • 4.7★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-colorful-mini-app-icon-representing-a--1772513125998-665d1a01.png?_wi=3", imageAlt: "HealthHub wellness tracking app icon"
|
|
},
|
|
{
|
|
id: "12", name: "PhotoEdit", price: "Freemium", variant: "Media • 4.8★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-stylized-weather-or-utility-mini-app-i-1772513125549-cfa51aea.png?_wi=3", imageAlt: "PhotoEdit image editing app icon"
|
|
},
|
|
{
|
|
id: "13", name: "VoiceNote", price: "Free", variant: "Audio • 4.5★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-creative-artistic-mini-app-icon-for-a--1772513126440-5b005a51.png?_wi=3", imageAlt: "VoiceNote voice recording app icon"
|
|
},
|
|
{
|
|
id: "14", name: "BudgetMaster", price: "Free", variant: "Finance • 4.9★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-finance-or-analytics-mini-app-icon-cle-1772513125762-3fba0145.png?_wi=3", imageAlt: "BudgetMaster budgeting app icon"
|
|
},
|
|
{
|
|
id: "15", name: "LearnHub", price: "Premium", variant: "Education • 4.8★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-communication-or-social-mini-app-icon--1772513126224-7b287ecc.png?_wi=3", imageAlt: "LearnHub online learning platform icon"
|
|
},
|
|
{
|
|
id: "16", name: "GymTrack", price: "Free", variant: "Fitness • 4.7★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-colorful-mini-app-icon-representing-a--1772513125998-665d1a01.png?_wi=4", imageAlt: "GymTrack fitness tracking app icon"
|
|
},
|
|
{
|
|
id: "17", name: "MusicFlow", price: "Pro", variant: "Music • 4.9★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-stylized-weather-or-utility-mini-app-i-1772513125549-cfa51aea.png?_wi=4", imageAlt: "MusicFlow music streaming app icon"
|
|
},
|
|
{
|
|
id: "18", name: "SecureVault", price: "Freemium", variant: "Security • 4.8★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-creative-artistic-mini-app-icon-for-a--1772513126440-5b005a51.png?_wi=4", imageAlt: "SecureVault password manager icon"
|
|
},
|
|
{
|
|
id: "19", name: "TravelMap", price: "Free", variant: "Travel • 4.6★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-finance-or-analytics-mini-app-icon-cle-1772513125762-3fba0145.png?_wi=4", imageAlt: "TravelMap trip planning app icon"
|
|
},
|
|
{
|
|
id: "20", name: "ChatBot AI", price: "Pro", variant: "AI • 4.9★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-communication-or-social-mini-app-icon--1772513126224-7b287ecc.png?_wi=4", imageAlt: "ChatBot AI conversation app icon"
|
|
},
|
|
{
|
|
id: "21", name: "RecipeHub", price: "Free", variant: "Cooking • 4.7★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-colorful-mini-app-icon-representing-a--1772513125998-665d1a01.png?_wi=5", imageAlt: "RecipeHub recipe management app icon"
|
|
},
|
|
{
|
|
id: "22", name: "PetPal", price: "Free", variant: "Pets • 4.5★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-stylized-weather-or-utility-mini-app-i-1772513125549-cfa51aea.png?_wi=5", imageAlt: "PetPal pet care app icon"
|
|
},
|
|
{
|
|
id: "23", name: "GreenTrack", price: "Free", variant: "Sustainability • 4.8★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-creative-artistic-mini-app-icon-for-a--1772513126440-5b005a51.png?_wi=5", imageAlt: "GreenTrack sustainability tracker icon"
|
|
},
|
|
{
|
|
id: "24", name: "BrandBuilder", price: "Premium", variant: "Marketing • 4.9★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-finance-or-analytics-mini-app-icon-cle-1772513125762-3fba0145.png?_wi=5", imageAlt: "BrandBuilder branding tool icon"
|
|
},
|
|
{
|
|
id: "25", name: "EventFlow", price: "Free", variant: "Events • 4.6★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-communication-or-social-mini-app-icon--1772513126224-7b287ecc.png?_wi=5", imageAlt: "EventFlow event management app icon"
|
|
},
|
|
{
|
|
id: "26", name: "SocialShare", price: "Freemium", variant: "Social • 4.7★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-colorful-mini-app-icon-representing-a--1772513125998-665d1a01.png?_wi=6", imageAlt: "SocialShare content sharing app icon"
|
|
},
|
|
{
|
|
id: "27", name: "JobFinder", price: "Free", variant: "Career • 4.8★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-stylized-weather-or-utility-mini-app-i-1772513125549-cfa51aea.png?_wi=6", imageAlt: "JobFinder job search app icon"
|
|
},
|
|
{
|
|
id: "28", name: "MindfulZen", price: "Pro", variant: "Meditation • 4.9★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-creative-artistic-mini-app-icon-for-a--1772513126440-5b005a51.png?_wi=6", imageAlt: "MindfulZen meditation app icon"
|
|
},
|
|
{
|
|
id: "29", name: "AutoRepair", price: "Free", variant: "Automotive • 4.6★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-finance-or-analytics-mini-app-icon-cle-1772513125762-3fba0145.png?_wi=6", imageAlt: "AutoRepair car maintenance app icon"
|
|
},
|
|
{
|
|
id: "30", name: "SkyWatcher", price: "Free", variant: "Astronomy • 4.8★", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ7gn4Hl5ywhkkbjIHvlvJr7l4/a-communication-or-social-mini-app-icon--1772513126224-7b287ecc.png?_wi=6", imageAlt: "SkyWatcher astronomy app icon"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
tag="Stay Connected"
|
|
title="Get the Latest Updates"
|
|
description="Subscribe to our newsletter to receive exclusive mini-app recommendations, platform updates, and insider tips delivered straight to your inbox."
|
|
background={{ variant: "rotated-rays-animated-grid" }}
|
|
useInvertedBackground={false}
|
|
inputPlaceholder="your@email.com"
|
|
buttonText="Subscribe Now"
|
|
termsText="We respect your inbox. Unsubscribe anytime."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseCard
|
|
logoText="MiniHub"
|
|
columns={[
|
|
{
|
|
title: "Product", items: [
|
|
{ label: "Browse Apps", href: "#apps" },
|
|
{ label: "Featured", href: "#apps" },
|
|
{ label: "Trending", href: "#trending" },
|
|
{ label: "New Apps", href: "#apps" }
|
|
]
|
|
},
|
|
{
|
|
title: "Developer", items: [
|
|
{ label: "Submit App", href: "#contact" },
|
|
{ label: "Documentation", href: "#" },
|
|
{ label: "API Reference", href: "#" },
|
|
{ label: "Guidelines", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "About Us", href: "#" },
|
|
{ label: "Blog", href: "#" },
|
|
{ label: "Careers", href: "#" },
|
|
{ label: "Contact", href: "#contact" }
|
|
]
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" },
|
|
{ label: "Cookie Policy", href: "#" },
|
|
{ label: "Disclaimer", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Social", items: [
|
|
{ label: "Twitter", href: "https://twitter.com" },
|
|
{ label: "GitHub", href: "https://github.com" },
|
|
{ label: "Discord", href: "https://discord.com" },
|
|
{ label: "LinkedIn", href: "https://linkedin.com" }
|
|
]
|
|
}
|
|
]}
|
|
copyrightText="© 2025 MiniHub. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|