Content density fix: Homepage + Dashboard
- Homepage: Reduce card descriptions 60% (20-30 words → 5-8 words) - Homepage: Simplify features from paragraphs to single lines - Homepage: Increase section spacing (space-y-32 → space-y-40) - Homepage: Increase card padding and spacing - Dashboard: Simplify Developer CTA (cut text 50%, removed extra button) - Dashboard: Increase card padding (p-6 → p-8) - Dashboard: Increase grid spacing (gap-4 → gap-6) - Dashboard: Increase section spacing (space-y-8 → space-y-12) All changes on 'content-density-fixes' branch - easy to revert with: git checkout main # restore everything git branch -D content-density-fixes # delete branch
This commit is contained in:
MrPiglr
GitHub
parent
0623521374
commit
859f69a245
2 changed files with 37 additions and 42 deletions
|
|
@ -326,7 +326,7 @@ export default function Dashboard() {
|
|||
return (
|
||||
<Layout>
|
||||
<div className="min-h-screen bg-gradient-to-b from-black via-purple-950/20 to-black">
|
||||
<div className="container mx-auto px-4 sm:px-6 lg:px-8 py-8 lg:py-12 max-w-6xl space-y-8">
|
||||
<div className="container mx-auto px-4 sm:px-6 lg:px-8 py-8 lg:py-12 max-w-6xl space-y-12">
|
||||
{/* Header Section */}
|
||||
<div className="space-y-4 animate-slide-down">
|
||||
<div className="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
|
||||
|
|
@ -413,15 +413,15 @@ export default function Dashboard() {
|
|||
<TabsContent value="realms" className="space-y-6 animate-fade-in">
|
||||
{/* Developer CTA Card */}
|
||||
{user && (
|
||||
<Card className="p-6 bg-gradient-to-br from-primary/10 to-primary/5 border-primary/20 hover:border-primary/40 transition-all">
|
||||
<div className="flex flex-col md:flex-row items-start gap-4">
|
||||
<div className="p-3 bg-primary/20 rounded-lg shrink-0">
|
||||
<Card className="p-8 bg-gradient-to-br from-primary/10 to-primary/5 border-primary/20 hover:border-primary/40 transition-all">
|
||||
<div className="flex flex-col md:flex-row items-start gap-6">
|
||||
<div className="p-4 bg-primary/20 rounded-lg shrink-0">
|
||||
<Code className="w-6 h-6 text-primary" />
|
||||
</div>
|
||||
<div className="flex-1">
|
||||
<h3 className="text-lg font-semibold mb-2">Building with AeThex?</h3>
|
||||
<p className="text-sm text-muted-foreground mb-4">
|
||||
Get API keys, access comprehensive documentation, and explore developer tools to integrate AeThex into your applications.
|
||||
<h3 className="text-xl font-semibold mb-3">Building with AeThex?</h3>
|
||||
<p className="text-base text-muted-foreground mb-6">
|
||||
Get API keys and access developer tools
|
||||
</p>
|
||||
<div className="flex flex-wrap gap-3">
|
||||
<Link to="/dev-platform/dashboard">
|
||||
|
|
@ -432,12 +432,7 @@ export default function Dashboard() {
|
|||
</Link>
|
||||
<Link to="/dev-platform/api-reference">
|
||||
<Button size="sm" variant="outline">
|
||||
View API Docs
|
||||
</Button>
|
||||
</Link>
|
||||
<Link to="/dev-platform/templates">
|
||||
<Button size="sm" variant="outline">
|
||||
Browse Templates
|
||||
View Docs
|
||||
</Button>
|
||||
</Link>
|
||||
</div>
|
||||
|
|
@ -446,7 +441,7 @@ export default function Dashboard() {
|
|||
</Card>
|
||||
)}
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
{ARMS.map((arm) => {
|
||||
const IconComponent = arm.icon;
|
||||
return (
|
||||
|
|
@ -465,7 +460,7 @@ export default function Dashboard() {
|
|||
<Card
|
||||
className={`bg-gradient-to-br ${arm.bgGradient} border transition-all duration-300 h-full hover:shadow-lg hover:shadow-purple-500/20 ${arm.borderColor} cursor-pointer`}
|
||||
>
|
||||
<CardContent className="p-6 space-y-4">
|
||||
<CardContent className="p-8 space-y-6">
|
||||
<div className="flex items-start justify-between">
|
||||
<div className="space-y-1">
|
||||
<div className="flex items-center gap-3">
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@ const ecosystemPillars = [
|
|||
{
|
||||
icon: Boxes,
|
||||
title: "Six Realms",
|
||||
description: "Nexus, GameForge, Foundation, Labs, Corp, and Staff—each with unique APIs and capabilities",
|
||||
description: "Specialized APIs for every use case",
|
||||
href: "/realms",
|
||||
gradient: "from-purple-500 via-purple-600 to-indigo-600",
|
||||
accentColor: "hsl(var(--primary))",
|
||||
|
|
@ -35,7 +35,7 @@ const ecosystemPillars = [
|
|||
{
|
||||
icon: Database,
|
||||
title: "Developer APIs",
|
||||
description: "Comprehensive REST APIs for users, content, achievements, and more",
|
||||
description: "REST APIs for all platforms",
|
||||
href: "/dev-platform/api-reference",
|
||||
gradient: "from-blue-500 via-blue-600 to-cyan-600",
|
||||
accentColor: "hsl(var(--primary))",
|
||||
|
|
@ -43,7 +43,7 @@ const ecosystemPillars = [
|
|||
{
|
||||
icon: Terminal,
|
||||
title: "SDK & Tools",
|
||||
description: "TypeScript SDK, CLI tools, and pre-built templates to ship faster",
|
||||
description: "Ship faster with TypeScript SDK",
|
||||
href: "/dev-platform/quick-start",
|
||||
gradient: "from-cyan-500 via-teal-600 to-emerald-600",
|
||||
accentColor: "hsl(var(--primary))",
|
||||
|
|
@ -51,7 +51,7 @@ const ecosystemPillars = [
|
|||
{
|
||||
icon: Layers,
|
||||
title: "Marketplace",
|
||||
description: "Premium integrations, plugins, and components from the community",
|
||||
description: "Premium plugins & integrations",
|
||||
href: "/dev-platform/marketplace",
|
||||
gradient: "from-emerald-500 via-green-600 to-lime-600",
|
||||
accentColor: "hsl(var(--primary))",
|
||||
|
|
@ -59,7 +59,7 @@ const ecosystemPillars = [
|
|||
{
|
||||
icon: Users,
|
||||
title: "Community",
|
||||
description: "Join 12,000+ developers building on AeThex",
|
||||
description: "12K+ developers building together",
|
||||
href: "/community",
|
||||
gradient: "from-amber-500 via-orange-600 to-red-600",
|
||||
accentColor: "hsl(var(--primary))",
|
||||
|
|
@ -67,7 +67,7 @@ const ecosystemPillars = [
|
|||
{
|
||||
icon: Trophy,
|
||||
title: "Opportunities",
|
||||
description: "Get paid to build—contracts, bounties, and commissions",
|
||||
description: "Get paid to build",
|
||||
href: "/opportunities",
|
||||
gradient: "from-pink-500 via-rose-600 to-red-600",
|
||||
accentColor: "hsl(var(--primary))",
|
||||
|
|
@ -84,33 +84,33 @@ const stats = [
|
|||
const features = [
|
||||
{
|
||||
icon: Layers,
|
||||
title: "Cross-Platform Integration Layer",
|
||||
description: "One unified API to build across Roblox, VRChat, RecRoom, Spatial, Decentraland, The Sandbox, Minecraft, Meta Horizon, Fortnite, and Zepeto—no more managing separate platform SDKs or gated gardens",
|
||||
title: "Cross-Platform Integration",
|
||||
description: "One API for all metaverse platforms",
|
||||
},
|
||||
{
|
||||
icon: Code2,
|
||||
title: "Enterprise-Grade Developer Tools",
|
||||
description: "TypeScript SDK, REST APIs, unified authentication, cross-platform achievements, content delivery, and CLI tools—all integrated and production-ready",
|
||||
title: "Enterprise Developer Tools",
|
||||
description: "Production-ready SDK and APIs",
|
||||
},
|
||||
{
|
||||
icon: Gamepad2,
|
||||
title: "Six Specialized Realms",
|
||||
description: "Nexus (social hub), GameForge (games), Foundation (education), Labs (AI/innovation), Corp (business), Staff (governance)—each with unique APIs and tools",
|
||||
description: "Unique APIs for every use case",
|
||||
},
|
||||
{
|
||||
icon: Trophy,
|
||||
title: "Monetize Your Skills",
|
||||
description: "Get paid to build—access contracts, bounties, and commissions. 12K+ developers earning while creating cross-platform games, apps, and integrations",
|
||||
description: "12K+ developers earning on AeThex",
|
||||
},
|
||||
{
|
||||
icon: Users,
|
||||
title: "Thriving Creator Economy",
|
||||
description: "Join squads, collaborate on projects, share assets in the marketplace that work across all platforms, and grow your reputation across all six realms",
|
||||
title: "Creator Economy",
|
||||
description: "Collaborate and grow your reputation",
|
||||
},
|
||||
{
|
||||
icon: Rocket,
|
||||
title: "Ship Everywhere, Fast",
|
||||
description: "150+ cross-platform code examples, pre-built templates for VRChat, RecRoom, Spatial, Decentraland, The Sandbox, Roblox, and more—OAuth integration, Supabase backend, and one-command deployment to every metaverse",
|
||||
title: "Ship Fast",
|
||||
description: "150+ examples and one-click deployment",
|
||||
},
|
||||
];
|
||||
|
||||
|
|
@ -216,7 +216,7 @@ export default function Index() {
|
|||
<div className="absolute bottom-0 right-0 w-64 h-64 border-b-2 border-r-2 border-primary/30" />
|
||||
</div>
|
||||
|
||||
<div className="relative space-y-32 pb-32">
|
||||
<div className="relative space-y-40 pb-40">
|
||||
<section className="relative min-h-[90vh] flex items-center justify-center overflow-hidden pt-20">
|
||||
<div className="relative text-center max-w-6xl mx-auto space-y-10 px-4">
|
||||
<motion.div
|
||||
|
|
@ -376,19 +376,19 @@ export default function Index() {
|
|||
</motion.div>
|
||||
</section>
|
||||
|
||||
<section className="space-y-12 px-4">
|
||||
<section className="space-y-20 px-4">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.8 }}
|
||||
className="text-center space-y-4"
|
||||
className="text-center space-y-6"
|
||||
>
|
||||
<h2 className="text-5xl md:text-6xl font-black text-primary">
|
||||
The AeThex Ecosystem
|
||||
</h2>
|
||||
<p className="text-xl text-muted-foreground max-w-3xl mx-auto">
|
||||
Six interconnected realms, each with unique capabilities and APIs to power your applications
|
||||
Six interconnected realms with unique APIs
|
||||
</p>
|
||||
</motion.div>
|
||||
|
||||
|
|
@ -449,23 +449,23 @@ export default function Index() {
|
|||
</div>
|
||||
</section>
|
||||
|
||||
<section className="space-y-12 px-4">
|
||||
<section className="space-y-20 px-4">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.8 }}
|
||||
className="text-center space-y-4"
|
||||
className="text-center space-y-6"
|
||||
>
|
||||
<h2 className="text-5xl md:text-6xl font-black text-primary">
|
||||
Why Build on AeThex?
|
||||
</h2>
|
||||
<p className="text-xl text-muted-foreground max-w-3xl mx-auto">
|
||||
Join a growing ecosystem designed for creators, developers, and entrepreneurs
|
||||
Built for creators and developers
|
||||
</p>
|
||||
</motion.div>
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-8 max-w-6xl mx-auto">
|
||||
<div className="grid md:grid-cols-3 gap-10 max-w-6xl mx-auto">
|
||||
{features.map((feature, index) => (
|
||||
<motion.div
|
||||
key={feature.title}
|
||||
|
|
@ -474,13 +474,13 @@ export default function Index() {
|
|||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6, delay: index * 0.2 }}
|
||||
>
|
||||
<Card className="p-8 space-y-6 backdrop-blur-xl bg-background/50 border-primary/20 hover:border-primary/40 hover:scale-105 transition-all duration-300 h-full">
|
||||
<Card className="p-10 space-y-8 backdrop-blur-xl bg-background/50 border-primary/20 hover:border-primary/40 hover:scale-105 transition-all duration-300 h-full">
|
||||
<div className="w-16 h-16 rounded-2xl bg-primary flex items-center justify-center shadow-2xl shadow-primary/50">
|
||||
<feature.icon className="w-8 h-8 text-primary-foreground" />
|
||||
</div>
|
||||
<div className="space-y-3">
|
||||
<div className="space-y-4">
|
||||
<h3 className="text-2xl font-bold">{feature.title}</h3>
|
||||
<p className="text-muted-foreground leading-relaxed">
|
||||
<p className="text-lg text-muted-foreground">
|
||||
{feature.description}
|
||||
</p>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue