[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="container-fluid container-md">
<div class="row"> <div class="row">
<div class="col-sm-7"> <div class="col-xl-7">
<video id="video" class="video_sized" autoplay></video> <video id="video" class="video_sized" autoplay></video>
</div> </div>
<div class="col-sm-5"> <div class="col-xl-5">
<h1 class="text-primary">Convert your photos to laser images!</h1> <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">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> <p class="lead">Or pick an image from your phone and upload it. </p>
@ -48,12 +48,12 @@
</div> </div>
</div> </div>
<div class="row result" id="result" style="display:none"> <div class="row result" id="result" style="display:none">
<div class="col-sm-7"> <div class="col-xl-7">
<div class="video_sized"> <div class="video_sized">
<canvas id="canvas" class="video_sized"></canvas> <canvas id="canvas" class="video_sized"></canvas>
</div> </div>
</div> </div>
<div class="col-sm"> <div class="col-xl">
<h2 class="text-primary">Not satisfied with contrast? </h2> <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> <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> <div id="slider"></div>
@ -75,14 +75,14 @@
</div> </div>
</div> </div>
<div class="row result" style="display:none"> <div class="row result" style="display:none">
<div class="col-sm-7"> <div class="col-xl-7">
<h1 class="text-primary"> Got text?</h1> <h1 class="text-primary"> Got text?</h1>
<p >If some text is visible on the image, type it before pushing the Send button.</p> <p >If some text is visible on the image, type it before pushing the Send button.</p>
<div class="form-group"> <div class="form-group">
<input id="text" type="text" class="form-control form-control-lg" placeholder="Type text here"/> <input id="text" type="text" class="form-control form-control-lg" placeholder="Type text here"/>
</div> </div>
</div> </div>
<div class="col-sm-5"> <div class="col-xl-5">
<h1 class="text-success">Ready to send? </h1> <h1 class="text-success">Ready to send? </h1>
<div class="form-group"> <div class="form-group">
<button id="send" class="form-control form-control-lg btn btn-lg btn-success btn-block">Send</button> <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> </div>
<div class="row result" style="display:none"> <div class="row result" style="display:none">
<div class="col-sm"> <div class="col-xl">
<div id="messages"> <div id="messages">
</div> </div>
</div> </div>
</div> </div>
<div class="row" id="preview"> <div class="row" id="preview">
<div class="col-sm-7"> <div class="col-xl-7">
<canvas id="simuCanvas" class="video_sized"></canvas> <canvas id="simuCanvas" class="video_sized"></canvas>
</div> </div>
<div class="col-sm-5" > <div class="col-xl-5" >
<h2 class="text-secondary">Preview your creations</h2> <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> <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>