Larger videos

Author: alvagante

_config.yml

@@ -33,7 +33,7 @@ social:
 collections:
   episodes:
     output: true
-    permalink: /AbnormalDevOpsIterations/:path/:title/
+    permalink: /AbnormalDevOpsIterations/:title/
   posts:
     output: true
     permalink: /blog/:year/:month/:day/:title/

_includes/adi_detail.html

@@ -16,7 +16,9 @@ <h1>{{ page.guest }} - {{ page.title }}</h2>
           <div class="tags">{% for tag in page.tags %}#{{ tag }} {% endfor %}</div>
         </div>
         <div class="col-lg-6">
-          <iframe src="https://www.youtube.com/embed/{{ page.youtube }}" class="aspect-ratio--object" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
+          <div class="video-container">
+          <iframe src="https://www.youtube.com/embed/{{ page.youtube }}" class="video" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
+          </div>
         </div>
       </div>
     </div>

_includes/adi_list.html

@@ -4,21 +4,12 @@
       <div class="row">
         <div>
           <div class="lead">
-            Released weekly on:</br>
-            <a href="https://youtube.com/@AbnormalDevOpsIterations" class="btn btn-default btn-lg" target="_blank"><i class="fa fa-youtube fa-fw"></i> <span class="network-name">YouTube</span></a>
-          </div>
-          <div class="lead">
-            Audio only versions also available on:</br>
-            <a href="https://open.spotify.com/show/4viAGMM539m0A230xqKhqD?si=bd0d41f805054313" target="_blank">Spotify</a></br>
-            <a href="https://music.amazon.com/podcasts/fbb3a98e-1877-4e66-8b65-23388d0e867e/abnormal-devops-iterations" target="_blank">Amazon Music</a></br>
-          </div>
-
-          <div class="lead">
-          <ul class="posts">
+          <h2>Abnormal DevOps Iterations: Human Intelligence</h2>
+          <ul>
           {% assign sorted_posts = site.episodes | sort: "path" | reverse %}
           {% for post in sorted_posts %}
             <li>
-            <strong>{{ post.number }} </strong>: <a href="{{ site.url }}{{ post.url }}" target="_parent">{{ post.title }} with {{ post.guest }}</a>
+            <strong>{{ post.number }} </strong> -  {{ post.guest }}: <a href="{{ site.url }}{{ post.url }}" target="_parent">{{ post.title }}</a>
             </li>
           {% endfor %}
           </ul>

_includes/adi_splash.html

@@ -7,6 +7,14 @@
             <h1>Abnormal DevOps Iterations</h1>
             <hr class="intro-divider">
             <h2>A podcast about Puppet, DevOps, IT operations, AI and everything</h2>
+            <div class="lead">
+              <a href="https://youtube.com/@AbnormalDevOpsIterations" class="btn btn-default btn-lg" target="_blank"><i class="fa fa-youtube fa-fw"></i> <span class="network-name">YouTube</span></a>
+            </div>
+            <div class="lead">
+              Audio only versions:
+              <a href="https://open.spotify.com/show/4viAGMM539m0A230xqKhqD?si=bd0d41f805054313" target="_blank">Spotify</a> and
+              <a href="https://music.amazon.com/podcasts/fbb3a98e-1877-4e66-8b65-23388d0e867e/abnormal-devops-iterations" target="_blank">Amazon Music</a></br>
+            </div>
           </div>
         </div>
       </div>

css/landing-page.css

@@ -241,3 +241,14 @@ footer {
 p.copyright {
     margin: 15px 0 0;
 }
+
+
+.video-container {
+    width: 100%;
+    aspect-ratio: 16 / 9;
+}
+  
+.video {
+    width: 100%;
+    height: 100%;
+}