feat: add webm version of video

agrattan0820 · Jul 26, 2024 · adbc531 · adbc531
1 parent ad62d2c
commit adbc531
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 4 deletions.
diff --git a/apps/client/public/artificial-unintelligence-promo.webm b/apps/client/public/artificial-unintelligence-promo.webm
diff --git a/apps/client/src/app/how-to-play/page.tsx b/apps/client/src/app/how-to-play/page.tsx
@@ -43,13 +43,21 @@ export default async function HowToPlay() {
             AI-generated images in response to amusing prompts.
           </p>
           <video
-            src="/artificial-unintelligence-promo.mp4"
             controls
             autoPlay
             muted
             playsInline
             className="aspect-video w-full"
-          />
+          >
+            <source
+              src="/artificial-unintelligence-promo.webm"
+              type="video/webm"
+            />
+            <source
+              src="/artificial-unintelligence-promo.mp4"
+              type="video/mp4"
+            />
+          </video>
           Some prompts you might encounter:
           <ul>
             <li>A canceled children&apos;s toy</li>

diff --git a/apps/client/src/components/homepage-template.tsx b/apps/client/src/components/homepage-template.tsx
@@ -56,13 +56,21 @@ export default function HomepageTemplate({
               type="SMILING"
             />
             <video
-              src="/artificial-unintelligence-promo.mp4"
               controls
               autoPlay
               muted
               playsInline
               className="relative mx-auto aspect-video w-full rounded-2xl bg-black shadow-2xl shadow-indigo-500 lg:max-w-full"
-            ></video>
+            >
+              <source
+                src="/artificial-unintelligence-promo.webm"
+                type="video/webm"
+              />
+              <source
+                src="/artificial-unintelligence-promo.mp4"
+                type="video/mp4"
+              />
+            </video>
           </div>
         </section>
       </main>