From 039c17352baf9a7bcd4b83110c557c1b02f7ab1a Mon Sep 17 00:00:00 2001 From: Ivan Date: Sun, 1 Feb 2026 06:10:02 +0000 Subject: [PATCH] feat(web): add Next.js 14 app with Tailwind CSS Co-Authored-By: Claude Opus 4.5 --- apps/web/app/globals.css | 52 +++++++++++++++++++++++++++++++++++++ apps/web/app/layout.tsx | 24 +++++++++++++++++ apps/web/app/page.tsx | 30 +++++++++++++++++++++ apps/web/next.config.js | 10 +++++++ apps/web/package.json | 26 +++++++++++++++++++ apps/web/postcss.config.js | 6 +++++ apps/web/tailwind.config.ts | 47 +++++++++++++++++++++++++++++++++ apps/web/tsconfig.json | 26 +++++++++++++++++++ 8 files changed, 221 insertions(+) create mode 100644 apps/web/app/globals.css create mode 100644 apps/web/app/layout.tsx create mode 100644 apps/web/app/page.tsx create mode 100644 apps/web/next.config.js create mode 100644 apps/web/package.json create mode 100644 apps/web/postcss.config.js create mode 100644 apps/web/tailwind.config.ts create mode 100644 apps/web/tsconfig.json diff --git a/apps/web/app/globals.css b/apps/web/app/globals.css new file mode 100644 index 0000000..a153cd1 --- /dev/null +++ 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; + } +} diff --git a/apps/web/app/layout.tsx b/apps/web/app/layout.tsx new file mode 100644 index 0000000..8f107cf --- /dev/null +++ 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 ( + + {children} + + ); +} diff --git a/apps/web/app/page.tsx b/apps/web/app/page.tsx new file mode 100644 index 0000000..29f6cfd --- /dev/null +++ b/apps/web/app/page.tsx @@ -0,0 +1,30 @@ +import Link from "next/link"; + +export default function Home() { + return ( +
+
+

+ Padel Pro +

+

+ Sistema de Gestion para Clubes de Padel +

+
+ + Dashboard + + + Reservas + +
+
+
+ ); +} diff --git a/apps/web/next.config.js b/apps/web/next.config.js new file mode 100644 index 0000000..a9a2a60 --- /dev/null +++ b/apps/web/next.config.js @@ -0,0 +1,10 @@ +/** @type {import('next').NextConfig} */ +const nextConfig = { + transpilePackages: ["@padel-pro/shared"], + images: { + remotePatterns: [ + { protocol: "https", hostname: "res.cloudinary.com" }, + ], + }, +}; +module.exports = nextConfig; diff --git a/apps/web/package.json b/apps/web/package.json new file mode 100644 index 0000000..36e2f32 --- /dev/null +++ b/apps/web/package.json @@ -0,0 +1,26 @@ +{ + "name": "@padel-pro/web", + "version": "0.1.0", + "private": true, + "scripts": { + "dev": "next dev --port 3000", + "build": "next build", + "start": "next start", + "lint": "next lint", + "type-check": "tsc --noEmit" + }, + "dependencies": { + "next": "14.2.0", + "react": "^18.2.0", + "react-dom": "^18.2.0" + }, + "devDependencies": { + "@types/node": "^20.11.0", + "@types/react": "^18.2.0", + "@types/react-dom": "^18.2.0", + "autoprefixer": "^10.4.17", + "postcss": "^8.4.35", + "tailwindcss": "^3.4.1", + "typescript": "^5.3.3" + } +} diff --git a/apps/web/postcss.config.js b/apps/web/postcss.config.js new file mode 100644 index 0000000..12a703d --- /dev/null +++ b/apps/web/postcss.config.js @@ -0,0 +1,6 @@ +module.exports = { + plugins: { + tailwindcss: {}, + autoprefixer: {}, + }, +}; diff --git a/apps/web/tailwind.config.ts b/apps/web/tailwind.config.ts new file mode 100644 index 0000000..c057922 --- /dev/null +++ b/apps/web/tailwind.config.ts @@ -0,0 +1,47 @@ +import type { Config } from "tailwindcss"; + +const config: Config = { + content: [ + "./pages/**/*.{js,ts,jsx,tsx,mdx}", + "./components/**/*.{js,ts,jsx,tsx,mdx}", + "./app/**/*.{js,ts,jsx,tsx,mdx}", + ], + theme: { + extend: { + colors: { + primary: { + 50: "#E6EBF2", + 100: "#C2D1E3", + 200: "#9BB4D1", + 300: "#7497BF", + 400: "#5781B2", + 500: "#3A6BA5", + 600: "#2E5A8E", + 700: "#244977", + 800: "#1E3A5F", + 900: "#152A47", + DEFAULT: "#1E3A5F", + }, + accent: { + 50: "#EEFBF3", + 100: "#D4F5E0", + 200: "#A9EBBC", + 300: "#7EE19A", + 400: "#53D778", + 500: "#22C55E", + 600: "#1CA04C", + 700: "#167A3A", + 800: "#105528", + 900: "#0A2F16", + DEFAULT: "#22C55E", + }, + }, + fontFamily: { + sans: ["Inter", "sans-serif"], + }, + }, + }, + plugins: [], +}; + +export default config; diff --git a/apps/web/tsconfig.json b/apps/web/tsconfig.json new file mode 100644 index 0000000..e7ff90f --- /dev/null +++ b/apps/web/tsconfig.json @@ -0,0 +1,26 @@ +{ + "compilerOptions": { + "lib": ["dom", "dom.iterable", "esnext"], + "allowJs": true, + "skipLibCheck": true, + "strict": true, + "noEmit": true, + "esModuleInterop": true, + "module": "esnext", + "moduleResolution": "bundler", + "resolveJsonModule": true, + "isolatedModules": true, + "jsx": "preserve", + "incremental": true, + "plugins": [ + { + "name": "next" + } + ], + "paths": { + "@/*": ["./*"] + } + }, + "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"], + "exclude": ["node_modules"] +}