From cf94936fa568351b994a6a8e3f15bcf98301ef68 Mon Sep 17 00:00:00 2001
From: Fernando <fernando@ornitonautas.com>
Date: Mon, 13 Jul 2026 12:54:02 +0200
Subject: [PATCH] =?UTF-8?q?feat:=20update=20nav=20with=20Formaci=C3=B3n,?=
 =?UTF-8?q?=20Comunidad,=20Sobre=20nosotros?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Add Formación and Sobre nosotros pages
- Update Header nav with full menu items
- Breakpoint changed to lg for nav to fit all items
- Mobile menu updated with all items
---
 src/components/Header.astro          | 14 +++++++-----
 src/pages/formacion/index.astro      | 33 ++++++++++++++++++++++++++++
 src/pages/sobre-nosotros/index.astro | 33 ++++++++++++++++++++++++++++
 3 files changed, 75 insertions(+), 5 deletions(-)
 create mode 100644 src/pages/formacion/index.astro
 create mode 100644 src/pages/sobre-nosotros/index.astro

diff --git a/src/components/Header.astro b/src/components/Header.astro
index 178068d..ef9db12 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -16,10 +16,12 @@ const currentPath = Astro.url.pathname;
     </div>
   </a>
 
-  <nav class="hidden md:flex items-center gap-8 text-[14.5px] font-semibold">
+  <nav class="hidden lg:flex items-center gap-7 text-[14px] font-semibold">
+    <a href="/formacion/" class={`transition-colors hover:text-orange ${currentPath.includes('/formacion') ? 'text-orange' : 'text-text'}`}>Formación</a>
     <a href="/campus/" class={`transition-colors hover:text-orange ${currentPath.includes('/campus') ? 'text-orange' : 'text-text'}`}>FP España</a>
     <a href="/aprendizaje/" class={`transition-colors hover:text-orange ${currentPath.includes('/aprendizaje') ? 'text-orange' : 'text-text'}`}>Rutas</a>
-    <a href="/comunidad/" class={`transition-colors hover:text-orange ${currentPath.includes('/comunidad') ? 'text-orange' : 'text-text'}`}>Recursos</a>
+    <a href="/comunidad/" class={`transition-colors hover:text-orange ${currentPath.includes('/comunidad') ? 'text-orange' : 'text-text'}`}>Comunidad</a>
+    <a href="/sobre-nosotros/" class={`transition-colors hover:text-orange ${currentPath.includes('/sobre-nosotros') ? 'text-orange' : 'text-text'}`}>Sobre nosotros</a>
   </nav>
 
   <div class="flex items-center gap-3.5">
@@ -31,7 +33,7 @@ const currentPath = Astro.url.pathname;
 
   <button
     type="button"
-    class="md:hidden p-2 text-text hover:text-orange"
+    class="lg:hidden p-2 text-text hover:text-orange"
     aria-label="Abrir menú"
     id="mobile-menu-button"
   >
@@ -41,11 +43,13 @@ const currentPath = Astro.url.pathname;
   </button>
 </header>
 
-<div class="md:hidden hidden px-10 py-4 border-b border-line" id="mobile-menu">
+<div class="lg:hidden hidden px-10 py-4 border-b border-line" id="mobile-menu">
   <nav class="flex flex-col gap-2 text-sm font-semibold">
+    <a href="/formacion/" class="py-2 px-4 rounded-lg hover:bg-mist transition-colors">Formación</a>
     <a href="/campus/" class="py-2 px-4 rounded-lg hover:bg-mist transition-colors">FP España</a>
     <a href="/aprendizaje/" class="py-2 px-4 rounded-lg hover:bg-mist transition-colors">Rutas</a>
-    <a href="/comunidad/" class="py-2 px-4 rounded-lg hover:bg-mist transition-colors">Recursos</a>
+    <a href="/comunidad/" class="py-2 px-4 rounded-lg hover:bg-mist transition-colors">Comunidad</a>
+    <a href="/sobre-nosotros/" class="py-2 px-4 rounded-lg hover:bg-mist transition-colors">Sobre nosotros</a>
     <a href="/contacto/" class="py-2 px-4 rounded-lg hover:bg-mist transition-colors">Iniciar sesión</a>
   </nav>
 </div>
diff --git a/src/pages/formacion/index.astro b/src/pages/formacion/index.astro
new file mode 100644
index 0000000..9d5b640
--- /dev/null
+++ b/src/pages/formacion/index.astro
@@ -0,0 +1,33 @@
+---
+import BaseLayout from '../../layouts/BaseLayout.astro';
+import Header from '../../components/Header.astro';
+import Footer from '../../components/Footer.astro';
+---
+
+<BaseLayout
+  title="Formación - Ornitonautas"
+  description="Formación Profesional en informática. Ciclos formativos, módulos y recursos de aprendizaje."
+>
+  <Header lang="es" />
+
+  <main id="main-content">
+    <section class="py-16 bg-gradient-to-br from-blue-50 to-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <h1 class="text-3xl font-bold text-slate-900 mb-4">Formación</h1>
+        <p class="text-lg text-slate-600 max-w-3xl">
+          Explora nuestra oferta formativa en FP informática. Ciclos, módulos y itinerarios personalizados.
+        </p>
+      </div>
+    </section>
+
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <p class="text-slate-600">
+          Contenido próximamente.
+        </p>
+      </div>
+    </section>
+  </main>
+
+  <Footer />
+</BaseLayout>
diff --git a/src/pages/sobre-nosotros/index.astro b/src/pages/sobre-nosotros/index.astro
new file mode 100644
index 0000000..316946f
--- /dev/null
+++ b/src/pages/sobre-nosotros/index.astro
@@ -0,0 +1,33 @@
+---
+import BaseLayout from '../../layouts/BaseLayout.astro';
+import Header from '../../components/Header.astro';
+import Footer from '../../components/Footer.astro';
+---
+
+<BaseLayout
+  title="Sobre nosotros - Ornitonautas"
+  description="Conoce a Ornitonautas. Un proyecto educativo para la Formación Profesional en informática en España."
+>
+  <Header lang="es" />
+
+  <main id="main-content">
+    <section class="py-16 bg-gradient-to-br from-blue-50 to-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <h1 class="text-3xl font-bold text-slate-900 mb-4">Sobre nosotros</h1>
+        <p class="text-lg text-slate-600 max-w-3xl">
+          Ornitonautas es un proyecto educativo dedicado a la Formación Profesional en informática en España.
+        </p>
+      </div>
+    </section>
+
+    <section class="py-16 bg-white">
+      <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+        <p class="text-slate-600">
+          Contenido próximamente.
+        </p>
+      </div>
+    </section>
+  </main>
+
+  <Footer />
+</BaseLayout>