docs: add video to quickstart (#7512)

docs/src/components/player.jsx

@@ -0,0 +1,17 @@
+import React from "react";
+import ReactPlayer from 'react-player'
+
+export function ResponsivePlayer({ url, ...props }) {
+
+return (
+    <div className='player-wrapper'>
+        <ReactPlayer
+        className='react-player'
+        url={url}
+        width='100%'
+        height='100%'
+        {...props}
+        />
+    </div>
+    );
+}

docs/src/css/custom.css

@@ -600,3 +600,16 @@ p strong {
 :root[data-theme="dark"] .hideonlight {
   display: block !important;
 }
+
+
+.player-wrapper {
+  position: relative;
+  padding-top: 56.25%; /* Player ratio: 100 / (1280 / 720) */
+  margin-bottom: 2rem;
+}
+
+.react-player {
+  position: absolute;
+  top: 0;
+  left: 0;
+}