Add demo video caption track

rails · Nov 15, 2024 · cf7fc0a · cf7fc0a
1 parent 363adc5
commit cf7fc0a
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/_sass/base/_body.scss b/_sass/base/_body.scss
@@ -31,6 +31,14 @@ body {
     width: 100%;
   }
 
+  video::cue {
+    @include calibre();
+    font-size: 24px;
+    font-weight: 600;
+    letter-spacing: -0.01em;
+    line-height: 1;
+  }
+
 
 
   @media(min-width: 1024px) {

diff --git a/index.html b/index.html
@@ -25,7 +25,9 @@ <h4>Learn just what you need to get started, then keep leveling up as you go. <s
 <div class="video common-background--grey common-shape--top-white-down-left">
   <div class="container">
     <div class="video__embed">
-      <video poster="https://d2biiyjlsh52uh.cloudfront.net/rails/rails-8-demo.webp" src="https://d2biiyjlsh52uh.cloudfront.net/rails/rails-8-demo.mp4" width="1920" height="1080" controls></video>
+      <video poster="https://d2biiyjlsh52uh.cloudfront.net/rails/rails-8-demo.webp" src="https://d2biiyjlsh52uh.cloudfront.net/rails/rails-8-demo.mp4" width="1920" height="1080" preload="metadata" controls crossorigin>
+        <track src="https://d2biiyjlsh52uh.cloudfront.net/rails/rails-8-demo-en.vtt" kind="captions" label="English" srclang="en" default>
+      </video>
     </div>
   </div>
 </div>