From 1286872aa93cdeee109370f4242f791a51e53099 Mon Sep 17 00:00:00 2001
From: Julien Calixte <juliencalixte@gmail.com>
Date: Tue, 6 Apr 2021 00:19:49 +0200
Subject: [PATCH] :sparkles: (youtube) imbedded videos

---
 src/hooks/useMarkdown.hook.ts | 24 ++++++++++++++++--------
 1 file changed, 16 insertions(+), 8 deletions(-)

diff --git a/src/hooks/useMarkdown.hook.ts b/src/hooks/useMarkdown.hook.ts
index 7988974..d12da0d 100644
--- a/src/hooks/useMarkdown.hook.ts
+++ b/src/hooks/useMarkdown.hook.ts
@@ -1,18 +1,26 @@
 import MarkdownIt from 'markdown-it'
 import markdownItClass from '@toycode/markdown-it-class'
+import blockEmbedPlugin from 'markdown-it-block-embed'
+import { NOTE_WIDTH } from '@/constants/note-width'
 
 const md = new MarkdownIt({
   typographer: true,
   quotes: ['«\xA0', '\xA0»', '‹\xA0', '\xA0›']
-}).use(markdownItClass, {
-  h1: ['title', 'is-2'],
-  h2: ['title', 'is-3'],
-  h3: ['title', 'is-4'],
-  h4: ['title', 'is-5'],
-  h5: ['title', 'is-6'],
-  h6: ['title', 'is-6'],
-  table: ['table', 'is-striped', 'is-hoverable']
 })
+  .use(markdownItClass, {
+    h1: ['title', 'is-2'],
+    h2: ['title', 'is-3'],
+    h3: ['title', 'is-4'],
+    h4: ['title', 'is-5'],
+    h5: ['title', 'is-6'],
+    h6: ['title', 'is-6'],
+    table: ['table', 'is-striped', 'is-hoverable']
+  })
+  .use(blockEmbedPlugin, {
+    youtube: {
+      width: NOTE_WIDTH - 80
+    }
+  })
 
 export const useMarkdown = () => {
   return {