From 1f66a7c2325071cc2681ed6418c29436d74ab694 Mon Sep 17 00:00:00 2001
From: andrewlalis <me@andrewlalis.com>
Date: Thu, 23 Apr 2026 13:05:34 -0400
Subject: [PATCH] Add youtube iframes.

---
 app/src/views/HikingView.vue | 24 ++++++++++++++++++++++++
 1 file changed, 24 insertions(+)

diff --git a/app/src/views/HikingView.vue b/app/src/views/HikingView.vue
index 1b9f204..736f453 100644
--- a/app/src/views/HikingView.vue
+++ b/app/src/views/HikingView.vue
@@ -39,6 +39,15 @@
         >
         <a href="https://youtu.be/IYo8F3gedn0" class="youtube-link" target="_blank">YouTube</a>
       </div>
+      <iframe
+        class="youtube-iframe"
+        src="https://www.youtube.com/embed/IYo8F3gedn0?si=_fKkrPqxc3_69dtC"
+        title="YouTube video player"
+        frameborder="0"
+        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+        referrerpolicy="strict-origin-when-cross-origin"
+        allowfullscreen
+      ></iframe>
     </div>
     <div class="hiking-entry">
       <header>
@@ -74,6 +83,15 @@
         >
         <a href="https://youtu.be/9A5dGchdbeM" class="youtube-link" target="_blank">YouTube</a>
       </div>
+      <iframe
+        class="youtube-iframe"
+        src="https://www.youtube.com/embed/9A5dGchdbeM?si=HPpFld_JKBSl8hsn"
+        title="YouTube video player"
+        frameborder="0"
+        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+        referrerpolicy="strict-origin-when-cross-origin"
+        allowfullscreen
+      ></iframe>
     </div>
     <div class="hiking-entry">
       <header>
@@ -177,6 +195,12 @@
 .youtube-link:hover {
   text-decoration: underline;
 }
+.youtube-iframe {
+  width: calc(50ch - 2rem);
+  height: 315px;
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem;
+}
 .elevation {
   font-weight: bold;
   color: var(--success-color);