From a5d3919b8e701cc4e1823f9dca201b5bf161a8ce Mon Sep 17 00:00:00 2001
From: Matias Meno <m@tias.me>
Date: Sun, 20 Oct 2024 12:36:16 +0200
Subject: [PATCH] Add Video teaser

---
 src/lib/MenoTeaser.svelte | 31 +++++++++++++++++++++++++++++++
 src/routes/index.svelte   |  5 ++++-
 2 files changed, 35 insertions(+), 1 deletion(-)
 create mode 100644 src/lib/MenoTeaser.svelte

diff --git a/src/lib/MenoTeaser.svelte b/src/lib/MenoTeaser.svelte
new file mode 100644
index 0000000..10836c4
--- /dev/null
+++ b/src/lib/MenoTeaser.svelte
@@ -0,0 +1,31 @@
+<script>
+  import ContentSection from './ContentSection.svelte'
+  import Heading from './Heading.svelte'
+</script>
+
+<ContentSection>
+  <Heading subtitle="New music video">Don’t look back</Heading>
+
+  <p>
+    I just released a new music video: <strong>Don’t look back</strong>. Maybe
+    you want to check it out.
+  </p>
+
+  <iframe
+    width="560"
+    height="315"
+    src="https://www.youtube.com/embed/zZ3tTxN7imk"
+    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
+  />
+</ContentSection>
+
+<style lang="postcss">
+  iframe {
+    display: block;
+    max-width: 100%;
+  }
+</style>
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index 4c84f2a..536b214 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -7,6 +7,7 @@
   import Intro from '$lib/Intro.svelte'
   import MainFeature from '$lib/MainFeature.svelte'
   import MainFeatures from '$lib/MainFeatures.svelte'
+  import MenoTeaser from '$lib/MenoTeaser.svelte'
   import Seo from '$lib/Seo.svelte'
   import StyledLink from '$lib/StyledLink.svelte'
   import PlusIcon from '~icons/ion/plus-round'
@@ -86,7 +87,9 @@
   </MainFeatures>
 </ContentSection>
 
-<ContentSection>
+<MenoTeaser />
+
+<ContentSection backgroundColor="white">
   <Heading subtitle="And it's easy to add the features you want"
     >Dropzone.js comes feature packed</Heading
   >