videos.liquid

---
layout: layout.liquid
title: Unusable videos
description: "If you like our podcast, you might also like these videos we make about usability and user experience."
changeFreq: "monthly"
---
{% include blocks/header.liquid, dark: true, subtitle: "If you like our podcast, you might also like these videos we make.", link: socials.youtube.url, label: "Watch on YouTube" %}
<main id="main" class="flex-fill">
    <div class="container unusable__block video-carousel">
        <div class="row">
            {% for video in videos %}
                <div class="col-md-4">
                    <iframe
                            width="560"
                            height="315"
                            src="https://www.youtube-nocookie.com/embed/{{ video.id }}"
                            srcdoc="<style>*{padding:0;margin:0;overflow:hidden}html,body{height:100%}img,span{position:absolute;width:100%;top:0;bottom:0;margin:auto}span{height:1.5em;text-align:center;font:48px/1.5 sans-serif;color:white;text-shadow:0 0 0.5em black}</style><a href=https://www.youtube-nocookie.com/embed/{{ video.id }}?autoplay=1><img src=https://img.youtube.com/vi/{{ video.id }}/hqdefault.jpg alt='{{ video.title }}'><span>▶</span></a>"
                            frameborder="0"
                            allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
                            allowfullscreen
                            title="{{ video.title }}"
                            loading="lazy"
                    ></iframe>
                </div>
            {% endfor %}
        </div>
    </div>
</main>
{% include blocks/footer.liquid %}