Refactor Section component to accept title prop and update usage in About, Experience, Projects, and Skills components for improved consistency and semantic structure

This commit is contained in:
aferrer committed 2025-11-01 12:06:32 +00:00
1 parent 332ea17e6f
commit c53b645ed4
5 files changed
+13 -17

No files matched your search

+1 -4
View File
@@ -5,10 +5,7 @@ const { aboutMe } = Astro.props;
--- ---
<Section id="about-me"> <Section id="about-me" title="Acerca de mí">
<h3 class="text-3xl font-bold text-gray-100 text-center mb-10">
Acerca de mí
</h3>
{aboutMe.split("\n").map((line: string) => ( {aboutMe.split("\n").map((line: string) => (
line.trim() !== "" ? ( line.trim() !== "" ? (
<p class="text-gray-300 mb-4 text-wrap">{line}</p> <p class="text-gray-300 mb-4 text-wrap">{line}</p>
+1 -4
View File
@@ -11,10 +11,7 @@ interface ExperienceProps {
} }
--- ---
<Section id="experience"> <Section id="experience" title="Experiencia">
<h3 class="text-3xl font-bold text-white text-center mb-10">
Experiencia
</h3>
<!-- Contenedor del timeline --> <!-- Contenedor del timeline -->
<div class="relative"> <div class="relative">
<div class="absolute top-8 bottom-8 w-px"> <div class="absolute top-8 bottom-8 w-px">
+1 -4
View File
@@ -18,10 +18,7 @@ interface ProjectProps {
repoUrl: string; repoUrl: string;
} }
--- ---
<Section id="projects"> <Section id="projects" title="Proyectos">
<h3 class="text-3xl font-bold text-white text-center mb-10">
Proyectos
</h3>
<div class="space-y-12"> <div class="space-y-12">
{ {
projects.map((project: ProjectProps) => ( projects.map((project: ProjectProps) => (
+1 -4
View File
@@ -10,10 +10,7 @@ interface SkillProps {
} }
--- ---
<Section id="skills"> <Section id="skills" title="Habilidades">
<h3 class="text-3xl font-bold text-white text-center mb-10">
Habilidades
</h3>
<div class="flex flex-wrap gap-6 justify-center md:justify-start"> <div class="flex flex-wrap gap-6 justify-center md:justify-start">
{skills.map((skill:SkillProps) => ( {skills.map((skill:SkillProps) => (
<div class="flex flex-col items-center justify-center w-24 md:w-28 p-6"> <div class="flex flex-col items-center justify-center w-24 md:w-28 p-6">
+9 -1
View File
@@ -1,3 +1,11 @@
<section class="container mx-auto md:max-w-7xl md:px-6 py-12 md:py-20" id={Astro.props.id}> ---
const { id, title } = Astro.props;
---
<section class="container mx-auto md:max-w-7xl md:px-6 py-12 md:py-20" id={id}>
{title && (
<h3 class="text-3xl font-bold text-gray-100 text-center mb-10">
{title}
</h3>
)}
<slot /> <slot />
</section> </section>