|
1 | 1 | --- |
2 | | -import Container from "../components/Container.astro"; |
3 | 2 | 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 | +}; |
7 | 42 | --- |
8 | 43 |
|
9 | 44 | <Base title="About Me" description="Sobre mi"> |
10 | 45 | <main> |
11 | 46 | <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"> |
22 | 50 | <p> |
23 | 51 | Soy Denny Pérez, Analista de Calidad de Software en <a |
24 | 52 | href="https://nventive.com/en/">Nventive</a |
@@ -66,13 +94,61 @@ import Base from "../layouts/Base.astro"; |
66 | 94 | inclusivo y colaborativo, tanto en la tecnología como en |
67 | 95 | la vida cotidiana. |
68 | 96 | </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> |
76 | 152 | </Container> |
77 | 153 | </main> |
78 | 154 | </Base> |
0 commit comments