feat(web): add Next.js 14 app with Tailwind CSS

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-02-01 06:10:02 +00:00
parent a5a68cc54d
commit 039c17352b
8 changed files with 221 additions and 0 deletions
--- a/apps/web/app/globals.css
+++ b/apps/web/app/globals.css
@@ -0,0 +1,52 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+:root {
+  /* Primary Colors - Blue */
+  --color-primary-50: #E6EBF2;
+  --color-primary-100: #C2D1E3;
+  --color-primary-200: #9BB4D1;
+  --color-primary-300: #7497BF;
+  --color-primary-400: #5781B2;
+  --color-primary-500: #3A6BA5;
+  --color-primary-600: #2E5A8E;
+  --color-primary-700: #244977;
+  --color-primary-800: #1E3A5F;
+  --color-primary-900: #152A47;
+
+  /* Accent Colors - Green */
+  --color-accent-50: #EEFBF3;
+  --color-accent-100: #D4F5E0;
+  --color-accent-200: #A9EBBC;
+  --color-accent-300: #7EE19A;
+  --color-accent-400: #53D778;
+  --color-accent-500: #22C55E;
+  --color-accent-600: #1CA04C;
+  --color-accent-700: #167A3A;
+  --color-accent-800: #105528;
+  --color-accent-900: #0A2F16;
+
+  /* Background and Foreground */
+  --background: #ffffff;
+  --foreground: #171717;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --background: #0a0a0a;
+    --foreground: #ededed;
+  }
+}
+
+body {
+  color: var(--foreground);
+  background: var(--background);
+  font-family: "Inter", sans-serif;
+}
+
+@layer base {
+  html {
+    @apply antialiased;
+  }
+}
--- a/apps/web/app/layout.tsx
+++ b/apps/web/app/layout.tsx
@@ -0,0 +1,24 @@
+import type { Metadata } from "next";
+import { Inter } from "next/font/google";
+import "./globals.css";
+
+const inter = Inter({ subsets: ["latin"] });
+
+export const metadata: Metadata = {
+  title: "Padel Pro",
+  description: "Sistema de Gestión para Clubes de Pádel",
+  keywords: ["padel", "club", "reservas", "gestión", "deportes"],
+  authors: [{ name: "Padel Pro Team" }],
+};
+
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <html lang="es">
+      <body className={inter.className}>{children}</body>
+    </html>
+  );
+}
--- a/apps/web/app/page.tsx
+++ b/apps/web/app/page.tsx
@@ -0,0 +1,30 @@
+import Link from "next/link";
+
+export default function Home() {
+  return (
+    <main className="min-h-screen flex flex-col items-center justify-center bg-gradient-to-br from-primary-50 to-primary-100">
+      <div className="text-center space-y-8 px-4">
+        <h1 className="text-5xl md:text-6xl font-bold text-primary-800">
+          Padel Pro
+        </h1>
+        <p className="text-xl md:text-2xl text-primary-600 max-w-2xl mx-auto">
+          Sistema de Gestion para Clubes de Padel
+        </p>
+        <div className="flex flex-col sm:flex-row gap-4 justify-center mt-8">
+          <Link
+            href="/dashboard"
+            className="px-8 py-3 bg-primary-800 text-white font-semibold rounded-lg hover:bg-primary-700 transition-colors duration-200 shadow-lg hover:shadow-xl"
+          >
+            Dashboard
+          </Link>
+          <Link
+            href="/reservas"
+            className="px-8 py-3 bg-accent-500 text-white font-semibold rounded-lg hover:bg-accent-600 transition-colors duration-200 shadow-lg hover:shadow-xl"
+          >
+            Reservas
+          </Link>
+        </div>
+      </div>
+    </main>
+  );
+}