From 2151cac2e867fd415e5a622d837bca163c6c496b Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Tue, 17 Mar 2026 10:26:38 +0000
Subject: [PATCH 1/3] Initial plan


From 1895805a26c3a02dcb1f5d27763b0d2ecc5750fa Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Tue, 17 Mar 2026 10:30:37 +0000
Subject: [PATCH 2/3] Add Getting Started video section to homepage

Co-authored-by: garrytrinder <11563347+garrytrinder@users.noreply.github.com>
---
 src/pages/index.astro | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/src/pages/index.astro b/src/pages/index.astro
index 8b00997..e1309da 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -245,6 +245,29 @@ import Layout from '../layouts/Layout.astro';
     </div>
   </section>
 
+  <!-- Getting started video -->
+  <section class="py-32 px-6 sm:px-8">
+    <div class="max-w-4xl mx-auto text-center">
+      <p class="section-reveal text-sm font-semibold tracking-widest uppercase text-purple-400 mb-4">See It In Action</p>
+      <h2 class="section-reveal text-3xl md:text-5xl font-bold mb-8">Get started with Dev Proxy.</h2>
+      <p class="section-reveal text-lg md:text-xl mb-12" style="color: var(--text-muted);">
+        Watch how to set up Dev Proxy and start testing your app in minutes.
+      </p>
+      <div class="section-reveal rounded-2xl border overflow-hidden" style="border-color: var(--border-primary);">
+        <div style="position: relative; padding-bottom: 56.25%; height: 0;">
+          <iframe
+            src="https://www.youtube-nocookie.com/embed/HVTJlGSxhcw"
+            title="Get started with Dev Proxy"
+            style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
+            frameborder="0"
+            allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+            allowfullscreen
+          ></iframe>
+        </div>
+      </div>
+    </div>
+  </section>
+
   <!-- Quick start scenarios -->
   <section class="py-32 px-6 sm:px-8" style="background: var(--bg-secondary);">
     <div class="max-w-5xl mx-auto">

From 20c2a63334da461de197e72da895c0113b7a1b18 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Tue, 17 Mar 2026 10:31:26 +0000
Subject: [PATCH 3/3] Replace deprecated frameborder attribute with CSS border:
 0

Co-authored-by: garrytrinder <11563347+garrytrinder@users.noreply.github.com>
---
 src/pages/index.astro | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/pages/index.astro b/src/pages/index.astro
index e1309da..4370556 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -258,8 +258,7 @@ import Layout from '../layouts/Layout.astro';
           <iframe
             src="https://www.youtube-nocookie.com/embed/HVTJlGSxhcw"
             title="Get started with Dev Proxy"
-            style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
-            frameborder="0"
+            style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;"
             allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
             allowfullscreen
           ></iframe>