diff options
-rw-r--r-- | qc_app/static/css/styles.css | 7 | ||||
-rw-r--r-- | qc_app/templates/index.html | 24 | ||||
-rw-r--r-- | qc_app/templates/select_dataset.html | 20 |
3 files changed, 31 insertions, 20 deletions
diff --git a/qc_app/static/css/styles.css b/qc_app/static/css/styles.css index 922924c..d27952a 100644 --- a/qc_app/static/css/styles.css +++ b/qc_app/static/css/styles.css @@ -60,6 +60,7 @@ fieldset { } table { + margin-left: 1em; border-collapse: collapse; border: 1px solid; border-color: #336699; @@ -106,15 +107,15 @@ table th,td { fieldset { border-style: none; display: grid; - grid-template-columns: 5em 1fr; + grid-template-columns: 1fr 9fr; column-gap: 5px; } -label { +.form-col-1 { grid-column: 1 / 2; } -fieldset input,select,button { +.form-col-2 { grid-column: 2 / 3; width: 20%; } diff --git a/qc_app/templates/index.html b/qc_app/templates/index.html index 18eb784..312a876 100644 --- a/qc_app/templates/index.html +++ b/qc_app/templates/index.html @@ -21,19 +21,27 @@ <legend>file type</legend> <input type="radio" name="filetype" value="average" id="filetype_average" - required="required" /> - <label for="filetype_average">average</label> + required="required" class="form-col-1" /> + <label for="filetype_average" class="form-col-2">average</label> <input type="radio" name="filetype" value="standard-error" - id="filetype_standard_error" required="required" /> - <label for="filetype_standard_error">standard error</label> + id="filetype_standard_error" required="required" + class="form-col-1" /> + <label for="filetype_standard_error" class="form-col-2"> + standard error + </label> </fieldset> - <label for="file_upload">select file</label> - <input type="file" name="qc_text_file" id="file_upload" - accept="text/tab-separated-values, application/zip" /> + <fieldset> + <label for="file_upload" class="form-col-1">select file</label> + <input type="file" name="qc_text_file" id="file_upload" + accept="text/tab-separated-values, application/zip" + class="form-col-2"/> + </fieldset> - <input type="submit" value="upload file" class="btn btn-main" /> + <fieldset> + <input type="submit" value="upload file" class="btn btn-main form-col-2" /> + </fieldset> </form> <div id="progress-indicator" class="hidden"> diff --git a/qc_app/templates/select_dataset.html b/qc_app/templates/select_dataset.html index db48694..4846f2c 100644 --- a/qc_app/templates/select_dataset.html +++ b/qc_app/templates/select_dataset.html @@ -10,10 +10,11 @@ data-menu-content="{{menu_contents}}" data-genechips="{{genechips_data}}"> <input type="hidden" name="filename" value="{{filename}}" /> + <input type="hidden" name="filetype" value="{{filetype}}" /> <fieldset> - <label for="species">species:</label> - <select id="species" name="species"> + <label for="species" class="form-col-1">species:</label> + <select id="species" name="species" class="form-col-2"> {%for row in species:%} <option value="{{row[0]}}" {%if row[0] == default_species:%} @@ -26,8 +27,8 @@ </fieldset> <fieldset> - <label for="group">group:</label> - <select id="group" name="group"> + <label for="group" class="form-col-1">group:</label> + <select id="group" name="group" class="form-col-2"> {%for grouping, grps in groups.items():%} <optgroup label="{{grouping}}"> {%for group in grps:%} @@ -39,8 +40,8 @@ </fieldset> <fieldset> - <label for="type">type:</label> - <select id="type" name="type"> + <label for="type" class="form-col-1">type:</label> + <select id="type" name="type" class="form-col-2"> {%for grouping, typs in types.items():%} <optgroup label="{{grouping}}"> {%for type in typs:%} @@ -52,8 +53,8 @@ </fieldset> <fieldset> - <label for="dataset">dataset:</label> - <select id="dataset" name="dataset"> + <label for="dataset" class="form-col-1">dataset:</label> + <select id="dataset" name="dataset" class="form-col-2"> {%for dataset_id, name1, name2 in datasets:%} <option value="{{dataset_id}}">[{{name1}}] {{name2}}</option> {%endfor%} @@ -92,7 +93,8 @@ </table> <fieldset> - <input type="submit" class="btn btn-main" value="update database" /> + <input type="submit" class="btn btn-main form-col-2" + value="update database" /> </fieldset> </form> |