Skip to content

Commit 876135c

Browse files
MariferVLMariferVL
committed
Update components colors
1 parent 2a33f5f commit 876135c

7 files changed

Lines changed: 153 additions & 153 deletions

File tree

‎package-lock.json‎

Lines changed: 10 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@
1515
"next": "^15.3.1",
1616
"react": "^19.0.0",
1717
"react-dom": "^19.0.0",
18+
"react-icons": "^5.5.0",
1819
"sharp": "^0.34.1"
1920
},
2021
"devDependencies": {

‎src/app/globals.css‎

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,8 @@
11
@import "tailwindcss";
22

33
/*
4-
Esquema de color basado en el logo "PYDAY" (versión intermedia):
5-
- Verde (#3D8B37): Color principal, siempre presente.
6-
- Amarillo intermedio (#FFE141): Un tono entre el amarillo vibrante y el pastel, que aporta energía sin ser demasiado intenso.
7-
- Blanco (#FFFFFF): Para el texto principal.
8-
- Rojo intermedio (#F23939): Menos agresivo que el rojo puro pero que ofrece el énfasis necesario.
9-
- Fondo oscuro (#101010): Más suave que un negro absoluto para evitar contrastes excesivos.
4+
Esquema de color basado en el logo "PYDAY".
5+
106
*/
117

128
:root {
@@ -51,7 +47,7 @@ body {
5147
}
5248
}
5349

54-
/* Estilo para el texto del logo con contorno que resalta de forma elegante */
50+
/* Estilo para el texto del logo */
5551
.logo-text {
5652
font-family: sans-serif;
5753
color: var(--text-white);

‎src/app/previous-editions/page.js‎

Lines changed: 37 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,52 @@
1-
import Link from 'next/link';
2-
import Image from 'next/image';
3-
import pastEvents from '@/data/pastEvents';
1+
import Link from "next/link";
2+
import Image from "next/image";
3+
import pastEvents from "@/data/pastEvents";
44

55
export default function PreviousEditionsPage() {
66
return (
7-
<div className="container-py">
7+
<div className="container-py min-h-screen">
88
<h1 className="section-title">Ediciones Anteriores</h1>
9-
9+
1010
<div className="max-w-4xl mx-auto mb-12 text-center">
1111
<p className="text-lg">
12-
Revive los momentos más destacados de las ediciones anteriores de PyDay Chile. Desde su fundación,
13-
este evento ha sido punto de encuentro para la comunidad Python en Chile.
12+
Revive los momentos más destacados de las ediciones anteriores de
13+
PyDay Chile. Desde su fundación, este evento ha sido punto de
14+
encuentro para la comunidad Python en Chile.
1415
</p>
1516
</div>
1617

1718
<div className="space-y-24 mb-12">
1819
{pastEvents.map((event, index) => (
1920
<div key={index} className="event-card">
20-
<div className="relative bg-black/30 backdrop-blur-sm rounded-xl overflow-hidden shadow-xl">
21-
<div className="grid md:grid-cols-2 gap-6">
21+
<div className="relative bg-py-dark/30 backdrop-blur-sm rounded-xl overflow-hidden shadow-xl">
22+
{/* Se fuerza que ambos lados ocupen al menos 20rem y se centran verticalmente */}
23+
<div className="grid md:grid-cols-2 gap-6 items-center min-h-[20rem]">
2224
{/* Imagen del evento */}
23-
<div className="aspect-video relative overflow-hidden">
25+
<div className="relative h-full overflow-hidden">
2426
<Image
2527
src={event.mainImage}
2628
alt={`PyDay Chile ${event.year}`}
2729
fill
28-
className="object-cover"
30+
className="object-cover object-center"
2931
/>
30-
<div className="absolute inset-0 bg-gradient-to-t from-black/70 to-transparent" />
31-
<div className="absolute bottom-4 left-4">
32-
<h2 className="text-3xl font-bold">PyDay {event.year}</h2>
33-
<p className="text-yellow-300 text-lg">{event.cities.join(' • ')}</p>
32+
<div className="absolute inset-0 bg-gradient-to-t from-py-dark/70 to-transparent" />
33+
<div className="absolute bottom-4 inset-x-0 text-center">
34+
<h2 className="text-3xl font-bold text-py-text">
35+
PyDay {event.year}
36+
</h2>
37+
<p className="text-lg text-py-yellow">
38+
{event.cities.join(" • ")}
39+
</p>
3440
</div>
3541
</div>
3642

3743
{/* Información del evento */}
3844
<div className="p-6 flex flex-col justify-between">
3945
<div>
40-
<h3 className="text-2xl font-semibold mb-4">Estadísticas</h3>
41-
<ul className="space-y-2 mb-6">
46+
<h3 className="text-2xl font-semibold mb-4 text-py-text">
47+
Estadísticas
48+
</h3>
49+
<ul className="space-y-2 mb-6 text-py-text">
4250
<li>
4351
<span className="font-medium">Asistentes:</span> {event.attendees}
4452
</li>
@@ -52,32 +60,23 @@ export default function PreviousEditionsPage() {
5260
<span className="font-medium">Fecha:</span> {event.date}
5361
</li>
5462
</ul>
55-
63+
5664
<div className="mt-4">
57-
<h3 className="text-2xl font-semibold mb-2">Highlights</h3>
58-
<p>{event.highlights}</p>
65+
<h3 className="text-2xl font-semibold mb-2 text-py-text">
66+
Highlights
67+
</h3>
68+
<p className="text-py-text">{event.highlights}</p>
5969
</div>
6070
</div>
61-
62-
{/* Enlaces o acciones */}
63-
<div className="mt-6 flex gap-4">
71+
//TODO: mejorar el acceso al año
72+
{/* Botón único para Fotos y Videos */}
73+
{/* <div className="mt-6 flex justify-center">
6474
{event.photosLink && (
65-
<Link
66-
href={event.photosLink}
67-
className="px-4 py-2 bg-purple-600 hover:bg-purple-700 rounded-full text-sm font-medium"
68-
>
69-
Ver Fotos
75+
<Link href={event.photosLink} className="btn-secondary">
76+
Ver Fotos y Videos
7077
</Link>
7178
)}
72-
{event.videosLink && (
73-
<Link
74-
href={event.videosLink}
75-
className="px-4 py-2 bg-green-600 hover:bg-green-700 rounded-full text-sm font-medium"
76-
>
77-
Ver Videos
78-
</Link>
79-
)}
80-
</div>
79+
</div> */}
8180
</div>
8281
</div>
8382
</div>
@@ -86,10 +85,7 @@ export default function PreviousEditionsPage() {
8685
</div>
8786

8887
<div className="text-center">
89-
<Link
90-
href="/multimedia"
91-
className="btn-primary"
92-
>
88+
<Link href="/multimedia" className="btn-primary">
9389
Ver galería multimedia
9490
</Link>
9591
</div>

‎src/components/ChileMap.js‎

Lines changed: 28 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -6,40 +6,49 @@ export default function ChileMap({ cities }) {
66
const [activeCity, setActiveCity] = useState(null);
77

88
return (
9-
// Cambiamos el ancho máximo a max-w-4xl para que el contenedor final sea más angosto.
10-
<div className="mx-auto max-w-4xl px-4">
11-
<div className="flex flex-col md:flex-row items-center gap-4">
12-
{/* Contenedor del mapa */}
9+
<div className="mx-auto max-w-4xl px-4 py-8">
10+
<div className="flex flex-col md:flex-row items-center gap-6">
11+
{/* Contenedor del mapa con mejor contraste y accesibilidad */}
1312
<div className="w-full md:w-1/2 lg:w-1/2">
14-
<div className="aspect-[3/6] lg:aspect-auto lg:h-[400px] w-full bg-white/10 backdrop-blur-sm rounded-lg p-4 relative">
15-
<svg viewBox="0 0 100 300" className="w-full h-full">
13+
<div className="aspect-[3/6] sm:aspect-[3/5] lg:aspect-auto lg:h-[450px] w-full bg-white/5 backdrop-blur-sm rounded-lg p-4 relative shadow-lg border border-white/10">
14+
<svg viewBox="0 0 100 300" className="w-full h-full" aria-label="Mapa de Chile con ciudades">
1615
<g transform="translate(-10,0) scale(1.2,1)">
1716
<path
1817
d="M50,20 Q60,50 55,100 Q50,150 60,200 Q70,250 50,280"
1918
fill="none"
2019
stroke="white"
2120
strokeWidth="2"
22-
className="opacity-50"
21+
className="opacity-60"
2322
/>
2423
{cities.map((city) => (
2524
<g
2625
key={city.slug}
2726
onClick={() => setActiveCity(city.slug)}
2827
className="cursor-pointer"
28+
role="button"
29+
aria-pressed={activeCity === city.slug}
30+
tabIndex="0"
31+
onKeyDown={(e) => {
32+
if (e.key === "Enter" || e.key === " ") {
33+
setActiveCity(city.slug);
34+
}
35+
}}
2936
>
3037
<circle
3138
cx={city.mapCoords.x}
3239
cy={city.mapCoords.y}
3340
r={activeCity === city.slug ? 6 : 4}
34-
fill={activeCity === city.slug ? "#FFD700" : "#8A2BE2"}
41+
fill={activeCity === city.slug ? "#FFE141" : "#3D8B37"}
42+
strokeWidth={activeCity === city.slug ? 2 : 1}
43+
stroke="#FFFFFF"
3544
className="transition-all duration-300"
3645
/>
3746
<text
3847
x={city.mapCoords.x + 8}
3948
y={city.mapCoords.y + 4}
4049
fontSize="8"
4150
fill="white"
42-
className="pointer-events-none"
51+
className="pointer-events-none font-medium"
4352
>
4453
{city.name}
4554
</text>
@@ -50,29 +59,31 @@ export default function ChileMap({ cities }) {
5059
</div>
5160
</div>
5261

53-
{/* Lista de ciudades, centradas verticalmente */}
54-
<div className="w-full md:w-1/2 lg:w-1/2 flex flex-col justify-center space-y-4">
62+
{/* Lista de ciudades, centradas verticalmente con colores mejorados */}
63+
<div className="w-full md:w-1/2 lg:w-1/2 flex flex-col justify-center space-y-3">
5564
{cities.map((city) => (
5665
<Link
5766
href={`/${city.slug}`}
5867
key={city.slug}
59-
className={`block p-4 rounded-lg transition-all duration-300
68+
className={`block p-4 rounded-lg transition-all duration-300
6069
${
6170
activeCity === city.slug
62-
? "bg-purple-700 transform scale-105"
63-
: "bg-black/20 hover:bg-black/30"
71+
? "bg-green-800/80 transform scale-102 border border-green-500/50"
72+
: "bg-black/30 hover:bg-black/40 border border-white/10"
6473
}`}
6574
onMouseEnter={() => setActiveCity(city.slug)}
75+
aria-current={activeCity === city.slug ? "true" : "false"}
6676
>
6777
<div className="flex items-center space-x-3">
6878
<div
6979
className={`w-3 h-3 rounded-full ${
70-
activeCity === city.slug ? "bg-yellow-400" : "bg-purple-500"
80+
activeCity === city.slug ? "bg-yellow-400" : "bg-green-500"
7181
}`}
82+
aria-hidden="true"
7283
></div>
7384
<div>
74-
<h3 className="font-bold">{city.name}</h3>
75-
<p className="text-sm opacity-80">{city.date}</p>
85+
<h3 className="font-bold text-lg">{city.name}</h3>
86+
<p className="text-sm opacity-90">{city.date}</p>
7687
</div>
7788
</div>
7889
</Link>

0 commit comments

Comments
 (0)