Merge pull request #1241 from trcrsired/next

trcrsired · web-flow · commit 3c4b1e9cb5ac · 2025-12-15T01:23:22.000+08:00
video should align with the width of the text itself for PWA
diff --git a/docs/docs/examples.html b/docs/docs/examples.html
@@ -4,13 +4,8 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Examples - fast_io Documentation</title>
-<<<<<<< HEAD
   <link rel="stylesheet" href="../style.css">
   <link rel="manifest" href="../manifest.json">
-=======
-  <link rel="stylesheet" href="/style.css">
-  <link rel="manifest" href="/manifest.json">
->>>>>>> parent/next
 </head>
 <body>
   <main>
@@ -41,13 +36,8 @@ <h2>More Examples Coming Soon</h2>
     </section>
 
     <div class="page-navigation">
-<<<<<<< HEAD
     <a href="intro.html" class="prev-button">← Previous: Introduction</a>
     <a href="api.html" class="next-button">Next: API Reference →</a>
-=======
-    <a href="/docs/intro.html" class="prev-button">← Previous: Introduction</a>
-    <a href="/docs/api.html" class="next-button">Next: API Reference →</a>
->>>>>>> parent/next
     </div>
   </main>
 
diff --git a/docs/docs/intro.html b/docs/docs/intro.html
@@ -138,13 +138,13 @@ <h2>Video Introduction</h2>
         Here’s a talk that further illustrates the ideas behind <strong>fast_io</strong>:
     </p>
     <div class="video-container">
-        <iframe width="560" height="315" 
+    <iframe 
         src="https://www.youtube.com/embed/CefgZlXeMUg" 
         title="YouTube video player" 
         frameborder="0" 
         allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" 
         allowfullscreen>
-        </iframe>
+    </iframe>
     </div>
     </section>
     <!-- Add this after the last section -->
diff --git a/docs/index.html b/docs/index.html
@@ -3,7 +3,7 @@
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>fast_io - fast_io documentations</title>
+  <title>fast_io - fast_io documentations (Under Construction)</title>
   <link rel="manifest" href="manifest.json">
   <link rel="stylesheet" href="style.css">
 </head>
diff --git a/docs/style.css b/docs/style.css
@@ -63,3 +63,19 @@ nav a {
 .next-button:hover {
   background-color: #004c99;
 }
+
+.video-container {
+  position: relative;
+  width: 100%;          /* take full width of text content area */
+  padding-bottom: 56.25%; /* 16:9 aspect ratio (height = 9/16 of width) */
+  height: 0;
+  overflow: hidden;
+}
+
+.video-container iframe {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;          /* scale to container width */
+  height: 100%;         /* scale height accordingly */
+}
