<script> const openBtn = document.getElementById('openFudgeVideo'); const modal = document.getElementById('fudgeModal'); const closeBtn= document.getElementById('closeFudge');
<div class="modal-body"> <iframe src="https://www.youtube.com/embed/<VIDEO_ID>?rel=0&modestbranding=1" title="Church Of Fudge video" allow="autoplay; encrypted-media" allowfullscreen loading="lazy" width="100%" height="450"></iframe> </div> Church Of Fudge Video Link
Feel free to copy‑paste the template into your product‑management tool (Jira, ClickUp, Notion, etc.) and adjust the details to match your exact workflow. Feature Name: Church Of Fudge Video Link Feature ID: (e.g. VID‑001 ) Owner / Sponsor: [Insert team or stakeholder] Target Release: [Insert sprint / version] <script> const openBtn = document
<!-- 2️⃣ Modal (hidden by default) --> <div id="fudgeModal" style=" display:none;position:fixed;top:0;left:0;width:100vw;height:100vh; background:rgba(0,0,0,.8);justify-content:center;align-items:center; z-index:1000;"> <div style="position:relative;background:#000;width:90%;max-width:720px;"> <button id="closeFudge" style=" position:absolute;top:8px;right:8px;background:none; border:none;color:#fff;font-size:24px;cursor:pointer;">×</button> <iframe src="https://www.youtube.com/embed/abc123XYZ?rel=0" title="Church Of Fudge video" width="100%" height="400" allowfullscreen style="border:none;"></iframe> </div> </div> const openBtn = document.getElementById('openFudgeVideo')
<!-- 1️⃣ Thumbnail --> <div style="max-width:480px;margin:auto;"> <a href="#" id="openFudgeVideo" style="display:block;position:relative;"> <img src="https://img.youtube.com/vi/abc123XYZ/hqdefault.jpg" alt="Church Of Fudge – video preview" style="width:100%;border-radius:8px;"> <span style=" position:absolute;top:50%;left:50%;transform:translate(-50%,-50%); background:rgba(0,0,0,0.6);color:#fff;padding:12px 16px; border-radius:50%;font-size:24px;">▶︎</span> </a> </div>