mobile responsive video

This commit is contained in:
lone-cloud 2016-01-27 00:43:22 -08:00
parent ffe06e46e1
commit b804a271e7
2 changed files with 21 additions and 1 deletions

View file

@ -8,9 +8,11 @@
<div class="title"><img src="assets/images/logo.png" alt="Huegasm"></div>
<p id="intro">Your lights, meet your music. Huegasm.</p>
<p id="introParagraph">Huegasm is a free web application for managing and synchronizing your <a target="_blank" href="http://www2.meethue.com">Philips Hue lights</a> with the beat of your music.</p>
<div class="embedContainerWrapper">
<div class="embedContainer">
<iframe width="560" height="315" src="https://www.youtube.com/embed/zi9J6Qg-MPw" frameborder="0" allowfullscreen></iframe>
</div>
</div>
{{#paper-button raised=true primary=true action="isReady" class="goButton center-block"}}Go!{{/paper-button}}
</div>
{{/if}}

View file

@ -33,6 +33,24 @@ body {
}
.embedContainer {
position:relative;
padding-bottom:56.25%;
padding-top:30px;
height:0;
overflow:hidden;
}
.embedContainerWrapper {
max-width: 600px;
margin: auto;
}
.embedContainer iframe, .embedContainer object, .embedContainer embed {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}
.goButton {