refactor: Consolidate global styling with Tailwind and HeroUI theme variables and refactor devtools integration.
This commit is contained in:
@@ -6,7 +6,7 @@ import {
|
||||
Shield,
|
||||
Sparkles,
|
||||
Waves,
|
||||
Zap,
|
||||
Zap
|
||||
} from "lucide-react"
|
||||
|
||||
export const Route = createFileRoute("/")({ component: App })
|
||||
@@ -17,45 +17,45 @@ function App() {
|
||||
icon: <Zap className="w-12 h-12 text-cyan-400" />,
|
||||
title: "Powerful Server Functions",
|
||||
description:
|
||||
"Write server-side code that seamlessly integrates with your client components. Type-safe, secure, and simple.",
|
||||
"Write server-side code that seamlessly integrates with your client components. Type-safe, secure, and simple."
|
||||
},
|
||||
{
|
||||
icon: <Server className="w-12 h-12 text-cyan-400" />,
|
||||
title: "Flexible Server Side Rendering",
|
||||
description:
|
||||
"Full-document SSR, streaming, and progressive enhancement out of the box. Control exactly what renders where.",
|
||||
"Full-document SSR, streaming, and progressive enhancement out of the box. Control exactly what renders where."
|
||||
},
|
||||
{
|
||||
icon: <RouteIcon className="w-12 h-12 text-cyan-400" />,
|
||||
title: "API Routes",
|
||||
description:
|
||||
"Build type-safe API endpoints alongside your application. No separate backend needed.",
|
||||
"Build type-safe API endpoints alongside your application. No separate backend needed."
|
||||
},
|
||||
{
|
||||
icon: <Shield className="w-12 h-12 text-cyan-400" />,
|
||||
title: "Strongly Typed Everything",
|
||||
description:
|
||||
"End-to-end type safety from server to client. Catch errors before they reach production.",
|
||||
"End-to-end type safety from server to client. Catch errors before they reach production."
|
||||
},
|
||||
{
|
||||
icon: <Waves className="w-12 h-12 text-cyan-400" />,
|
||||
title: "Full Streaming Support",
|
||||
description:
|
||||
"Stream data from server to client progressively. Perfect for AI applications and real-time updates.",
|
||||
"Stream data from server to client progressively. Perfect for AI applications and real-time updates."
|
||||
},
|
||||
{
|
||||
icon: <Sparkles className="w-12 h-12 text-cyan-400" />,
|
||||
title: "Next Generation Ready",
|
||||
description:
|
||||
"Built from the ground up for modern web applications. Deploy anywhere JavaScript runs.",
|
||||
},
|
||||
"Built from the ground up for modern web applications. Deploy anywhere JavaScript runs."
|
||||
}
|
||||
]
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-gradient-to-b from-slate-900 via-slate-800 to-slate-900">
|
||||
<div className="min-h-screen bg-linear-to-b from-slate-900 via-slate-800 to-slate-900">
|
||||
<Button> Hola</Button>
|
||||
<section className="relative py-20 px-6 text-center overflow-hidden">
|
||||
<div className="absolute inset-0 bg-gradient-to-r from-cyan-500/10 via-blue-500/10 to-purple-500/10"></div>
|
||||
<div className="absolute inset-0 bg-linear-to-r from-cyan-500/10 via-blue-500/10 to-purple-500/10"></div>
|
||||
<div className="relative max-w-5xl mx-auto">
|
||||
<div className="flex items-center justify-center gap-6 mb-6">
|
||||
<img
|
||||
@@ -63,9 +63,9 @@ function App() {
|
||||
alt="TanStack Logo"
|
||||
className="w-24 h-24 md:w-32 md:h-32"
|
||||
/>
|
||||
<h1 className="text-6xl md:text-7xl font-black text-white [letter-spacing:-0.08em]">
|
||||
<h1 className="text-6xl md:text-7xl font-black text-white tracking-[-0.08em]">
|
||||
<span className="text-gray-300">TANSTACK</span>{" "}
|
||||
<span className="bg-gradient-to-r from-cyan-400 to-blue-400 bg-clip-text text-transparent">
|
||||
<span className="bg-linear-to-r from-cyan-400 to-blue-400 bg-clip-text text-transparent">
|
||||
START
|
||||
</span>
|
||||
</h1>
|
||||
|
||||
Reference in New Issue
Block a user