Fix youtube embed issues & improve layout

server/src/client/assets/css/style.css

@@ -289,7 +289,7 @@ header {
     background: var(--color-bg);
 
     &>:first-child {
-        margin: unset;
+        margin-block-end: var(--default-padding);
     }
 
     h1 {
@@ -367,6 +367,12 @@ header {
 
 }
 
+iframe {
+    max-inline-size: 100%;
+    appearance: unset;
+    border: var(--border);
+}
+
 footer {
     border-block-start: var(--border);
     margin-block-start: calc(var(--default-padding) * 6);
@@ -420,8 +426,7 @@ footer {
 
 main {
     min-block-size: 100svb;
-    margin-block: var(--default-padding) 40svb;
+    margin: var(--default-padding) auto;
-    margin-inline: auto;
     max-inline-size: min(60ch, 80%);
     padding-block: var(--default-padding);
     gap: var(--default-padding);
@@ -488,7 +493,12 @@ main {
         flex-direction: row;
         justify-content: space-between;
 
+        &>:first-child {
+            margin-block-end: unset;
+        }
+
         nav {
+
             justify-content: flex-end;
             box-sizing: border-box;
         }

server/src/server/routes/api/editor.rs

@@ -98,7 +98,7 @@ impl Block {
                 &height.to_string(),
                 "\" src=\"",
                 embed,
-                "\"></iframe>",
+                "\" allowfullscreen></iframe>",
             ]
             .concat(),
             Block::image { file, caption } => {