fix: update presentation details and improve layout with YouTube links

Author: paripsky

src/components/Presentations.astro

@@ -8,6 +8,7 @@ const presentations = [
       "A deep dive into the useEffect hook, how it works, how to use it effectively and common pitfalls",
     siteUrl:
       "https://docs.google.com/presentation/d/1MK3Hrkw-rDUd1p5TRHI7okgMPMzz5kxrRjx0MIa1srA",
+    youtubeUrl: "https://youtu.be/EvrJbFoBy_w",
     tags: ["React"],
   },
   {
@@ -43,12 +44,25 @@ const presentations = [
           {presentation.description}
         </h3>
         <div class="mt-auto flex flex-wrap gap-2 justify-between py-4">
-          <a
-            href={presentation.siteUrl}
-            class="text-sky-300 flex items-center gap-1 hover:underline"
-          >
-            Read more <Icon name="mdi:arrow-right" class="size-4" />
-          </a>
+          <div class="flex gap-4">
+            <a
+              href={presentation.siteUrl}
+              class="text-sky-300 flex items-center gap-1 hover:underline"
+              target="_blank"
+            >
+              Check out <Icon name="mdi:arrow-right" class="size-4" />
+            </a>
+            {presentation.youtubeUrl && (
+              <a
+                href={presentation.youtubeUrl}
+                class="text-sky-300 flex items-center gap-1 hover:underline"
+                target="_blank"
+              >
+                Watch on YouTube
+                <Icon name="mdi:youtube" class="size-4" />
+              </a>
+            )}
+          </div>
           <ul class="flex gap-2">
             {presentation.tags.map((tag) => (
               <li class="bg-slate-900 px-2 py-1 text-neutral-300 rounded">

src/pages/index.astro

@@ -56,7 +56,7 @@ const posts = Object.values(postsGlob).map(
       <h1
         class="text-[clamp(2rem,7vw,3rem)] leading-tight font-medium tracking-tight motion-preset-slide-up motion-preset-fade-lg"
       >
-        Hi, I'm Yonatan.
+        Hi, I'm Jonathan.
       </h1>
       <h2
         class="text-xl font-light text-pretty leading-relaxed text-neutral-300 max-sm:text-sm motion-preset-slide-up motion-preset-fade-lg motion-delay-300"