feat: formatting

Author: itziarAPSL

README.md

@@ -96,4 +96,3 @@ Deployment is manual and triggered from GitHub Actions:
 3. Click **Run workflow**
 
 The site is deployed to GitHub Pages at `https://2026.es.pycon.org/`.
-

src/components/JobsPage.astro

@@ -21,9 +21,15 @@ interface JobFrontmatter {
 const { lang } = Astro.props
 const t = jobsTexts[(lang || 'es') as keyof typeof jobsTexts]
 
-const esJobs = Object.values(import.meta.glob('../data/jobs/es/*.md', { eager: true })) as { frontmatter: JobFrontmatter }[]
-const enJobs = Object.values(import.meta.glob('../data/jobs/en/*.md', { eager: true })) as { frontmatter: JobFrontmatter }[]
-const caJobs = Object.values(import.meta.glob('../data/jobs/ca/*.md', { eager: true })) as { frontmatter: JobFrontmatter }[]
+const esJobs = Object.values(import.meta.glob('../data/jobs/es/*.md', { eager: true })) as {
+  frontmatter: JobFrontmatter
+}[]
+const enJobs = Object.values(import.meta.glob('../data/jobs/en/*.md', { eager: true })) as {
+  frontmatter: JobFrontmatter
+}[]
+const caJobs = Object.values(import.meta.glob('../data/jobs/ca/*.md', { eager: true })) as {
+  frontmatter: JobFrontmatter
+}[]
 
 const allJobsMap: Record<string, { frontmatter: JobFrontmatter }[]> = {
   es: esJobs,
@@ -59,16 +65,22 @@ const isFeatured = (tier?: string) => tier === 'gold' || tier === 'platinum'
       <p class="text-pycon-gray-25 text-lg">{t.no_jobs}</p>
     ) : (
       <section aria-labelledby="jobs-list-heading" class="grid md:grid-cols-2 gap-8">
-        <h2 id="jobs-list-heading" class="sr-only">{t.hero}</h2>
+        <h2 id="jobs-list-heading" class="sr-only">
+          {t.hero}
+        </h2>
         {jobs.map(({ frontmatter: job }) => (
-          <article class={`flex flex-col bg-pycon-black/40 p-6 rounded-2xl border transition-all motion-safe:hover:-translate-y-2 ${isFeatured(job.tier) ? 'border-pycon-orange/50 hover:border-pycon-orange' : 'border-white/5 hover:border-white/20'}`}>
+          <article
+            class={`flex flex-col bg-pycon-black/40 p-6 rounded-2xl border transition-all motion-safe:hover:-translate-y-2 ${isFeatured(job.tier) ? 'border-pycon-orange/50 hover:border-pycon-orange' : 'border-white/5 hover:border-white/20'}`}
+          >
             <header class="flex items-start justify-between mb-3">
               <div>
                 <h2 class="text-xl font-bold text-white mb-1">{job.title}</h2>
                 <p class="text-pycon-orange text-lg font-medium">{job.company}</p>
               </div>
               {isFeatured(job.tier) && (
-                <span class="px-3 py-1 bg-pycon-orange/20 text-pycon-orange text-xs font-bold rounded-full uppercase">{t.featured}</span>
+                <span class="px-3 py-1 bg-pycon-orange/20 text-pycon-orange text-xs font-bold rounded-full uppercase">
+                  {t.featured}
+                </span>
               )}
             </header>
 
@@ -81,7 +93,9 @@ const isFeatured = (tier?: string) => tier === 'gold' || tier === 'platinum'
                 <p class="text-sm text-pycon-gray-50 mb-2 uppercase tracking-wide">{t.skills}</p>
                 <div class="flex flex-wrap gap-2">
                   {job.skills.map((skill) => (
-                    <span class="px-3 py-1.5 bg-gradient-to-r from-pycon-orange/30 to-pycon-yellow/20 text-white text-sm rounded-full border border-pycon-orange/30">{skill}</span>
+                    <span class="px-3 py-1.5 bg-gradient-to-r from-pycon-orange/30 to-pycon-yellow/20 text-white text-sm rounded-full border border-pycon-orange/30">
+                      {skill}
+                    </span>
                   ))}
                 </div>
               </div>
@@ -90,20 +104,47 @@ const isFeatured = (tier?: string) => tier === 'gold' || tier === 'platinum'
             <footer class="mt-auto">
               <div class="flex flex-wrap items-center gap-x-4 gap-y-2 text-base text-pycon-gray-50 mb-4">
                 <div class="flex items-center gap-2">
-                  <svg class="w-4 h-4 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" />
-                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z" />
+                  <svg
+                    class="w-4 h-4 shrink-0"
+                    fill="none"
+                    stroke="currentColor"
+                    viewBox="0 0 24 24"
+                    aria-hidden="true"
+                  >
+                    <path
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"
+                    />
+                    <path
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"
+                    />
                   </svg>
                   <span>{job.location}</span>
                 </div>
                 <span class="px-2 py-0.5 bg-white/5 rounded text-xs">{job.type}</span>
                 {job.salary && <span class="text-pycon-yellow">{job.salary}</span>}
               </div>
 
-              <a href={job.apply_url} target="_blank" rel="noopener noreferrer" aria-label={`${job.title} en ${job.company} ${t.apply} ${t.location}: ${job.location}`} class="inline-flex items-center gap-2 px-4 py-2 bg-pycon-orange text-white font-bold rounded-lg hover:bg-white hover:text-pycon-orange transition-colors focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-pycon-orange">
+              <a
+                href={job.apply_url}
+                target="_blank"
+                rel="noopener noreferrer"
+                aria-label={`${job.title} en ${job.company} ${t.apply} ${t.location}: ${job.location}`}
+                class="inline-flex items-center gap-2 px-4 py-2 bg-pycon-orange text-white font-bold rounded-lg hover:bg-white hover:text-pycon-orange transition-colors focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-pycon-orange"
+              >
                 {t.apply}
                 <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />
+                  <path
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
+                  />
                 </svg>
               </a>
             </footer>
@@ -142,4 +183,4 @@ const isFeatured = (tier?: string) => tier === 'gold' || tier === 'platinum'
       animation: none;
     }
   }
-</style>
+</style>

src/data/jobs/_plantilla-oferta.md

@@ -1,12 +1,12 @@
 ---
-title: "Nombre del puesto"
-company: "Nombre de la empresa"
-location: "Remoto / Madrid / Barcelona"
-type: "Full-time"
-description: "Descripción breve del puesto. Explica qué harás, el equipo, el proyecto, etc."
+title: 'Nombre del puesto'
+company: 'Nombre de la empresa'
+location: 'Remoto / Madrid / Barcelona'
+type: 'Full-time'
+description: 'Descripción breve del puesto. Explica qué harás, el equipo, el proyecto, etc.'
 skills: [Python, Django, PostgreSQL]
-salary: "35k-50k"
-apply_url: "https://ejemplo.com/careers"
-tier: "gold"
+salary: '35k-50k'
+apply_url: 'https://ejemplo.com/careers'
+tier: 'gold'
 draft: true
----
+---

tsconfig.json

@@ -1,6 +1,6 @@
 {
   "extends": "astro/tsconfigs/base",
-  "include": ["src/**/*"], 
+  "include": ["src/**/*"],
   "compilerOptions": {
     "baseUrl": ".",
     "paths": {