make select a module responsive (#1208)

This commit is contained in:
keshav234156
2019-08-26 19:12:10 +05:30
committed by Jeffrey Warren
parent 1b3e95fdd9
commit 6613af810c
2 changed files with 11 additions and 7 deletions

View File

@@ -44,6 +44,7 @@ body > .container-fluid {
.panel { .panel {
margin-left: 20px; margin-left: 20px;
margin-right: 20px; margin-right: 20px;
min-width:400px;
} }
.nomargin { .nomargin {
@@ -61,6 +62,7 @@ body > .container-fluid {
border-radius: 8px; border-radius: 8px;
text-align: center; text-align: center;
color: #444; color: #444;
min-width:300px;
} }
.hover { .hover {
@@ -103,7 +105,10 @@ body > .container-fluid {
} }
#add-step-btn{ #add-step-btn{
margin-left: 10px; width: 100%
}
.selectize-input {
width: 100%;
} }
#addStep .labels { #addStep .labels {
@@ -140,7 +145,6 @@ body > .container-fluid {
#dwnld { #dwnld {
max-width: 500px; max-width: 500px;
margin: 20px auto; margin: 20px auto;
margin-left: 5px;
} }
#gif_element { #gif_element {

View File

@@ -55,7 +55,7 @@
<div class="container-fluid"> <div class="container-fluid">
<header class="text-center"> <header class="text-center" style="min-width: 450px">
<h1><a href="/" target='_blank' class="name-header">Image Sequencer</a></h1> <h1><a href="/" target='_blank' class="name-header">Image Sequencer</a></h1>
<p> <p>
A pure JavaScript sequential image processing system, inspired by storyboards. Instead of modifying the original A pure JavaScript sequential image processing system, inspired by storyboards. Instead of modifying the original
@@ -139,15 +139,15 @@
<p>Crop</p> <p>Crop</p>
</div> </div>
</div> </div>
<div class="row center-align"> <div class="row justify-content-center">
<div class="col-md-8"> <div class="col-lg-8">
<select id="selectStep"> <select id="selectStep" class="text-center">
<!-- The default null selection has been appended manually in demo.js <!-- The default null selection has been appended manually in demo.js
This is because the options in select are overritten when options are appended.--> This is because the options in select are overritten when options are appended.-->
</select> </select>
</div> </div>
<div class="col-md-4"> <div class="col-lg-4">
<button class="btn btn-success btn-lg" name="add" id="add-step-btn">Add Step</button></div> <button class="btn btn-success btn-lg" name="add" id="add-step-btn">Add Step</button></div>
</div> </div>
<div class="row center-align"> <div class="row center-align">