feat(web): add Next.js 14 app with Tailwind CSS
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Ivan
52
apps/web/app/globals.css
Normal file
52
apps/web/app/globals.css
Normal file
@@ -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;
|
||||
}
|
||||
}
|
||||
24
apps/web/app/layout.tsx
Normal file
24
apps/web/app/layout.tsx
Normal file
@@ -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>
|
||||
);
|
||||
}
|
||||
30
apps/web/app/page.tsx
Normal file
30
apps/web/app/page.tsx
Normal file
@@ -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>
|
||||
);
|
||||
}
|
||||
10
apps/web/next.config.js
Normal file
10
apps/web/next.config.js
Normal file
@@ -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;
|
||||
26
apps/web/package.json
Normal file
26
apps/web/package.json
Normal file
@@ -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"
|
||||
}
|
||||
}
|
||||
6
apps/web/postcss.config.js
Normal file
6
apps/web/postcss.config.js
Normal file
@@ -0,0 +1,6 @@
|
||||
module.exports = {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
};
|
||||
47
apps/web/tailwind.config.ts
Normal file
47
apps/web/tailwind.config.ts
Normal file
@@ -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;
|
||||
26
apps/web/tsconfig.json
Normal file
26
apps/web/tsconfig.json
Normal file
@@ -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"]
|
||||
}
|
||||
Reference in New Issue
Block a user