diff options
| author | Alex <alex@scerba.org> | 2024-06-30 20:48:15 -0500 |
|---|---|---|
| committer | Alex Scerba <alex@scerba.org> | 2024-10-29 14:15:43 -0400 |
| commit | 0d88558eb57275a7b89424143855985c487ab472 (patch) | |
| tree | a060072575165dc69718d028f6e4710edb6ca1c5 | |
| parent | abe538d139fc2d07dc0bb39056b4ba8f251c196a (diff) | |
Switch embeded YouTube iframe element
| -rw-r--r-- | html/projects/Husqvarna_Val.tmpl.html | 3 | ||||
| -rw-r--r-- | static/assets/style.css | 6 |
2 files changed, 8 insertions, 1 deletions
diff --git a/html/projects/Husqvarna_Val.tmpl.html b/html/projects/Husqvarna_Val.tmpl.html index 871463b..689132a 100644 --- a/html/projects/Husqvarna_Val.tmpl.html +++ b/html/projects/Husqvarna_Val.tmpl.html @@ -15,7 +15,8 @@ <img src="/static/media/Husqvarna_Val/Bar_Shot.jpg" class="mainImage" alt="Husqvarna Val UI." /> </div> <img src="/static/media/Husqvarna_Val/HUSQVARNA_Scerba_3k_rev2.jpg" alt="Husqvarna Val sidecar motorcycle project." /> - <video src="/static/media/Husqvarna_Val/Val_Animation.mp4" alt="Husqvarna Val animation." controls="" width="1920" height="1080"><a href="/static/media/Husqvarna_Val/Val_Animation.mp4">CJ7 Signal Test</a></video> + <!-- <video src="/static/media/Husqvarna_Val/Val_Animation.mp4" alt="Husqvarna Val animation." controls="" width="1920" height="1080"><a href="/static/media/Husqvarna_Val/Val_Animation.mp4">CJ7 Signal Test</a></video> --> + <iframe width="1920" src="https://www.youtube.com/embed/RXhwG4fjCKw?si=Bj5jhNxfdjiXy_Ch" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe> </article> </div> {{end}}
\ No newline at end of file diff --git a/static/assets/style.css b/static/assets/style.css index c702bb7..a32debd 100644 --- a/static/assets/style.css +++ b/static/assets/style.css @@ -154,6 +154,12 @@ img, video { background-color: rgb(73, 73, 73); */
}
+iframe {
+ max-width: 100%;
+ aspect-ratio: 16/9;
+ display: block;
+}
+
.thumbnail img {
width: fit-content;
aspect-ratio: 4/3;
|