alina
/
alinamarquardt.com
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

iframe scaling improvements for mobile

main
Alina Marquardt 2025-05-21 15:35:59 +02:00
parent e507a0ed25
commit 1bf823acbc
2 changed files with 4 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public_html/portfolio.html
View File

@ -61,7 +61,7 @@
<p>between 2013 and 2020 I've created <a href="https://git.broken.graphics/explore/repos?q=watchface" target="_blank">serveral watchfaces</a> for all pebble smartwatch models as well as fitbit smartwatches.</p>
<p>these watchfaces have been designed with usability concepts in mind respecting interaction capabilities and screen space constraints. that includes motion gestures, adaptive display of stats based on activity and deep configurability via the user's smartphone.</p>
<iframe class="watchface-video" width="445" height="445" src="https://www.youtube.com/embed/_vG2ZFeQobg?si=Ys78wYEozPAy3eoC" 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>
<iframe width="445" height="445" src="https://www.youtube.com/embed/EjgYxUxGvdI?si=eBT5P9vRsDyyNALU" 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>
<iframe class="watchface-video" width="445" height="445" src="https://www.youtube.com/embed/EjgYxUxGvdI?si=eBT5P9vRsDyyNALU" 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>
<article id="yana">
<h2><span class="halfbubble blurgreen"></span><em>yana</em> UX/UI and graphic design</h2>

3
public_html/style.css
View File

@ -783,6 +783,9 @@ div.opaque h2 span.halfbubble {
}
.watchface-video {
margin: 0.6rem 0;
width: 100%;
height: auto;
aspect-ratio: 1/1;
}
/* music */