diff --git a/app/css/app.css b/app/css/app.css index 2361b7b..557f1b5 100644 --- a/app/css/app.css +++ b/app/css/app.css @@ -739,6 +739,21 @@ button:focus { background: black; color: #fff; } +#video_preview_wrap { + background: #000; + width: 100%; +} +#video_preview { + height: 400px; + min-height: 400px; + width: auto; + margin: 0 auto; + display: block; + opacity: 0; +} +#video_preview .on { + opacity: 1; +} #screens { overflow-x: hidden; } diff --git a/app/index.html b/app/index.html index 851d523..ec179a2 100644 --- a/app/index.html +++ b/app/index.html @@ -345,8 +345,12 @@ <div id="video" class="screen"> <div> <div> - <input id="video_file" type="text" onclick="devices.digitalSelect();" readonly /> - <img src="#" id="video_preview"> + <div id="path_bar"> + <input id="video_file" type="text" onclick="devices.digitalSelect();" readonly /> + </div> + <div id="video_preview_wrap"> + <img src="#" id="video_preview"> + </div> </div> </div> </div> diff --git a/app/less/app.less b/app/less/app.less index a04bc19..e48eb00 100644 --- a/app/less/app.less +++ b/app/less/app.less @@ -8,7 +8,7 @@ @import "./scroll.less"; @import "./settings.less"; @import "./mscript.less"; - +@import "./video.less"; #screens{ overflow-x: hidden;