jeans/esp-web-tools
jeans/esp-web-tools
1
0
Fork 0
mirror of https://github.com/esphome/esp-web-tools.git synced 2025-07-28 06:06:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Use lite-youtube

Browse Source
This commit is contained in:
Paulus Schoutsen 2021-12-07 14:05:24 -08:00
parent 7e96b75c88
commit 014df385ad
1 changed files with 9 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
index.html
View File

@ -74,14 +74,7 @@
padding-bottom: 56.25%; /* 16:9 */ padding-bottom: 56.25%; /* 16:9 */
height: 0; height: 0;
margin-bottom: 25px; margin-bottom: 25px;
background: #000; background: #ccc;
}
.videoWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
} }
.hidden { .hidden {
display: none; display: none;
@ -142,15 +135,10 @@
to <a href="https://www.home-assistant.io">Home Assistant</a>. to <a href="https://www.home-assistant.io">Home Assistant</a>.
</p> </p>
<div class="videoWrapper"> <div class="videoWrapper">
<iframe <lite-youtube
width="560" videoid="E8bdATqXM8c"
height="315" videotitle="ESP Web Tools in action"
src="https://www.youtube-nocookie.com/embed/E8bdATqXM8c" ></lite-youtube>
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen
></iframe>
</div> </div>
<p> <p>
@ -498,5 +486,9 @@
document.querySelector(".not-supported-i").classList.remove("hidden"); document.querySelector(".not-supported-i").classList.remove("hidden");
} }
</script> </script>
<script
type="module"
src="https://unpkg.com/@justinribeiro/lite-youtube@1.3.0/lite-youtube.js"
></script>
</body> </body>
</html> </html>