fernando/ornitoweb
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: update nav with Formación, Comunidad, Sobre nosotros

Browse source 
- 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
This commit is contained in:
Fernando 2026-07-13 12:54:02 +02:00
parent a9057de351
commit cf94936fa5
3 changed files with 75 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/components/Header.astro
View file

@ -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>

33
src/pages/formacion/index.astro Normal file
View file

@ -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>

33
src/pages/sobre-nosotros/index.astro Normal file
View file

@ -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>