From fc749952f4162bf10b84c229dbe5134091540133 Mon Sep 17 00:00:00 2001
From: Quentin <qlebastard@gmail.com>
Date: Mon, 12 Feb 2024 10:43:03 +0100
Subject: [PATCH] add youtube via tutorial

---
 _includes/customize_keyboard.md |  3 ++-
 _includes/youtube.html          | 23 +++++++++++++++++++++++
 2 files changed, 25 insertions(+), 1 deletion(-)
 create mode 100644 _includes/youtube.html

diff --git a/_includes/customize_keyboard.md b/_includes/customize_keyboard.md
index 045d580..42b9531 100644
--- a/_includes/customize_keyboard.md
+++ b/_includes/customize_keyboard.md
@@ -44,7 +44,8 @@ You can find the latest **default images** for all Bastard Keyboards in the rele
 
 All Bastard Keyboards come flashed with VIA. You can open the [VIA Web Interface through use.via.app](https://usevia.app/). At the moment, only WebHID-enabled browsers work (eg. Chrome and Chromium-based).
 
-![](../assets/pics/guides/generic/6.jpg)
+You can check the following tutorial on how to use it:
+{% include youtube.html id="cYICAlliJfU" %}
 
 Through VIA, you can customize:
 - the keymap
diff --git a/_includes/youtube.html b/_includes/youtube.html
new file mode 100644
index 0000000..0489409
--- /dev/null
+++ b/_includes/youtube.html
@@ -0,0 +1,23 @@
+<div class="embed-container">
+    <iframe width="640" height="390" 
+    src="https://www.youtube.com/embed/{{ include.id }}" 
+    frameborder="0" allowfullscreen></iframe>
+</div>
+<style>
+.embed-container {
+  position: relative;
+  padding-bottom: 56.25%;
+  height: 0;
+  overflow: hidden;
+  max-width: 100%;
+}
+.embed-container iframe,
+.embed-container object,
+.embed-container embed {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+</style>
\ No newline at end of file