diff --git a/VIPSWeb/static/css/vipsweb.css b/VIPSWeb/static/css/vipsweb.css index 176bcf58d35f3223b357c13fb80a4461fd726947..be4d90b43a4005d17b87d3e6ba650c8ae8aeb0e9 100755 --- a/VIPSWeb/static/css/vipsweb.css +++ b/VIPSWeb/static/css/vipsweb.css @@ -839,3 +839,21 @@ div.advertisement { border: 3px solid #008136; padding: 10px 20px 25px 25px; } + +/* For embedding VIMEO etc responsively */ +.responsive-video { +position: relative; +padding-bottom: 56.25%; +padding-top: 60px; overflow: hidden; +} + + +.responsive-video iframe, +.responsive-video object, +.responsive-video embed { +position: absolute; +top: 0; +left: 0; +width: 100%; +height: 100%; +} diff --git a/roughage/templates/roughage/nutrition.html b/roughage/templates/roughage/nutrition.html index 3eb9322a684cb420b8884fe2195be3b5b2145dbe..ca181a85c8b068cc702fde9378bcc0183139f988 100755 --- a/roughage/templates/roughage/nutrition.html +++ b/roughage/templates/roughage/nutrition.html @@ -34,9 +34,11 @@ <p> Felt merket med * må fylles ut. Velg klimastasjon for årets klimadata, normaldata eller begge. </p> + <form id="{{form_id}}"> <div class="row"> <div class="col-md-6"> + <input type="hidden" name="timeZone" value="Europe/Oslo"/> <div class="form-group"> <label for="weatherStationId">Målestasjon for årets værdata</label> @@ -89,7 +91,11 @@ </div> <div class="col-md-6"> - <div id="weatherStationSelectionMap" style="height: 450px;max-height: 450px;"> + <div class="responsive-video"> + <iframe src="https://player.vimeo.com/video/147571372" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> + <p><a href="https://vimeo.com/147571372">Grovformodellen 2015</a> from <a href="https://vimeo.com/nibio">NIBIO</a> on <a href="https://vimeo.com">Vimeo</a>.</p> + </div> + <div id="weatherStationSelectionMap" style="height: 450px;max-height: 450px; margin: 15px;"> <div id="popover"></div> </div> </div>