Skip to content

Commit 9d32dc3

Browse files
refactor: move communities and talks sections into about
1 parent 2335f66 commit 9d32dc3

File tree

7 files changed

+117
-165
lines changed

7 files changed

+117
-165
lines changed

src/components/CommunityCard.astro

Lines changed: 0 additions & 43 deletions
This file was deleted.

src/components/Header.astro

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -58,14 +58,6 @@ import headerLogo from "../images/headerLogo.png";
5858
About Me
5959
</HeaderLink>
6060
</li>
61-
<li>
62-
<HeaderLink
63-
class="hover:text-slate-500 focus:text-slate-500"
64-
href="/talks"
65-
>
66-
Talks
67-
</HeaderLink>
68-
</li>
6961
<li>
7062
<HeaderLink
7163
class="hover:text-slate-500 focus:text-slate-500"

src/components/WorkReference.astro

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
---
2+
type Props = {
3+
title: string;
4+
url: string;
5+
description: string;
6+
years?: string;
7+
};
8+
9+
const { title, url, description, years } = Astro.props;
10+
---
11+
12+
<li>
13+
<a href={url}>{title}</a>
14+
<span>: {description}</span>
15+
{years && <span>({years})</span>}
16+
</li>

src/images/aboutMeHeader.svg

Lines changed: 1 addition & 0 deletions
Loading

src/pages/about.astro

Lines changed: 97 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,52 @@
11
---
2-
import Container from "../components/Container.astro";
32
import Base from "../layouts/Base.astro";
4-
// import { Image } from "astro:assets";
5-
//
6-
// import aboutImg from "../images/about.png";
3+
import Container from "../components/Container.astro";
4+
import WorkReference from "../components/WorkReference.astro";
5+
6+
import { Image } from "astro:assets";
7+
import { getCollection } from "astro:content";
8+
9+
import "@fontsource/montserrat/900.css";
10+
import miniAvatar from "../images/aboutMeHeader.svg";
11+
12+
const communities = await getCollection("communities");
13+
communities.sort((a, b) => {
14+
const startDiff = b.data.years.start - a.data.years.start;
15+
if (startDiff != 0) return startDiff;
16+
17+
let aEnd;
18+
let bEnd;
19+
if (a.data.years.end == "Actual") aEnd = 9999;
20+
else aEnd = a.data.years.end;
21+
if (b.data.years.end == "Actual") bEnd = 9999;
22+
else bEnd = b.data.years.end;
23+
24+
return +bEnd - +aEnd;
25+
});
26+
27+
const talks = await getCollection("talks");
28+
talks.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf());
29+
30+
const conf = {
31+
title: "Conferencias",
32+
items: talks.filter(({ data }) => data.kind == "Conference"),
33+
};
34+
const pane = {
35+
title: "Paneles Y Podcasts",
36+
items: talks.filter(({ data }) => data.kind == "Panel"),
37+
};
38+
const meet = {
39+
title: "Entrevistas Y Meetups",
40+
items: talks.filter(({ data }) => data.kind == "Meetup"),
41+
};
742
---
843

944
<Base title="About Me" description="Sobre mi">
1045
<main>
1146
<Container class="prose prose-xl" usePy={false}>
12-
<h1 class="pt-3 text-center text-4xl">Sobre mi</h1>
13-
<div class="flex justify-center gap-10">
14-
<!-- FIXME: Doesn't work correctly -->
15-
<!-- <Image -->
16-
<!-- class="hidden xl:block w-[650px]" -->
17-
<!-- src={aboutImg} -->
18-
<!-- width={600} -->
19-
<!-- alt="" -->
20-
<!-- /> -->
21-
<section class="max-w-[75ch] sm:text-justify">
47+
<section>
48+
<Image class="m-0 mb-12" src={miniAvatar} alt="Denny's Avatar" />
49+
<div class="sm:text-justify">
2250
<p>
2351
Soy Denny Pérez, Analista de Calidad de Software en <a
2452
href="https://nventive.com/en/">Nventive</a
@@ -66,13 +94,61 @@ import Base from "../layouts/Base.astro";
6694
inclusivo y colaborativo, tanto en la tecnología como en
6795
la vida cotidiana.
6896
</p>
69-
<p>
70-
Aqui puedes ver el <a href="/#comunidades"
71-
>trabajo comunitario</a
72-
> en el que he estado involucrada.
73-
</p>
74-
</section>
75-
</div>
97+
</div>
98+
</section>
99+
<section>
100+
<a class="no-underline" href="#comunidades" name="comunidades">
101+
<h2 class="text-center font-['Montserrat'] text-4xl">
102+
Comunidades
103+
</h2>
104+
</a>
105+
<p class="prose-xl mx-auto pb-4 text-center sm:text-left">
106+
He tenido el privilegio de colaborar activamente con
107+
diversas comunidades tecnológicas que comparten mi pasión
108+
por el aprendizaje, la inclusión y la colaboración. Estas
109+
experiencias han sido clave para mi desarrollo profesional,
110+
permitiéndome contribuir como mentora, organizadora y
111+
defensora de iniciativas que fortalecen nuestras
112+
comunidades.
113+
</p>
114+
<ul>
115+
{
116+
communities.map(
117+
({ id: title, data: { url, role, years } }) => (
118+
<WorkReference
119+
title={title}
120+
url={url}
121+
description={role}
122+
years={`${years.start}`}
123+
/>
124+
),
125+
)
126+
}
127+
</ul>
128+
</section>
129+
<section>
130+
<h2 class="text-center font-['Montserrat'] text-4xl">
131+
Charlas Y Eventos
132+
</h2>
133+
{
134+
[conf, pane, meet].map((talks) => (
135+
<>
136+
<h3 class="font-['Montserrat']">{talks.title}</h3>
137+
<ul>
138+
{talks.items.map(
139+
({ id: title, data: { url, place } }) => (
140+
<WorkReference
141+
title={title}
142+
url={url}
143+
description={place}
144+
/>
145+
),
146+
)}
147+
</ul>
148+
</>
149+
))
150+
}
151+
</section>
76152
</Container>
77153
</main>
78154
</Base>

src/pages/index.astro

Lines changed: 3 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,14 @@
11
---
22
import Container from "../components/Container.astro";
3-
import CommunityCard from "../components/CommunityCard.astro";
43
import Base from "../layouts/Base.astro";
54
import { SITE_TITLE } from "../consts";
65
76
import { Image } from "astro:assets";
8-
import { getCollection } from "astro:content";
97
108
import "@fontsource/montserrat/900.css";
119
import heroAvatar from "../images/heroAvatar.jpg";
1210
import miniAvatar from "../images/miniAvatar.png";
1311
14-
const communities = (await getCollection("communities")).sort((a, b) => {
15-
const startDiff = b.data.years.start - a.data.years.start;
16-
if (startDiff != 0) return startDiff;
17-
18-
let aEnd;
19-
let bEnd;
20-
if (a.data.years.end == "Actual") aEnd = 9999;
21-
else aEnd = a.data.years.end;
22-
if (b.data.years.end == "Actual") bEnd = 9999;
23-
else bEnd = b.data.years.end;
24-
25-
return +bEnd - +aEnd;
26-
});
27-
2812
// TODO: use `astro-icon`.
2913
// TODO: Flow component (`<T class="space-y-5 md:space-y-8">`).
3014
// TODO: Add some pretty animations where needed.
@@ -36,8 +20,8 @@ const communities = (await getCollection("communities")).sort((a, b) => {
3620
---
3721

3822
<Base title={SITE_TITLE}>
39-
<main class="bg-slate-200 text-center">
40-
<Container class="max-w-screen-xl lg:py-[11vh]">
23+
<main class="flex flex-1 items-center bg-slate-200 text-center">
24+
<Container class="max-w-screen-xl">
4125
<div
4226
class="grid grid-cols-1 items-center justify-items-center gap-3 lg:grid-cols-2"
4327
>
@@ -76,7 +60,7 @@ const communities = (await getCollection("communities")).sort((a, b) => {
7660
<li>
7761
<a
7862
class="flex h-20 justify-center rounded-lg border-2 border-black transition hover:bg-white hover:text-black focus:bg-white focus:text-black lg:mx-10"
79-
href="#comunidades"
63+
href="/about#comunidades"
8064
>
8165
<div
8266
class="flex items-center justify-center gap-2"
@@ -121,25 +105,4 @@ const communities = (await getCollection("communities")).sort((a, b) => {
121105
</div>
122106
</Container>
123107
</main>
124-
<section>
125-
<Container class="max-w-screen-xl space-y-4" usePy={false}>
126-
<a href="#comunidades" name="comunidades">
127-
<h2 class="pt-8 text-center text-3xl">Comunidades</h2>
128-
</a>
129-
<p class="prose-xl mx-auto pb-4 text-center sm:text-left">
130-
He tenido el privilegio de colaborar activamente con diversas
131-
comunidades tecnológicas que comparten mi pasión por el
132-
aprendizaje, la inclusión y la colaboración. Estas experiencias
133-
han sido clave para mi desarrollo profesional, permitiéndome
134-
contribuir como mentora, organizadora y defensora de iniciativas
135-
que fortalecen nuestras comunidades.
136-
</p>
137-
<!-- TODO: Mesanry layout -->
138-
<div
139-
class="grid grid-cols-[repeat(auto-fit,minmax(min(325px,100%),1fr))] gap-6 md:gap-4"
140-
>
141-
{communities.map((c) => <CommunityCard {...c} />)}
142-
</div>
143-
</Container>
144-
</section>
145108
</Base>

src/pages/talks.astro

Lines changed: 0 additions & 53 deletions
This file was deleted.

0 commit comments

Comments
 (0)