Skip to content

Commit 58f7a5a

Browse files
MariferVLMariferVL
committed
Adapt components colors
1 parent deb9932 commit 58f7a5a

9 files changed

Lines changed: 89 additions & 71 deletions

File tree

‎src/app/globals.css‎

Lines changed: 38 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,16 @@
1010
*/
1111

1212
:root {
13-
--primary-green: #3D8B37; /* Cuerpo de la serpiente */
14-
--accent-yellow: #FFE141; /* Panza en tono intermedio */
15-
--text-white: #FFFFFF; /* Texto principal */
16-
--outline-red: #F23939; /* Contorno del texto en tono intermedio */
17-
--bg-dark: #101010; /* Fondo oscuro intermedio */
13+
--primary-green: #3D8B37;
14+
/* Cuerpo de la serpiente */
15+
--accent-yellow: #FFE141;
16+
/* Panza en tono intermedio */
17+
--text-white: #FFFFFF;
18+
/* Texto principal */
19+
--outline-red: #F23939;
20+
/* Contorno del texto en tono intermedio */
21+
--bg-dark: #101010;
22+
/* Fondo oscuro intermedio */
1823
}
1924

2025
body {
@@ -24,25 +29,25 @@ body {
2429

2530
/* Gradiente con tránsito moderado entre los colores */
2631
.gradient-bg {
27-
background: linear-gradient(
28-
135deg,
29-
var(--primary-green) 0%,
30-
var(--accent-yellow) 50%,
31-
var(--outline-red) 100%
32-
);
32+
background: linear-gradient(135deg,
33+
var(--primary-green) 0%,
34+
var(--accent-yellow) 50%,
35+
var(--outline-red) 100%);
3336
background-size: 400% 400%;
3437
animation: gradient 18s ease infinite;
3538
}
3639

3740
@keyframes gradient {
3841
0% {
39-
background-position: 0% 50%;
42+
background-position: 0% 50%;
4043
}
44+
4145
50% {
42-
background-position: 100% 50%;
46+
background-position: 100% 50%;
4347
}
48+
4449
100% {
45-
background-position: 0% 50%;
50+
background-position: 0% 50%;
4651
}
4752
}
4853

@@ -58,21 +63,30 @@ body {
5863

5964
/* Componentes reutilizables */
6065
@layer components {
66+
6167
.btn-primary {
62-
@apply px-6 py-3 bg-green-700 hover:bg-green-800 text-white font-bold rounded-full transition-all duration-300 shadow-lg hover:shadow-xl hover:-translate-y-1;
68+
@apply px-6 py-3 bg-transparent border-2 text-white font-bold rounded-full transition duration-300 ease-in-out shadow-lg hover:shadow-xl hover:-translate-y-1;
69+
border-color: var(--primary-green);
6370
}
64-
71+
72+
.btn-primary:hover {
73+
background-color: var(--primary-green);
74+
color: var(--text-white);
75+
}
76+
6577
.btn-secondary {
66-
@apply px-6 py-3 bg-transparent border-2 border-white hover:bg-white/20 text-white font-bold rounded-full transition-all duration-300 shadow-lg hover:shadow-xl hover:-translate-y-1;
78+
@apply px-6 py-3 bg-transparent border-2 border-white text-white font-bold rounded-full transition-all duration-300 shadow-lg hover:shadow-xl hover:-translate-y-1;
6779
}
68-
80+
81+
.btn-secondary:hover {
82+
@apply bg-white/20;
83+
}
84+
6985
.section-title {
70-
@apply text-3xl md:text-4xl font-bold mb-6 text-center;
86+
@apply text-3xl md:text-4xl font-bold mb-6 text-center;
7187
}
72-
88+
7389
.container-py {
74-
@apply max-w-7xl mx-auto px-4 py-12 sm:px-6 lg:px-8;
90+
@apply max-w-7xl mx-auto px-4 py-12 sm:px-6 lg:px-8;
7591
}
76-
}
77-
78-
92+
}

‎src/app/page.js‎

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ export default function Home() {
5858
</HeroSection>
5959

6060
{/* Ciudades / Mapa Section */}
61-
<section id="ciudades" className="container-py">
61+
<section id="ciudades" className="container-py mt-8">
6262
<h2 className="section-title">Sedes PyDay 2025</h2>
6363
<ChileMap cities={cities} />
6464
</section>
@@ -73,7 +73,7 @@ export default function Home() {
7373
))}
7474
</div>
7575
) : (
76-
<div className="bg-black/20 backdrop-blur-sm rounded-lg p-6 md:p-8 max-w-2xl mx-auto mt-8 text-center">
76+
<div className="backdrop-blur-sm rounded-lg p-6 md:p-8 max-w-2xl mx-auto mt-8 text-center">
7777
<div className="w-16 h-16 md:w-20 md:h-20 bg-purple-700 rounded-full flex items-center justify-center mx-auto mb-4">
7878
<svg
7979
xmlns="http://www.w3.org/2000/svg"
@@ -130,13 +130,13 @@ export default function Home() {
130130
{/* Registro Section */}
131131
<section id="registro" className="container-py">
132132
<h2 className="section-title">Regístrate</h2>
133-
<div className="max-w-xl mx-auto">
133+
<div className="max-w-xl mx-auto px-13">
134134
<RegistrationForm />
135135
</div>
136136
</section>
137137

138138
{/* Acerca de PyDay */}
139-
<section className="container-py bg-black/20 backdrop-blur">
139+
<section className="container-py backdrop-blur">
140140
<div className="max-w-4xl mx-auto text-center">
141141
<h2 className="section-title">¿Qué es PyDay?</h2>
142142
<p className="text-lg leading-relaxed">
@@ -149,7 +149,7 @@ export default function Home() {
149149
charlas inspiradoras, talleres prácticos y hackatones, éste día es
150150
para colaborar y disfrutar de un ambiente lleno de entusiasmo.
151151
</p>
152-
<div className="mt-8 inline-block px-8 py-3 border-2 border-white rounded-full font-bold text-lg">
152+
<div className="mt-8 inline-block px-8 py-3 bg-transparent text-white font-bold text-xl cursor-default">
153153
Evento 100% Gratuito
154154
</div>
155155
</div>
@@ -158,8 +158,7 @@ export default function Home() {
158158
{/* Patrocinadores Section - Versión Simplificada */}
159159
<section id="patrocinadores" className="container-py">
160160
<h2
161-
className="section-title text-transparent bg-clip-text
162-
bg-gradient-to-r from-green-400 to-white font-bold
161+
className="section-title font-bold
163162
tracking-wider text-4xl mb-0"
164163
>
165164
Nuestros Patrocinadores

‎src/app/sponsors/components/DynamicContent.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
import { motion } from "framer-motion";
33
import SponsorList from "./SponsorList";
44
import SponsorshipPlans from "./SponsorshipPlans";
5-
import SponsorForm from "@/components/SponsorForm";
5+
import SponsorForm from "@/app/sponsors/components/SponsorForm";
66
import CTAFinal from "@/components/CTAFinal";
77
import FAQSection from "@/components/FAQSection";
88
import { sponsorshipFAQs } from "@/data/faqs";

src/components/SponsorForm.js renamed to src/app/sponsors/components/SponsorForm.js

File renamed without changes.

‎src/app/sponsors/components/SponsorList.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
"use client";
22
import { useEffect, useState } from "react";
33
import { motion } from "framer-motion";
4-
import SponsorLogo from "@/components/SponsorLogo";
4+
import SponsorLogo from "@/app/sponsors/components/SponsorLogo";
55
import mockSponsors from "@/data/sponsors";
66

77
export default function SponsorList() {

src/components/SponsorLogo.js renamed to src/app/sponsors/components/SponsorLogo.js

File renamed without changes.

‎src/components/CountdownTimer.js‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
'use client';
2-
32
import { useState, useEffect } from 'react';
43

54
export default function CountdownTimer({ targetDate }) {
@@ -39,14 +38,17 @@ export default function CountdownTimer({ targetDate }) {
3938
];
4039

4140
return (
42-
<div className="flex justify-center my-8">
43-
<div className="grid grid-cols-4 gap-2 text-center">
41+
<div className="w-full max-w-3xl mx-auto">
42+
<div className="grid grid-cols-2 sm:grid-cols-4 gap-3 sm:gap-4">
4443
{timeUnits.map((unit, index) => (
45-
<div key={index} className="flex flex-col">
46-
<div className="text-4xl md:text-5xl lg:text-6xl font-bold bg-black/20 backdrop-blur rounded-lg p-4">
44+
<div
45+
key={index}
46+
className="bg-gradient-to-b from-py-green/30 to-py-dark/60 backdrop-blur-sm p-3 sm:p-4 rounded-lg border border-py-green/30 flex flex-col items-center justify-center"
47+
>
48+
<div className="text-2xl sm:text-3xl md:text-4xl font-bold text-py-yellow mb-1">
4749
{String(unit.value).padStart(2, '0')}
4850
</div>
49-
<span className="text-sm mt-1">{unit.label}</span>
51+
<div className="text-xs sm:text-sm text-py-text/80">{unit.label}</div>
5052
</div>
5153
))}
5254
</div>

‎src/components/Header.js‎

Lines changed: 34 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -34,60 +34,64 @@ export default function Header() {
3434
};
3535

3636
return (
37-
<header className="bg-black/30 backdrop-blur-md sticky top-0 z-50">
38-
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
39-
<div className="flex justify-between items-center py-4">
37+
<header className="sticky top-0 z-50 backdrop-blur-md bg-gradient-to-b from-py-dark/90 to-py-dark/80 border-b border-py-green/30">
38+
<div className="container mx-auto px-4 sm:px-6">
39+
<div className="flex items-center justify-between py-4">
4040
<Link href="/" className="flex items-center space-x-2">
41-
<div className="w-12 h-12 relative">
42-
<Image
43-
src="/images/logo.webp"
44-
alt="PyDay Chile Logo"
45-
fill
41+
<div className="relative w-10 h-10">
42+
<Image
43+
src="/images/logo.webp"
44+
alt="PyDay Logo"
45+
width={32}
46+
height={32}
4647
className="object-contain"
4748
/>
4849
</div>
49-
<span className="text-xl font-bold">PyDay Chile 2025</span>
50+
<span className="text-py-text font-bold text-xl tracking-tight">PyDay Chile 2025</span>
5051
</Link>
51-
52+
5253
{/* Menú para móvil */}
53-
<div className="md:hidden">
54+
<div className="block md:hidden">
5455
<button
5556
onClick={() => setIsMenuOpen(!isMenuOpen)}
56-
className="text-white p-2"
57+
className="text-py-text p-2 hover:bg-py-green/20 rounded-md transition-colors"
5758
aria-label={isMenuOpen ? "Cerrar menú" : "Abrir menú"}
5859
>
5960
{isMenuOpen ? (
60-
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
61+
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" className="w-6 h-6">
6162
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
6263
</svg>
6364
) : (
64-
<svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
65+
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" className="w-6 h-6">
6566
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 6h16M4 12h16M4 18h16" />
6667
</svg>
6768
)}
6869
</button>
6970
</div>
70-
71+
7172
{/* Menú para desktop */}
72-
<nav className="hidden md:flex space-x-8">
73-
<Link href="/" className="text-white hover:text-green-400 transition">Inicio</Link>
74-
<Link href="/talks" className="text-white hover:text-green-400 transition">Charlas</Link>
75-
<Link href="/multimedia" className="text-white hover:text-green-400 transition">Multimedia</Link>
76-
<Link href="/previous-editions" className="text-white hover:text-green-400 transition">Ediciones Anteriores</Link>
77-
<Link href="/register" className="text-white bg-green-600 hover:bg-green-700 px-4 py-2 rounded-full transition">Registrarse</Link>
73+
<nav className="hidden md:flex space-x-6 items-center">
74+
<Link href="/" className="text-py-text hover:text-py-yellow transition-colors">Inicio</Link>
75+
<Link href="/talks" className="text-py-text hover:text-py-yellow transition-colors">Charlas</Link>
76+
<Link href="/multimedia" className="text-py-text hover:text-py-yellow transition-colors">Multimedia</Link>
77+
<Link href="/previous-editions" className="text-py-text hover:text-py-yellow transition-colors">Ediciones Anteriores</Link>
78+
<Link href="/register" className="px-4 py-2 bg-py-green text-py-text hover:bg-py-green/80 transition-colors rounded-full font-medium">Registrarse</Link>
7879
</nav>
7980
</div>
80-
81+
8182
{/* Menú móvil desplegable */}
8283
{isMenuOpen && (
83-
<div className="md:hidden py-4" ref={menuRef}>
84-
<div className="flex flex-col space-y-4">
85-
<Link href="/" onClick={handleLinkClick} className="text-white hover:text-green-400 transition">Inicio</Link>
86-
<Link href="/talks" onClick={handleLinkClick} className="text-white hover:text-green-400 transition">Charlas</Link>
87-
<Link href="/multimedia" onClick={handleLinkClick} className="text-white hover:text-green-400 transition">Multimedia</Link>
88-
<Link href="/previous-editions" onClick={handleLinkClick} className="text-white hover:text-green-400 transition">Ediciones Anteriores</Link>
89-
<Link href="/register" onClick={handleLinkClick} className="text-white bg-green-600 hover:bg-green-700 px-4 py-2 rounded-full transition text-center">Registrarse</Link>
90-
</div>
84+
<div
85+
ref={menuRef}
86+
className="md:hidden absolute left-0 right-0 top-full bg-py-dark/95 backdrop-blur-lg border-t border-py-green/30 shadow-lg animate-fadeIn"
87+
>
88+
<nav className="flex flex-col py-3">
89+
<Link href="/" onClick={handleLinkClick} className="px-6 py-3 text-py-text hover:bg-py-green/20 transition-colors">Inicio</Link>
90+
<Link href="/talks" onClick={handleLinkClick} className="px-6 py-3 text-py-text hover:bg-py-green/20 transition-colors">Charlas</Link>
91+
<Link href="/multimedia" onClick={handleLinkClick} className="px-6 py-3 text-py-text hover:bg-py-green/20 transition-colors">Multimedia</Link>
92+
<Link href="/previous-editions" onClick={handleLinkClick} className="px-6 py-3 text-py-text hover:bg-py-green/20 transition-colors">Ediciones Anteriores</Link>
93+
<Link href="/register" onClick={handleLinkClick} className="mx-6 my-3 px-4 py-2 bg-py-green text-py-text hover:bg-py-green/80 transition-colors rounded-full font-medium text-center">Registrarse</Link>
94+
</nav>
9195
</div>
9296
)}
9397
</div>

‎tailwind.config.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
/** @type {import('tailwindcss').Config} */
21
module.exports = {
32
content: [
43
"./src/components/**/*.{js,ts,jsx,tsx,mdx}",
@@ -15,6 +14,6 @@ module.exports = {
1514
},
1615
},
1716
},
18-
darkMode: 'class',
17+
darkMode: 'class',
1918
plugins: [],
2019
};

0 commit comments

Comments
 (0)