feat: add Next.js frontend base structure
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Consultoria AS
59
apps/web/app/globals.css
Normal file
59
apps/web/app/globals.css
Normal file
@@ -0,0 +1,59 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@layer base {
|
||||
:root {
|
||||
--background: 0 0% 100%;
|
||||
--foreground: 222.2 84% 4.9%;
|
||||
--card: 0 0% 100%;
|
||||
--card-foreground: 222.2 84% 4.9%;
|
||||
--primary: 221.2 83.2% 53.3%;
|
||||
--primary-foreground: 210 40% 98%;
|
||||
--secondary: 210 40% 96.1%;
|
||||
--secondary-foreground: 222.2 47.4% 11.2%;
|
||||
--muted: 210 40% 96.1%;
|
||||
--muted-foreground: 215.4 16.3% 46.9%;
|
||||
--accent: 210 40% 96.1%;
|
||||
--accent-foreground: 222.2 47.4% 11.2%;
|
||||
--destructive: 0 84.2% 60.2%;
|
||||
--destructive-foreground: 210 40% 98%;
|
||||
--success: 142.1 76.2% 36.3%;
|
||||
--success-foreground: 355.7 100% 97.3%;
|
||||
--border: 214.3 31.8% 91.4%;
|
||||
--input: 214.3 31.8% 91.4%;
|
||||
--ring: 221.2 83.2% 53.3%;
|
||||
--radius: 0.5rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: 0 0% 3.9%;
|
||||
--foreground: 0 0% 98%;
|
||||
--card: 0 0% 3.9%;
|
||||
--card-foreground: 0 0% 98%;
|
||||
--primary: 187.2 85.7% 53.3%;
|
||||
--primary-foreground: 222.2 84% 4.9%;
|
||||
--secondary: 0 0% 14.9%;
|
||||
--secondary-foreground: 0 0% 98%;
|
||||
--muted: 0 0% 14.9%;
|
||||
--muted-foreground: 0 0% 63.9%;
|
||||
--accent: 0 0% 14.9%;
|
||||
--accent-foreground: 0 0% 98%;
|
||||
--destructive: 0 62.8% 30.6%;
|
||||
--destructive-foreground: 0 0% 98%;
|
||||
--success: 142.1 70.6% 45.3%;
|
||||
--success-foreground: 144.9 80.4% 10%;
|
||||
--border: 0 0% 14.9%;
|
||||
--input: 0 0% 14.9%;
|
||||
--ring: 187.2 85.7% 53.3%;
|
||||
}
|
||||
}
|
||||
|
||||
@layer base {
|
||||
* {
|
||||
@apply border-border;
|
||||
}
|
||||
body {
|
||||
@apply bg-background text-foreground;
|
||||
}
|
||||
}
|
||||
22
apps/web/app/layout.tsx
Normal file
22
apps/web/app/layout.tsx
Normal file
@@ -0,0 +1,22 @@
|
||||
import type { Metadata } from 'next';
|
||||
import { Inter } from 'next/font/google';
|
||||
import './globals.css';
|
||||
|
||||
const inter = Inter({ subsets: ['latin'] });
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: 'Horux360 - Análisis Financiero',
|
||||
description: 'Plataforma de análisis financiero y gestión fiscal para empresas mexicanas',
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
}: {
|
||||
children: React.ReactNode;
|
||||
}) {
|
||||
return (
|
||||
<html lang="es">
|
||||
<body className={inter.className}>{children}</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
61
apps/web/app/page.tsx
Normal file
61
apps/web/app/page.tsx
Normal file
@@ -0,0 +1,61 @@
|
||||
import Link from 'next/link';
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<main className="min-h-screen bg-gradient-to-b from-background to-muted">
|
||||
<nav className="container mx-auto px-4 py-6 flex justify-between items-center">
|
||||
<div className="text-2xl font-bold text-primary">Horux360</div>
|
||||
<div className="flex gap-4">
|
||||
<Link
|
||||
href="/login"
|
||||
className="px-4 py-2 text-foreground hover:text-primary transition"
|
||||
>
|
||||
Iniciar Sesión
|
||||
</Link>
|
||||
<Link
|
||||
href="/register"
|
||||
className="px-4 py-2 bg-primary text-primary-foreground rounded-lg hover:opacity-90 transition"
|
||||
>
|
||||
Comenzar Gratis
|
||||
</Link>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<section className="container mx-auto px-4 py-20 text-center">
|
||||
<h1 className="text-5xl font-bold mb-6">
|
||||
Controla tus finanzas con{' '}
|
||||
<span className="text-primary">inteligencia</span>
|
||||
</h1>
|
||||
<p className="text-xl text-muted-foreground mb-8 max-w-2xl mx-auto">
|
||||
La plataforma de análisis financiero para empresas mexicanas más moderna.
|
||||
Dashboard en tiempo real, control de IVA/ISR, y mucho más.
|
||||
</p>
|
||||
<Link
|
||||
href="/register"
|
||||
className="inline-block px-8 py-4 bg-primary text-primary-foreground rounded-lg text-lg font-semibold hover:opacity-90 transition"
|
||||
>
|
||||
Prueba gratis 14 días
|
||||
</Link>
|
||||
</section>
|
||||
|
||||
<section className="container mx-auto px-4 py-16">
|
||||
<div className="grid md:grid-cols-4 gap-8">
|
||||
{[
|
||||
{ title: 'Dashboard', desc: 'KPIs en tiempo real' },
|
||||
{ title: 'Control IVA/ISR', desc: 'Cálculo automático' },
|
||||
{ title: 'Conciliación', desc: 'Bancaria inteligente' },
|
||||
{ title: 'Alertas', desc: 'Fiscales proactivas' },
|
||||
].map((feature) => (
|
||||
<div
|
||||
key={feature.title}
|
||||
className="p-6 bg-card rounded-xl border shadow-sm"
|
||||
>
|
||||
<h3 className="text-lg font-semibold mb-2">{feature.title}</h3>
|
||||
<p className="text-muted-foreground">{feature.desc}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user