Configuración Beta de los Posts

src/components/Navbar.astro

@@ -1,10 +1,11 @@
 ---
 import { Image } from "astro:assets";
+const { home, posts, proyectos } = Astro.props;
 ---
 
 <nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top">
   <div class="container">
-    <a class="navbar-brand d-flex align-items-center" href="#">
+    <a class="navbar-brand d-flex align-items-center" href={home ? home : "/"}>
       <Image
         src="/imgs/logo.png"
         alt="Logo Ecobjetivos"
@@ -28,11 +29,10 @@ import { Image } from "astro:assets";
     <div class="collapse navbar-collapse" id="navbarNav">
       <ul class="navbar-nav ms-auto">
         <li class="nav-item">
-          <a type="button" class="nav-link btn btn-light" href="#posts">Posts</a
-          >
+          <a type="button" class="nav-link btn btn-light" href={posts ? posts : "#posts"}>Posts</a>
         </li>
         <li class="nav-item">
-          <a type="button" class="nav-link btn btn-light" href="#proyectos"
+          <a type="button" class="nav-link btn btn-light" href={proyectos ? proyectos : "#proyectos"}
             >Proyectos</a
           >
         </li>

src/components/PostsRelacionados.astro

@@ -0,0 +1,28 @@
+---
+const { currentPost } = Astro.props;
+
+// Aquí deberías implementar la lógica para obtener posts relacionados
+// Por ejemplo, basándote en categorías, tags, o algún otro criterio
+const relatedPosts = [{ title: "Prueba", excerpt: "Prueba", url: "Prueba" }];
+---
+
+<section class="related-posts mt-5">
+    <h2>Posts Relacionados</h2>
+    <div class="row">
+        {
+            relatedPosts.map((post) => (
+                <div class="col-md-4 mb-4">
+                    <div class="card">
+                        <div class="card-body">
+                            <h5 class="card-title">{post.title}</h5>
+                            <p class="card-text">{post.excerpt}</p>
+                            <a href={post.url} class="btn btn-primary">
+                                Leer más
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            ))
+        }
+    </div>
+</section>