Fix video rendering on docs (#14764)

Release Notes:

- N/A

docs/src/multibuffers.md

@@ -4,7 +4,14 @@ One of the superpowers Zed gives you is the ability to edit multiple files simul
 
 ## Editing in a multibuffer
 
-![Editing the results of a search multibuffer.](https://customer-snccc0j9v3kfzkif.cloudflarestream.com/bda0a6584c19f4b39e58a263c0ae4358/downloads/default.mp4)
+<div class="video" style="position: relative; padding-top: 71.71314741035857%;">
+  <iframe
+    src="https://customer-snccc0j9v3kfzkif.cloudflarestream.com/bda0a6584c19f4b39e58a263c0ae4358/iframe?muted=true&preload=true&loop=true&autoplay=true&poster=https%3A%2F%2Fcustomer-snccc0j9v3kfzkif.cloudflarestream.com%2Fbda0a6584c19f4b39e58a263c0ae4358%2Fthumbnails%2Fthumbnail.jpg%3Ftime%3D%26height%3D600&controls=false"
+    style="border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%;"
+    allow="accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;"
+    allowfullscreen="true"
+  ></iframe>
+</div>
 
 Editing a multibuffer is the same as editing a normal file. Changes you make will be reflected in the open copies of that file in the rest of the editor, and you can save all files with `editor: Save` (bound to `cmd-s` on macOS, `ctrl-s` on Windows/Linux, or `:w` in Vim mode).
 

docs/theme/css/general.css

@@ -119,7 +119,9 @@ h6:target::before {
 .page {
     outline: 0;
     padding: 0 var(--page-padding);
-  margin-block-start: calc(0px - var(--menu-bar-height)); /* Compensate for the #menu-bar-hover-placeholder */
+    margin-block-start: calc(
+        0px - var(--menu-bar-height)
+    ); /* Compensate for the #menu-bar-hover-placeholder */
 }
 .page-wrapper {
     box-sizing: border-box;
@@ -149,6 +151,10 @@ h6:target::before {
 .content p {
     line-height: 1.625em;
 }
+.content div.video {
+    margin-top: 0.5rem;
+    margin-bottom: 3rem;
+}
 .content ol {
     line-height: 1.625em;
 }
@@ -175,6 +181,11 @@ h6:target::before {
     text-decoration: none;
 }
 
+iframe {
+    margin-top: 1rem;
+    margin-bottom: 10rem;
+}
+
 table {
     margin: 0 auto;
     border-collapse: collapse;
@@ -293,7 +304,9 @@ kbd {
     visibility: hidden;
     color: #fff;
     background-color: #333;
-  transform: translateX(-50%); /* Center by moving tooltip 50% of its width left */
+    transform: translateX(
+        -50%
+    ); /* Center by moving tooltip 50% of its width left */
     left: -8px; /* Half of the width of the icon */
     top: -35px;
     font-size: 0.8em;