[fix] columns responsive class should be xl

This commit is contained in:
Alban 2020-11-15 21:11:30 +00:00
parent 60b9129e7c
commit 663180c84a

View File

@ -25,10 +25,10 @@
<div class="container-fluid container-md">
<div class="row">
<div class="col-sm-7">
<div class="col-xl-7">
<video id="video" class="video_sized" autoplay></video>
</div>
<div class="col-sm-5">
<div class="col-xl-5">
<h1 class="text-primary">Convert your photos to laser images!</h1>
<p class="lead">Create something fresh by allowing the browser to use your camera.</p>
<p class="lead">Or pick an image from your phone and upload it. </p>
@ -48,12 +48,12 @@
</div>
</div>
<div class="row result" id="result" style="display:none">
<div class="col-sm-7">
<div class="col-xl-7">
<div class="video_sized">
<canvas id="canvas" class="video_sized"></canvas>
</div>
</div>
<div class="col-sm">
<div class="col-xl">
<h2 class="text-primary">Not satisfied with contrast? </h2>
<p class="lead">Before sending your snap, feel free to modify the contrast by using the slider to reach the effect you desire.</p>
<div id="slider"></div>
@ -75,14 +75,14 @@
</div>
</div>
<div class="row result" style="display:none">
<div class="col-sm-7">
<div class="col-xl-7">
<h1 class="text-primary"> Got text?</h1>
<p >If some text is visible on the image, type it before pushing the Send button.</p>
<div class="form-group">
<input id="text" type="text" class="form-control form-control-lg" placeholder="Type text here"/>
</div>
</div>
<div class="col-sm-5">
<div class="col-xl-5">
<h1 class="text-success">Ready to send? </h1>
<div class="form-group">
<button id="send" class="form-control form-control-lg btn btn-lg btn-success btn-block">Send</button>
@ -90,16 +90,16 @@
</div>
</div>
<div class="row result" style="display:none">
<div class="col-sm">
<div class="col-xl">
<div id="messages">
</div>
</div>
</div>
<div class="row" id="preview">
<div class="col-sm-7">
<div class="col-xl-7">
<canvas id="simuCanvas" class="video_sized"></canvas>
</div>
<div class="col-sm-5" >
<div class="col-xl-5" >
<h2 class="text-secondary">Preview your creations</h2>
<p class="lead">Now that your creation have been sent, you can check what they will look like on lasers using these links, sorted by oldest snaps last.</p>