Skip to content

Commit bc84271

Browse files
francescarpifrancescarpi
authored
Sección de patrocinadores en la home (#104)
1 parent 7ba629e commit bc84271

17 files changed

Lines changed: 215 additions & 31 deletions

File tree

‎src/components/CenteredPanel.astro‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
---
2+
interface Props {
3+
text: string
4+
}
5+
6+
const { text } = Astro.props
7+
---
8+
9+
<div class="flex-1 flex items-center justify-center bg-black/15 p-4 md:p-8">
10+
<p class="text-center md:text-xl">
11+
{text}
12+
</p>
13+
</div>

‎src/components/SectionTitle.astro‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
interface Props {
3+
title: string
4+
}
5+
6+
const { title } = Astro.props
7+
---
8+
9+
<h3 class="text-center text-2xl">{title}</h3>

‎src/components/home/SectionMain.astro‎

Lines changed: 5 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
---
22
import { texts } from '../../i18n/home'
3+
import CenteredPanel from '../CenteredPanel.astro'
34
45
interface Props {
56
lang: string
@@ -9,8 +10,8 @@ const { lang } = Astro.props
910
const t = texts[lang as keyof typeof texts]
1011
---
1112

12-
<div class="mt-20 p-20 flex gap-4 flex-col lg:flex-row">
13-
<div class="flex-1">
13+
<div class="mt-20 pt-20 flex gap-4 flex-col lg:flex-row">
14+
<div class="flex-1 mb-4">
1415
<h1>
1516
<img
1617
src="/images/logo-vertical-alt-color-dark.svg"
@@ -21,7 +22,7 @@ const t = texts[lang as keyof typeof texts]
2122

2223
<h2
2324
id="subtitle-container"
24-
class="mt-4 text-xl md:text-2xl text-pycon-red-75 font-mono h-8 flex justify-center items-start gap-2 [text-shadow:0_0_3px_var(--color-pycon-black),0_0_6px_var(--color-pycon-black),0_0_6px_var(--color-pycon-black),0_0_12px_var(--color-pycon-black)]"
25+
class="mt-4 md:text-2xl text-pycon-red-75 font-mono h-8 flex justify-center items-start gap-2 [text-shadow:0_0_3px_var(--color-pycon-black),0_0_6px_var(--color-pycon-black),0_0_6px_var(--color-pycon-black),0_0_12px_var(--color-pycon-black)]"
2526
aria-live="polite"
2627
aria-busy="true"
2728
>
@@ -32,13 +33,7 @@ const t = texts[lang as keyof typeof texts]
3233
</span>
3334
</h2>
3435
</div>
35-
<div class="flex-1 flex items-center justify-center mt-10 lg:mt-0">
36-
<h3>
37-
<p class="text-center text-xl max-w-3xl">
38-
{t['index.message']}
39-
</p>
40-
</h3>
41-
</div>
36+
<CenteredPanel text={t['index.message']} />
4237
</div>
4338

4439
<script>

‎src/components/home/SectionSponsors.astro‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
---
2+
import { texts } from '../../i18n/home'
3+
import SectionTitle from '../SectionTitle.astro'
4+
import CenteredPanel from '../CenteredPanel.astro'
5+
import type { ISponsor } from '../../types/sponsors'
6+
import SponsorsGroup from './sponsors/SponsorsGroup.astro'
7+
8+
const sponsors = Object.values(import.meta.glob('../../data/sponsors/*.md', { eager: true })) as {
9+
frontmatter: ISponsor
10+
}[]
11+
12+
interface Props {
13+
lang: string
14+
}
15+
16+
const { lang } = Astro.props
17+
const t = texts[lang as keyof typeof texts]
18+
19+
function filterSponsorsByTier(tier: string): ISponsor[] {
20+
return sponsors.filter((s) => s.frontmatter.tier === tier).map((s) => s.frontmatter)
21+
}
22+
23+
const bronze = filterSponsorsByTier('bronze')
24+
const silver = filterSponsorsByTier('silver')
25+
const gold = filterSponsorsByTier('gold')
26+
const platinum = filterSponsorsByTier('platinum')
27+
const main = filterSponsorsByTier('main')
28+
---
29+
30+
<div class="flex flex-col items-center gap-4">
31+
<SectionTitle title={t['sponsors.title']} />
32+
<CenteredPanel text={t['sponsors.description']} />
33+
34+
<div class="w-full flex flex-col gap-8">
35+
<SponsorsGroup lang={lang} title={t['sponsors.main']} sponsors={main} tierId="main" />
36+
<SponsorsGroup lang={lang} title={t['sponsors.platinum']} sponsors={platinum} tierId="platinum" />
37+
<SponsorsGroup lang={lang} title={t['sponsors.gold']} sponsors={gold} tierId="gold" />
38+
<SponsorsGroup lang={lang} title={t['sponsors.silver']} sponsors={silver} tierId="silver" />
39+
<SponsorsGroup lang={lang} title={t['sponsors.bronze']} sponsors={bronze} tierId="bronze" />
40+
</div>
41+
</div>

‎src/components/home/sponsors/SponsorsGroup.astro‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
---
2+
import type { ISponsor, TSponsorTier } from '../../../types/sponsors'
3+
import { texts } from '../../../i18n/home'
4+
import { TIER_COLORS } from '../../../constants'
5+
6+
interface Props {
7+
tierId: TSponsorTier
8+
lang: string
9+
title: string
10+
sponsors: ISponsor[]
11+
}
12+
13+
const { title, sponsors, lang, tierId } = Astro.props
14+
const t = texts[lang as keyof typeof texts]
15+
16+
const IMG_WITH_BY_TIER: Record<TSponsorTier, number> = {
17+
main: 200,
18+
platinum: 150,
19+
gold: 120,
20+
silver: 100,
21+
bronze: 80,
22+
}
23+
---
24+
25+
<div class="w-full">
26+
<h4 style={`background-color: ${TIER_COLORS[tierId]};`} class="p-2 text-black rounded">{title}</h4>
27+
{
28+
sponsors.length > 0 ? (
29+
<div class="flex flex-wrap gap-4 mt-4">
30+
{sponsors.map((sponsor) => (
31+
<a
32+
href={sponsor.website}
33+
target="_blank"
34+
rel="noopener noreferrer"
35+
class="flex flex-col items-center justify-center p-4 border rounded-lg hover:shadow-lg transition-shadow duration-300"
36+
>
37+
<img
38+
src={sponsor.logo}
39+
alt={t['sponsors.altlogo'].replace('{name}', sponsor.name)}
40+
width={IMG_WITH_BY_TIER[tierId]}
41+
/>
42+
<small>{sponsor.name}</small>
43+
</a>
44+
))}
45+
</div>
46+
) : (
47+
<p class="text-gray-100 mt-2 bg-white/10 px-2 py-1 rounded w-[184px] border border-gray-300 text-center">
48+
{t['sponsors.none']}
49+
</p>
50+
)
51+
}
52+
</div>

‎src/components/index.astro‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
---
22
import Layout from '../layouts/Layout.astro'
33
import SectionMain from './home/SectionMain.astro'
4+
import SectionSponsors from './home/SectionSponsors.astro'
45
56
interface Props {
67
lang: string
@@ -10,5 +11,8 @@ const { lang } = Astro.props
1011
---
1112

1213
<Layout title="PyConES 2026">
13-
<SectionMain lang={lang} />
14+
<div class="flex flex-col gap-20">
15+
<SectionMain lang={lang} />
16+
<SectionSponsors lang={lang} />
17+
</div>
1418
</Layout>

‎src/constants.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import type { TSponsorTier } from './types/sponsors'
2+
3+
export const TIER_COLORS: Record<TSponsorTier, string> = {
4+
bronze: '#d97706',
5+
silver: '#9ca3af',
6+
gold: '#facc15',
7+
platinum: '#4ade80',
8+
main: '#c084fc',
9+
}

‎src/data/sponsors/sponsor1.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
name: 'Sponsor 1'
3+
website: 'https://sponsor1.com'
4+
tier: 'bronze'
5+
logo: 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSIjZmZmIiBkPSJNNSAyMXEtLjgyNSAwLTEuNDEyLS41ODdUMyAxOVY1cTAtLjgyNS41ODgtMS40MTJUNSAzaDE0cS44MjUgMCAxLjQxMy41ODhUMjEgNXYxNHEwIC44MjUtLjU4NyAxLjQxM1QxOSAyMXptMC0yaDE0VjVINXptMCAwVjV6bTItMmgxMHEuMyAwIC40NS0uMjc1dC0uMDUtLjUyNWwtMi43NS0zLjY3NXEtLjE1LS4yLS40LS4ydC0uNC4yTDExLjI1IDE2TDkuNCAxMy41MjVxLS4xNS0uMi0uNC0uMnQtLjQuMmwtMiAyLjY3NXEtLjIuMjUtLjA1LjUyNVQ3IDE3bTIuNTYzLTcuNDM4UTEwIDkuMTI1IDEwIDguNXQtLjQzNy0xLjA2MlQ4LjUgN3QtMS4wNjIuNDM4VDcgOC41dC40MzggMS4wNjNUOC41IDEwdDEuMDYzLS40MzciLz48L3N2Zz4='
6+
---

‎src/data/sponsors/sponsor2.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
name: 'Sponsor 1'
3+
website: 'https://sponsor1.com'
4+
tier: 'platinum'
5+
logo: 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSIjZmZmIiBkPSJNNSAyMXEtLjgyNSAwLTEuNDEyLS41ODdUMyAxOVY1cTAtLjgyNS41ODgtMS40MTJUNSAzaDE0cS44MjUgMCAxLjQxMy41ODhUMjEgNXYxNHEwIC44MjUtLjU4NyAxLjQxM1QxOSAyMXptMC0yaDE0VjVINXptMCAwVjV6bTItMmgxMHEuMyAwIC40NS0uMjc1dC0uMDUtLjUyNWwtMi43NS0zLjY3NXEtLjE1LS4yLS40LS4ydC0uNC4yTDExLjI1IDE2TDkuNCAxMy41MjVxLS4xNS0uMi0uNC0uMnQtLjQuMmwtMiAyLjY3NXEtLjIuMjUtLjA1LjUyNVQ3IDE3bTIuNTYzLTcuNDM4UTEwIDkuMTI1IDEwIDguNXQtLjQzNy0xLjA2MlQ4LjUgN3QtMS4wNjIuNDM4VDcgOC41dC40MzggMS4wNjNUOC41IDEwdDEuMDYzLS40MzciLz48L3N2Zz4='
6+
---

‎src/data/sponsors/sponsor3.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
name: 'Sponsor 3'
3+
website: 'https://sponsor3.com'
4+
tier: 'platinum'
5+
logo: 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSIjZmZmIiBkPSJNNSAyMXEtLjgyNSAwLTEuNDEyLS41ODdUMyAxOVY1cTAtLjgyNS41ODgtMS40MTJUNSAzaDE0cS44MjUgMCAxLjQxMy41ODhUMjEgNXYxNHEwIC44MjUtLjU4NyAxLjQxM1QxOSAyMXptMC0yaDE0VjVINXptMCAwVjV6bTItMmgxMHEuMyAwIC40NS0uMjc1dC0uMDUtLjUyNWwtMi43NS0zLjY3NXEtLjE1LS4yLS40LS4ydC0uNC4yTDExLjI1IDE2TDkuNCAxMy41MjVxLS4xNS0uMi0uNC0uMnQtLjQuMmwtMiAyLjY3NXEtLjIuMjUtLjA1LjUyNVQ3IDE3bTIuNTYzLTcuNDM4UTEwIDkuMTI1IDEwIDguNXQtLjQzNy0xLjA2MlQ4LjUgN3QtMS4wNjIuNDM4VDcgOC41dC40MzggMS4wNjNUOC41IDEwdDEuMDYzLS40MzciLz48L3N2Zz4='
6+
---

0 commit comments

Comments
 (0)