Skip to content

Commit ef06f34

Browse files
TesslaRayTesslaRay
committed
cambios
1 parent 712eaab commit ef06f34

File tree

2 files changed

+131
-9
lines changed

2 files changed

+131
-9
lines changed

‎.github/workflows/deploy-vercel.yml‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
name: Vercel Production Deployment
2+
env:
3+
VERCEL_ORG_ID: ${{ secrets.ORG_ID }}
4+
VERCEL_PROJECT_ID: ${{ secrets.PROJECT_ID }}
5+
on:
6+
push:
7+
branches:
8+
- main
9+
paths:
10+
- "frontend/**"
11+
jobs:
12+
Deploy-Production:
13+
runs-on: ubuntu-latest
14+
steps:
15+
- uses: actions/checkout@v2
16+
- name: Install Vercel CLI
17+
run: npm install --global vercel@latest
18+
19+
- name: Pull Vercel Environment Information
20+
run: vercel pull --yes --environment=production --token=${{ secrets.VERCEL_TOKEN }}
21+
22+
- name: Build Project Artifacts
23+
run: vercel build --prod --token=${{ secrets.VERCEL_TOKEN }}
24+
25+
- name: Deploy Project Artifacts to Vercel
26+
run: vercel deploy --prebuilt --prod --token=${{ secrets.VERCEL_TOKEN }}

‎frontend/src/app/page.tsx‎

Lines changed: 105 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,110 @@
11
export default function Home() {
22
return (
3-
<div className="min-h-screen flex items-center justify-center bg-gradient-to-br from-gray-900 to-gray-800">
4-
<div className="text-center">
5-
<h1 className="text-6xl font-bold text-white mb-4 tracking-tight">
6-
Start Prompt
7-
</h1>
8-
<p className="text-gray-400 text-lg">
9-
Tu punto de partida para la innovación
10-
</p>
11-
</div>
3+
<div className="min-h-screen bg-gradient-to-br from-blue-900 to-blue-800">
4+
{/* Header */}
5+
<header className="container mx-auto px-4 py-6">
6+
<nav className="flex justify-between items-center">
7+
<h2 className="text-white text-2xl font-bold">MeJubilo</h2>
8+
<div className="space-x-4">
9+
<button className="text-white hover:text-blue-200 transition-colors">Iniciar Sesión</button>
10+
<button className="bg-white text-blue-900 px-4 py-2 rounded-full hover:bg-blue-100 transition-colors">
11+
Registrarse
12+
</button>
13+
</div>
14+
</nav>
15+
</header>
16+
17+
{/* Hero Section */}
18+
<main className="container mx-auto px-4 py-16">
19+
<div className="max-w-4xl mx-auto text-center space-y-8">
20+
<h1 className="text-7xl font-bold text-white mb-4 tracking-tight">
21+
Simula tu pensión
22+
</h1>
23+
<p className="text-xl text-blue-100 mb-8">
24+
Descubre cuánto podrías recibir en tu jubilación y aprende cómo mejorarla
25+
</p>
26+
27+
{/* Simulator Card */}
28+
<div className="bg-white rounded-2xl p-8 shadow-xl">
29+
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
30+
<div className="space-y-4">
31+
<div>
32+
<label className="block text-gray-700 text-sm font-medium mb-2">
33+
Edad actual
34+
</label>
35+
<input
36+
type="number"
37+
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent"
38+
placeholder="Ej: 45"
39+
/>
40+
</div>
41+
<div>
42+
<label className="block text-gray-700 text-sm font-medium mb-2">
43+
Salario actual
44+
</label>
45+
<input
46+
type="number"
47+
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent"
48+
placeholder="Ej: 3000000"
49+
/>
50+
</div>
51+
</div>
52+
<div className="space-y-4">
53+
<div>
54+
<label className="block text-gray-700 text-sm font-medium mb-2">
55+
Años cotizados
56+
</label>
57+
<input
58+
type="number"
59+
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent"
60+
placeholder="Ej: 15"
61+
/>
62+
</div>
63+
<div>
64+
<label className="block text-gray-700 text-sm font-medium mb-2">
65+
AFP actual
66+
</label>
67+
<select className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent">
68+
<option value="">Selecciona tu AFP</option>
69+
<option value="capital">Capital</option>
70+
<option value="cuprum">Cuprum</option>
71+
<option value="habitat">Habitat</option>
72+
<option value="modelo">Modelo</option>
73+
<option value="planvital">PlanVital</option>
74+
<option value="provida">ProVida</option>
75+
</select>
76+
</div>
77+
</div>
78+
</div>
79+
<button className="w-full mt-8 bg-blue-900 text-white px-8 py-4 rounded-full text-xl font-semibold hover:bg-blue-800 transition-colors duration-300 shadow-lg hover:shadow-xl">
80+
Calcular mi pensión
81+
</button>
82+
</div>
83+
84+
{/* Features Section */}
85+
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 mt-16">
86+
<div className="bg-white/10 backdrop-blur-lg rounded-xl p-6 text-white">
87+
<h3 className="text-xl font-semibold mb-2">Simulación Precisa</h3>
88+
<p className="text-blue-100">Calcula tu pensión estimada con datos reales del mercado</p>
89+
</div>
90+
<div className="bg-white/10 backdrop-blur-lg rounded-xl p-6 text-white">
91+
<h3 className="text-xl font-semibold mb-2">Compara AFPs</h3>
92+
<p className="text-blue-100">Encuentra la mejor AFP para maximizar tu pensión</p>
93+
</div>
94+
<div className="bg-white/10 backdrop-blur-lg rounded-xl p-6 text-white">
95+
<h3 className="text-xl font-semibold mb-2">Recomendaciones</h3>
96+
<p className="text-blue-100">Recibe consejos personalizados para mejorar tu jubilación</p>
97+
</div>
98+
</div>
99+
</div>
100+
</main>
101+
102+
{/* Footer */}
103+
<footer className="container mx-auto px-4 py-8 mt-16 border-t border-blue-800">
104+
<div className="text-center text-blue-200">
105+
<p>© 2024 MeJubilo. Todos los derechos reservados.</p>
106+
</div>
107+
</footer>
12108
</div>
13109
);
14110
}

0 commit comments

Comments
 (0)