Merge remote-tracking branch 'origin/develop' into fix_anchors

Author: itziarAPSL

.github/workflows/build.yml .github/workflows/check.yml.github/workflows/build.yml renamed to .github/workflows/check.yml

@@ -5,7 +5,8 @@ on:
     branches: [main, develop]
 
 jobs:
-  build:
+  check:
+    name: Check
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
@@ -22,5 +23,11 @@ jobs:
       - name: Install dependencies
         run: pnpm install
 
+      - name: Astro check
+        run: pnpm astro check
+
+      - name: Prettier check
+        run: pnpm exec prettier --check src
+
       - name: Build
         run: pnpm build

.github/workflows/deploy.yml

@@ -34,6 +34,8 @@ jobs:
 
       - name: Build with Astro
         run: pnpm run build
+        env:
+          PUBLIC_GA_ID: ${{ secrets.PUBLIC_GA_ID }}
 
       - name: Upload artifact
         if: github.event_name != 'pull_request'

src/components/AccommodationPage.astro

@@ -8,6 +8,24 @@ interface Props {
 
 const { lang } = Astro.props
 const t = accommodationTexts[lang as keyof typeof accommodationTexts]
+type AreaSlug =
+  | 'eixampleEsquerra'
+  | 'elRaval'
+  | 'santAntoni'
+  | 'ciutatVella'
+  | 'sants'
+  | 'poblenou22'
+  | 'elClot'
+  | 'lesCorts'
+  | 'eixampleDreta'
+  | 'collblanc'
+
+const walkingAreas: AreaSlug[] = ['eixampleEsquerra', 'elRaval', 'santAntoni', 'ciutatVella']
+const directMetroAreas: AreaSlug[] = ['sants', 'poblenou22', 'elClot']
+const transferAreas: AreaSlug[] = ['lesCorts', 'eixampleDreta', 'collblanc']
+
+const areaName = (slug: AreaSlug) => t[`accommodation.areas.${slug}.name` as keyof typeof t]
+const areaDesc = (slug: AreaSlug) => t[`accommodation.areas.${slug}.desc` as keyof typeof t]
 ---
 
 <div class="accommodation-container pb-20">
@@ -20,33 +38,91 @@ const t = accommodationTexts[lang as keyof typeof accommodationTexts]
     </p>
   </section>
 
-  <section
-    class="max-w-4xl bg-white/5 backdrop-blur-md p-8 md:p-12 rounded-3xl border border-white/10 mb-16 shadow-2xl"
-  >
-    <p class="text-lg text-pycon-gray-25 leading-relaxed">
-      {t['accommodation.intro']}
-    </p>
+  <!-- Areas -->
+  <section class="mb-24" aria-labelledby="accommodation-areas-heading">
+    <div class="flex items-center gap-4 mb-12">
+      <div class="h-px bg-white/20 flex-1" aria-hidden="true"></div>
+      <h2 id="accommodation-areas-heading" class="text-3xl font-bold text-white px-4">
+        {t['accommodation.areas.title']}
+      </h2>
+      <div class="h-px bg-white/20 flex-1" aria-hidden="true"></div>
+    </div>
+    <div class="max-w-4xl space-y-4 mb-12 text-pycon-gray-25 leading-relaxed">
+      <p class="text-lg">{t['accommodation.areas.transportIntro.p1']}</p>
+      <p class="text-lg">{t['accommodation.areas.transportIntro.p2']}</p>
+      <p class="text-lg">{t['accommodation.areas.transportIntro.p3']}</p>
+    </div>
+
+    <div class="space-y-16">
+      <div>
+        <h3 class="text-2xl font-bold text-white mb-6">{t['accommodation.areas.category.walking']}</h3>
+        <ul class="grid sm:grid-cols-2 lg:grid-cols-3 gap-8 list-none m-0 p-0">
+          {
+            walkingAreas.map((slug) => (
+              <li class="bg-pycon-black/40 p-8 rounded-2xl border border-white/5 hover:border-pycon-orange/50 transition-all motion-safe:hover:-translate-y-2">
+                <h4 class="text-xl font-bold text-pycon-orange mb-4 italic">{areaName(slug)}</h4>
+                <p class="text-pycon-gray-25 text-sm leading-relaxed">{areaDesc(slug)}</p>
+              </li>
+            ))
+          }
+        </ul>
+      </div>
+      <div>
+        <h3 class="text-2xl font-bold text-white mb-6">{t['accommodation.areas.category.directMetro']}</h3>
+        <ul class="grid sm:grid-cols-2 lg:grid-cols-3 gap-8 list-none m-0 p-0">
+          {
+            directMetroAreas.map((slug) => (
+              <li class="bg-pycon-black/40 p-8 rounded-2xl border border-white/5 hover:border-pycon-orange/50 transition-all motion-safe:hover:-translate-y-2">
+                <h4 class="text-xl font-bold text-pycon-orange mb-4 italic">{areaName(slug)}</h4>
+                <p class="text-pycon-gray-25 text-sm leading-relaxed">{areaDesc(slug)}</p>
+              </li>
+            ))
+          }
+        </ul>
+      </div>
+      <div>
+        <h3 class="text-2xl font-bold text-white mb-6">{t['accommodation.areas.category.transferMetro']}</h3>
+        <ul class="grid sm:grid-cols-2 lg:grid-cols-3 gap-8 list-none m-0 p-0">
+          {
+            transferAreas.map((slug) => (
+              <li class="bg-pycon-black/40 p-8 rounded-2xl border border-white/5 hover:border-pycon-orange/50 transition-all motion-safe:hover:-translate-y-2">
+                <h4 class="text-xl font-bold text-pycon-orange mb-4 italic">{areaName(slug)}</h4>
+                <p class="text-pycon-gray-25 text-sm leading-relaxed">{areaDesc(slug)}</p>
+              </li>
+            ))
+          }
+        </ul>
+      </div>
+    </div>
   </section>
 
   <!-- Hotels Section -->
-  <section class="mb-24">
+  <section class="mb-24" aria-labelledby="accommodation-hotels-heading">
     <div class="flex items-center gap-4 mb-12">
-      <div class="h-px bg-white/20 flex-1"></div>
-      <h2 class="text-3xl font-bold text-white px-4">{t['accommodation.hotels.title']}</h2>
-      <div class="h-px bg-white/20 flex-1"></div>
+      <div class="h-px bg-white/20 flex-1" aria-hidden="true"></div>
+      <h2 id="accommodation-hotels-heading" class="text-3xl font-bold text-white px-4">
+        {t['accommodation.hotels.title']}
+      </h2>
+      <div class="h-px bg-white/20 flex-1" aria-hidden="true"></div>
     </div>
 
     <div
       class="bg-pycon-gray-100/50 p-12 rounded-3xl border border-pycon-yellow/30 text-center relative overflow-hidden group"
     >
       <!-- Shine effect -->
       <div
-        class="absolute -top-full -left-full w-[300%] h-[300%] bg-linear-to-br from-transparent via-pycon-yellow/5 to-transparent rotate-45 transition-transform duration-1000 group-hover:translate-x-[33%] group-hover:translate-y-[33%] pointer-events-none"
+        class="absolute -top-full -left-full w-[300%] h-[300%] bg-linear-to-br from-transparent via-pycon-yellow/5 to-transparent rotate-45 transition-transform duration-1000 motion-safe:group-hover:translate-x-[33%] motion-safe:group-hover:translate-y-[33%] pointer-events-none"
+        aria-hidden="true"
       >
       </div>
 
       <div class="relative z-10">
-        <StatusIcon type="construction" size="xl" role="img" aria-label="Construyendo" />
+        <StatusIcon
+          type="construction"
+          size="xl"
+          role="img"
+          aria-label={t['accommodation.a11y.constructionIcon']}
+        />
         <h3 class="text-2xl font-bold text-pycon-yellow mb-4">{t['accommodation.hotels.subtitle']}</h3>
         <p class="text-xl text-white font-medium max-w-2xl mx-auto italic opacity-80">
           {t['accommodation.hotels.disclaimer']}
@@ -55,61 +131,37 @@ const t = accommodationTexts[lang as keyof typeof accommodationTexts]
     </div>
   </section>
 
-  <!-- Areas -->
-  <section class="mb-24">
-    <h2 class="text-3xl font-bold text-white mb-12 flex items-center gap-3">
-      <span class="w-2 h-8 bg-pycon-red rounded-full"></span>
-      {t['accommodation.areas.title']}
-    </h2>
-    <div class="grid md:grid-cols-3 gap-8">
-      <div
-        class="bg-pycon-black/40 p-8 rounded-2xl border border-white/5 hover:border-pycon-orange/50 transition-all hover:-translate-y-2"
-      >
-        <h3 class="text-xl font-bold text-pycon-orange mb-4 italic">
-          {t['accommodation.areas.eixample.name']}
-        </h3>
-        <p class="text-pycon-gray-25 text-sm leading-relaxed">{t['accommodation.areas.eixample.desc']}</p>
-      </div>
-      <div
-        class="bg-pycon-black/40 p-8 rounded-2xl border border-white/5 hover:border-pycon-orange/50 transition-all hover:-translate-y-2 text-center"
-      >
-        <h3 class="text-xl font-bold text-pycon-orange mb-4 italic">
-          {t['accommodation.areas.gothic.name']}
-        </h3>
-        <p class="text-pycon-gray-25 text-sm leading-relaxed">{t['accommodation.areas.gothic.desc']}</p>
-      </div>
-      <div
-        class="bg-pycon-black/40 p-8 rounded-2xl border border-white/5 hover:border-pycon-orange/50 transition-all hover:-translate-y-2 text-right"
-      >
-        <h3 class="text-xl font-bold text-pycon-orange mb-4 italic">
-          {t['accommodation.areas.poblenou.name']}
-        </h3>
-        <p class="text-pycon-gray-25 text-sm leading-relaxed">{t['accommodation.areas.poblenou.desc']}</p>
-      </div>
-    </div>
-  </section>
-
   <!-- Apartments -->
   <section
     class="bg-linear-to-r from-pycon-red/20 to-pycon-orange/20 p-8 md:p-16 rounded-3xl border border-pycon-red/30"
+    aria-labelledby="accommodation-apartments-heading"
   >
     <div class="flex flex-col md:flex-row gap-12 items-center">
       <div class="flex-1">
-        <h2 class="text-3xl font-bold text-white mb-6 uppercase tracking-tight">
+        <h2
+          id="accommodation-apartments-heading"
+          class="text-3xl font-bold text-white mb-6 uppercase tracking-tight"
+        >
           {t['accommodation.apartments.title']}
         </h2>
         <p class="text-pycon-gray-25 text-lg mb-8 leading-relaxed">
           {t['accommodation.apartments.text']}
         </p>
         <a
-          href="https://meet.barcelona/es/alojarse-en-barcelona"
+          href={t['accommodation.apartments.linkUrl']}
           target="_blank"
           rel="noopener noreferrer"
           aria-label={`${t['accommodation.apartments.link']} ${menuT.new_tab}`}
           class="inline-flex items-center gap-2 bg-white text-pycon-red font-bold px-6 py-3 rounded-lg hover:scale-105 transition-transform no-underline"
         >
           {t['accommodation.apartments.link']}
-          <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"
+          <span class="sr-only"> ({t['accommodation.a11y.linkOpensNewTab']})</span>
+          <svg
+            class="w-5 h-5 shrink-0"
+            fill="none"
+            stroke="currentColor"
+            viewBox="0 0 24 24"
+            aria-hidden="true"
             ><path
               stroke-linecap="round"
               stroke-linejoin="round"
@@ -120,8 +172,9 @@ const t = accommodationTexts[lang as keyof typeof accommodationTexts]
       </div>
       <div
         class="w-48 h-48 bg-white/10 rounded-full flex items-center justify-center border border-white/20 shadow-2xl backdrop-blur-xl shrink-0"
+        aria-hidden="true"
       >
-        <StatusIcon type="city" size="xl" role="img" aria-label="Ubicación" />
+        <StatusIcon type="city" size="xl" />
       </div>
     </div>
   </section>
@@ -142,4 +195,10 @@ const t = accommodationTexts[lang as keyof typeof accommodationTexts]
       transform: translateY(0);
     }
   }
+
+  @media (prefers-reduced-motion: reduce) {
+    .accommodation-container {
+      animation: none;
+    }
+  }
 </style>

src/components/Button.astro

@@ -24,7 +24,7 @@ const sizes = {
 }
 
 const baseClasses =
-  "inline-flex items-center justify-center font-['Outfit'] font-medium rounded-lg text-center transition-colors duration-200 cursor-pointer"
+  'inline-flex items-center justify-center font-medium rounded-lg text-center transition-colors duration-200 cursor-pointer'
 
 const Element = href ? 'a' : 'button'
 ---

src/components/LocationPage.astro

@@ -19,7 +19,7 @@ const transportIcons = {
 
 <div class="location-container pb-20">
   <!-- Hero Section -->
-  <section class="relative h-[60vh] min-h-[400px] w-full overflow-hidden rounded-3xl mb-12 shadow-2xl">
+  <section class="relative h-[40vh] min-h-10 w-full overflow-hidden rounded-3xl mb-12 shadow-2xl">
     <img
       src="/images/Barcelona/seuUB.jpg"
       alt={t['location.hero.title']}

src/components/home/SectionCallForProposals.astro

@@ -0,0 +1,36 @@
+---
+import { texts } from '../../i18n/home'
+import SectionTitle from '../SectionTitle.astro'
+import Button from '../Button.astro'
+
+interface Props {
+  lang: string
+}
+
+const { lang } = Astro.props
+const t = texts[lang as keyof typeof texts]
+---
+
+<div class="flex flex-col items-center gap-6">
+  <SectionTitle title={t['cfp.title']} />
+
+  <div
+    class="bg-white/5 backdrop-blur-md p-8 rounded-2xl border border-white/10 hover:border-pycon-orange/50 transition-all shadow-xl w-full"
+  >
+    <p class="text-lg text-pycon-gray-25 leading-relaxed mb-6 text-center">
+      {t['cfp.description']}
+    </p>
+
+    <div class="flex justify-center">
+      <Button
+        variant="primary"
+        size="lg"
+        href="https://pretalx.com/pycones-2026/cfp"
+        target="_blank"
+        rel="noopener noreferrer"
+      >
+        {t['cfp.button']}
+      </Button>
+    </div>
+  </div>
+</div>

src/components/index.astro

@@ -1,6 +1,7 @@
 ---
 import Layout from '@/layouts/Layout.astro'
 import SectionMain from './home/SectionMain.astro'
+import SectionCallForProposals from './home/SectionCallForProposals.astro'
 import SectionSponsors from './home/SectionSponsors.astro'
 
 interface Props {
@@ -13,6 +14,7 @@ const { lang } = Astro.props
 <Layout title="PyConES 2026">
   <div class="flex flex-col gap-20">
     <SectionMain lang={lang} />
+    <SectionCallForProposals lang={lang} />
     <SectionSponsors lang={lang} />
   </div>
 </Layout>

src/i18n/accommodation/ca.ts

@@ -2,24 +2,55 @@ export const ca = {
   'accommodation.title': 'Allotjament',
   'accommodation.hero.title': 'On allotjar-se',
   'accommodation.hero.subtitle': 'Recomanacions per a la teva estada a Barcelona',
-  'accommodation.intro':
-    "Barcelona és una de les ciutats amb més oferta hotelera d'Europa. Per a la PyConES 2026, recomanem buscar allotjament al districte de l'Eixample o a Ciutat Vella per estar a pocs minuts a peu de la seu (UB Edifici Històric).",
   'accommodation.hotels.title': 'Hotels Recomanats',
   'accommodation.hotels.subtitle': 'Convenis i opcions properes',
   'accommodation.hotels.disclaimer':
     'Estem treballant per tancar convenis exclusius amb descomptes per als assistents. Torna aviat per veure els codis promocionals!',
   'accommodation.areas.title': 'Millors Zones',
-  'accommodation.areas.eixample.name': "L'Eixample",
-  'accommodation.areas.eixample.desc':
-    'La zona més segura i elegant, amb arquitectura modernista i a un pas de la seu.',
-  'accommodation.areas.gothic.name': 'Barri Gòtic',
-  'accommodation.areas.gothic.desc':
-    'El centre històric, amb carrers màgics i molta vida nocturna, a 10 min de la UB.',
-  'accommodation.areas.poblenou.name': 'Poblenou / 22@',
-  'accommodation.areas.poblenou.desc':
-    'El hub tecnològic. Un poc més allunyat però molt ben connectat per metro (L1).',
+  'accommodation.areas.transportIntro.p1':
+    'Si has de tornar a casa en tren, les millors opcions són Sants, Eixample Esquerra o Les Corts (per anar a Sants Estació).',
+  'accommodation.areas.transportIntro.p2':
+    "Si tornes en avió, et recomanem els barris d'El Raval, Sant Antoni, Eixample Esquerra (Aerobús), Sants (tren Rodalies R2) o Les Corts i Collblanc (L9 Sud). Tanmateix hi ha una parada de l'autobús directe a l'aeroport (Aerobús) davant de la seu.",
+  'accommodation.areas.transportIntro.p3':
+    'Tindrem servei de consigna, així que si marxes el diumenge pots fer check-out i deixar les maletes aquí.',
+  'accommodation.areas.category.walking': 'A peu',
+  'accommodation.areas.category.directMetro': 'Metro directe',
+  'accommodation.areas.category.transferMetro': 'Metro amb transbord',
+  'accommodation.areas.eixampleEsquerra.name': 'Eixample Esquerra',
+  'accommodation.areas.eixampleEsquerra.desc':
+    "Costat esquerre de l'eixample, modernista i molt a prop de la UB a peu; bona opció si també fas servir Sants.",
+  'accommodation.areas.elRaval.name': 'El Raval',
+  'accommodation.areas.elRaval.desc':
+    'Barri cèntric i multicultural, a poca distància a peu de la seu; l’Aerobús enllaça bé amb l’aeroport.',
+  'accommodation.areas.santAntoni.name': 'Sant Antoni',
+  'accommodation.areas.santAntoni.desc':
+    'Mercat i terrasses, ambient de barri i una passejada còmoda fins a la universitat.',
+  'accommodation.areas.ciutatVella.name': 'Ciutat Vella',
+  'accommodation.areas.ciutatVella.desc':
+    'Nucli històric (Gòtic, Born…): ambient únic i ubicacions a prop de l’esdeveniment.',
+  'accommodation.areas.sants.name': 'Sants',
+  'accommodation.areas.sants.desc':
+    'Al costat de l’estació de Sants: ideal per trens de llarg recorregut i Rodalies cap a l’aeroport.',
+  'accommodation.areas.poblenou22.name': 'Poblenou / 22@',
+  'accommodation.areas.poblenou22.desc':
+    'Districte 22@ i platja; ben connectat per metro en línia directa al centre i la UB.',
+  'accommodation.areas.elClot.name': 'El Clot',
+  'accommodation.areas.elClot.desc':
+    'Barri consolidat amb bon accés en metro directe al centre on hi ha la seu.',
+  'accommodation.areas.lesCorts.name': 'Les Corts',
+  'accommodation.areas.lesCorts.desc':
+    'A prop de la L9 Sud a l’aeroport; per arribar a la seu sol cal transbord en metro.',
+  'accommodation.areas.eixampleDreta.name': 'Eixample Dreta',
+  'accommodation.areas.eixampleDreta.desc':
+    'Eixample dret: emblemàtic i ben comunicat, amb enllaços que sovint impliquen una correspondència.',
+  'accommodation.areas.collblanc.name': 'Collblanc',
+  'accommodation.areas.collblanc.desc':
+    'L9 Sud a l’aeroport; per arribar a la UB normalment faràs transbord.',
   'accommodation.apartments.title': 'Apartaments Turístics',
   'accommodation.apartments.text':
     "Si prefereixes un apartament, assegura't que compti amb llicència turística oficial (HUTB). Barcelona és molt estricta amb la regulació d'allotjaments.",
   'accommodation.apartments.link': "Veure guia d'allotjament segur a Barcelona",
+  'accommodation.apartments.linkUrl': 'https://meet.barcelona.cat/habitatgesturistics/ca',
+  'accommodation.a11y.constructionIcon': 'En construcció',
+  'accommodation.a11y.linkOpensNewTab': "s'obre en una pestanya nova",
 } as const