From cb5ae8f35496165c639b5a666d519af3ce19860a Mon Sep 17 00:00:00 2001
From: Himanshu Mishra <himanshu@orkohunter.net>
Date: Mon, 28 Mar 2022 16:02:23 +0200
Subject: [PATCH 1/2] make backstage.io/live responsive

Signed-off-by: Himanshu Mishra <himanshu@orkohunter.net>
---
 microsite/pages/en/live.js | 16 +++++++---------
 1 file changed, 7 insertions(+), 9 deletions(-)

diff --git a/microsite/pages/en/live.js b/microsite/pages/en/live.js
index 0cde700697..90f7d359ca 100644
--- a/microsite/pages/en/live.js
+++ b/microsite/pages/en/live.js
@@ -30,26 +30,24 @@ const Background = props => {
         </Block.Container>
       </Block>
 
-      <Block className="stripe bg-black">
+      <Block className="stripe bg-black" >
         <Block.Container style={{ justifyContent: 'flex-start' }}>
-          <Block.Paragraph>
+          <Block.MediaFrame >
             <iframe
-              width="1280"
-              height="720"
               src="https://www.youtube.com/embed/mFi_X58igzk"
               title="YouTube video player"
               frameborder="0"
               allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
               allowfullscreen
             ></iframe>
-          </Block.Paragraph>
-          <Block.TextBox>
+          </Block.MediaFrame>
+          <Block.MediaFrame >
             <iframe
+              width="300"
+              height="500"
               src="https://www.youtube.com/live_chat?v=mFi_X58igzk&embed_domain=backstage.io&dark_theme=1"
-              width="400px"
-              height="680px"
             ></iframe>
-          </Block.TextBox>
+          </Block.MediaFrame>
         </Block.Container>
       </Block>
 

From 1555e5d0d27d16be563f35d9ba53cec5515415df Mon Sep 17 00:00:00 2001
From: Himanshu Mishra <himanshu@orkohunter.net>
Date: Mon, 28 Mar 2022 16:17:20 +0200
Subject: [PATCH 2/2] prettier for microsite is different than main project

Signed-off-by: Himanshu Mishra <himanshu@orkohunter.net>
---
 microsite/pages/en/live.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/microsite/pages/en/live.js b/microsite/pages/en/live.js
index 90f7d359ca..374b690d89 100644
--- a/microsite/pages/en/live.js
+++ b/microsite/pages/en/live.js
@@ -30,9 +30,9 @@ const Background = props => {
         </Block.Container>
       </Block>
 
-      <Block className="stripe bg-black" >
+      <Block className="stripe bg-black">
         <Block.Container style={{ justifyContent: 'flex-start' }}>
-          <Block.MediaFrame >
+          <Block.MediaFrame>
             <iframe
               src="https://www.youtube.com/embed/mFi_X58igzk"
               title="YouTube video player"
@@ -41,7 +41,7 @@ const Background = props => {
               allowfullscreen
             ></iframe>
           </Block.MediaFrame>
-          <Block.MediaFrame >
+          <Block.MediaFrame>
             <iframe
               width="300"
               height="500"