Update BackLink and add AboutMeSection and SocialSection

src/components/BackLink.astro

@@ -1,11 +1,28 @@
 ---
 import { ArrowLeft } from 'lucide-preact'
 import Link from './Link.astro'
+
+const { href } = Astro.props
 ---
 
 <Link
-	class='p-4 h-fit border-2 border-[#282828] bg-[#0E0F11] hover:border-white transition-colors rounded-full'
-	href='javascript: history.go(-1)'
+	class='p-4 h-fit border-2 border-[#282828] bg-[#0E0F11] hover:border-white transition-colors rounded-full cursor-pointer'
 >
 	<ArrowLeft size={16} />
 </Link>
+
+<script>
+	import { navigate } from 'astro:transitions/client'
+
+	document.addEventListener('astro:page-load', () => {
+		const button = document.querySelector('a')
+
+		button?.addEventListener('click', () => {
+			if (document.referrer.includes(window.location.origin)) {
+				history.back()
+			} else {
+				navigate('/')
+			}
+		})
+	})
+</script>

src/components/sections/AboutMeSection.astro

@@ -0,0 +1,26 @@
+---
+import Section from '../Section.astro'
+import Link from '../Link.astro'
+import ExternalLink from '../ExternalLink.astro'
+---
+
+<Section>
+	<p class='leading-7 sm:px-4 sm:text-center'>
+		Apasionado por el desarrollo y ansioso por crecer en este fascinante campo. Encuéntrame en
+		<ExternalLink
+			href='https://www.linkedin.com/in/danielcarmonagilibert/'
+			class='inline-flex underline decoration-dotted underline-offset-2 border-0'
+		>
+			LinkedIn
+		</ExternalLink> para una respuesta rápida.
+	</p>
+
+	<!-- <p class='leading-7 sm:px-4 sm:text-center'>
+		Enviame un mensaje <Link
+			href='/contact'
+			class='inline-flex underline decoration-dotted underline-offset-2 border-0'
+		>
+			contacto
+		</Link>
+	</p> -->
+</Section>

src/components/sections/SocialSection.astro

@@ -12,7 +12,7 @@ import { networks } from '../../config/social'
 		networks.map((network) => (
 			<ExternalLink
 				href={network.url}
-				class=' w-full h-full p-2.5 md:py-4  opacity-80 ease-in transition-all hover:opacity-100  '
+				class=' w-full h-full p-2.5 md:py-6  opacity-80 ease-in transition-all hover:opacity-100  '
 			>
 				<Fragment set:html={network.icon} />
 			</ExternalLink>

src/pages/index.astro

@@ -1,14 +1,13 @@
 ---
-import { Copy, Linkedin, Github, ArrowUpRight, Check } from 'lucide-preact'
+import StackSection from '../components/sections/StackSection.astro'
+import SocialSection from '../components/sections/SocialSection.astro'
+import ProjectSection from '../components/sections/ProjectSection.astro'
 import Layout from '../layouts/Layout.astro'
 import ExternalLink from '../components/ExternalLink.astro'
-import Section from '../components/Section.astro'
-import Link from '../components/Link.astro'
-import { Image } from 'astro:assets'
-import SocialSection from '../components/sections/SocialSection.astro'
-import StackSection from '../components/sections/StackSection.astro'
 import BlogSection from '../components/sections/BlogSection.astro'
-import ProjectSection from '../components/sections/ProjectSection.astro'
+import AboutMeSection from '../components/sections/AboutMeSection.astro'
+import { Image } from 'astro:assets'
+import { Copy, Linkedin, Github, ArrowUpRight, Check } from 'lucide-preact'
 ---
 
 <Layout title='Home'>
@@ -49,18 +48,7 @@ import ProjectSection from '../components/sections/ProjectSection.astro'
 		</div>
 	</header>
 
-	<Section>
-		<p class='leading-7 sm:px-4 sm:text-center'>
-			Apasionado por el desarrollo y ansioso por crecer en este fascinante campo. Encuéntrame en
-			<Link
-				href='https://www.linkedin.com/in/danielcarmonagilibert/'
-				class='inline-flex underline decoration-dotted underline-offset-2'
-			>
-				LinkedIn
-			</Link> para una respuesta rápida.
-		</p>
-	</Section>
-
+	<AboutMeSection />
 	<ProjectSection />
 	<BlogSection />
 	<StackSection />