diff options
Diffstat (limited to 'qc_app/templates/samples')
| -rw-r--r-- | qc_app/templates/samples/select-population.html | 54 | ||||
| -rw-r--r-- | qc_app/templates/samples/select-species.html | 15 | ||||
| -rw-r--r-- | qc_app/templates/samples/upload-samples.html | 132 |
3 files changed, 94 insertions, 107 deletions
diff --git a/qc_app/templates/samples/select-population.html b/qc_app/templates/samples/select-population.html index 5d78826..da19ddc 100644 --- a/qc_app/templates/samples/select-population.html +++ b/qc_app/templates/samples/select-population.html @@ -13,33 +13,28 @@ (e.g. Inbred populations, cell tissue, etc.)</p> </div> -<hr /> - <form method="POST" action="{{url_for('samples.select_population', species_id=species.SpeciesId)}}"> <legend class="heading">select grouping/population</legend> {{flash_messages("error-select-population")}} <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <fieldset> - <label for="select:inbredset" class="form-col-1">grouping/population</label> + + <div class="form-group"> + <label for="select:inbredset" class="form-label">grouping/population</label> <select id="select:inbredset" name="inbredset_id" required="required" - class="form-col-2"> + class="form-control"> <option value="">Select a grouping/population</option> {%for pop in populations%} <option value="{{pop.InbredSetId}}"> {{pop.InbredSetName}} ({{pop.FullName}})</option> {%endfor%} </select> - </fieldset> + </div> - <fieldset> - <input type="submit" - value="select population" - class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" class="btn btn-primary">select population</button> </form> <p style="color:#FE3535; padding-left:20em; font-weight:bolder;">OR</p> @@ -50,54 +45,51 @@ {{flash_messages("error-create-population")}} <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <fieldset> + <div class="form-group"> <legend>mandatory</legend> - <label for="txt:inbredset-name" class="form-col-1">name</label> + + <label for="txt:inbredset-name" class="form-label">name</label> <input id="txt:inbredset-name" name="inbredset_name" type="text" required="required" placeholder="Enter grouping/population name" - class="form-col-2" /> + class="form-control" /> - <label for="txt:" class="form-col-1">full name</label> + <label for="txt:" class="form-label">full name</label> <input id="txt:inbredset-fullname" name="inbredset_fullname" type="text" required = "required" placeholder="Enter the grouping/population's full name" - class="form-col-2" /> - </fieldset> - <fieldset> + class="form-control" /> + </div> + <div class="form-group"> <legend>Optional</legend> - <label for="num:public" class="form-col-1">public?</label> + <label for="num:public" class="form-label">public?</label> <input id="num:public" name="public" type="number" min="0" max="2" value="2" - class="form-col-2" /> + class="form-control" /> - <label for="txt:inbredset-family" class="form-col-1">family</label> + <label for="txt:inbredset-family" class="form-label">family</label> <input id="txt:inbredset-family" name="inbredset_family" type="text" placeholder="I am not sure what this is about." - class="form-col-2" /> + class="form-control" /> - <label for="txtarea:" class="form-col-1">Description</label> + <label for="txtarea:" class="form-label">Description</label> <textarea id="txtarea:description" name="description" rows="5" placeholder="Enter a description of this grouping/population" - class="form-col-2"></textarea> - </fieldset> - - <fieldset> - <input type="submit" - value="create grouping/population" - class="btn btn-primary form-col-2" /> - </fieldset> + class="form-control"></textarea> + </div> + + <button type="submit" class="btn btn-primary">create grouping/population</button> </form> {%endblock%} diff --git a/qc_app/templates/samples/select-species.html b/qc_app/templates/samples/select-species.html index 44c0d4f..edadc61 100644 --- a/qc_app/templates/samples/select-species.html +++ b/qc_app/templates/samples/select-species.html @@ -12,18 +12,19 @@ <form method="POST" action="{{url_for('samples.select_species')}}"> <legend class="heading">upload samples</legend> - <fieldset> - <label for="select_species02">Species</label> - <select id="select_species02" name="species_id" required="required"> + <div class="form-group"> + <label for="select_species02" class="form-label">Species</label> + <select id="select_species02" + name="species_id" + required="required" + class="form-control"> <option value="">Select species</option> {%for spec in species%} <option value="{{spec.SpeciesId}}">{{spec.MenuName}}</option> {%endfor%} </select> - </fieldset> + </div> - <fieldset> - <input type="submit" value="submit" class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" class="btn btn-primary">submit</button> </form> {%endblock%} diff --git a/qc_app/templates/samples/upload-samples.html b/qc_app/templates/samples/upload-samples.html index 29b08f6..e62de57 100644 --- a/qc_app/templates/samples/upload-samples.html +++ b/qc_app/templates/samples/upload-samples.html @@ -3,16 +3,7 @@ {%block title%}Upload Samples{%endblock%} -{%block css%} -<style type="text/css"> - #form-samples { - background-color: #D1D1D1; - } - #form-samples fieldset:nth-child(odd){ - background-color: white; - } -</style> -{%endblock%} +{%block css%}{%endblock%} {%block contents%} <h1 class="heading">upload samples</h1> @@ -20,23 +11,23 @@ {{flash_messages("alert-success")}} <p>You can now upload a character-separated value (CSV) file that contains - details about your samples. The CSV file should have the following fields: - <dl> - <dt>Name</dt> - <dd>The primary name for the sample</dd> + details about your samples. The CSV file should have the following fields: + <dl> + <dt>Name</dt> + <dd>The primary name for the sample</dd> - <dt>Name2</dt> - <dd>A secondary name for the sample. This can simply be the same as - <strong>Name</strong> above. This field <strong>MUST</strong> contain a - value.</dd> + <dt>Name2</dt> + <dd>A secondary name for the sample. This can simply be the same as + <strong>Name</strong> above. This field <strong>MUST</strong> contain a + value.</dd> - <dt>Symbol</dt> - <dd>A symbol for the sample. Can be an empty field.</dd> + <dt>Symbol</dt> + <dd>A symbol for the sample. Can be an empty field.</dd> - <dt>Alias</dt> - <dd>An alias for the sample. Can be an empty field.</dd> - </dl> - </p> + <dt>Alias</dt> + <dd>An alias for the sample. Can be an empty field.</dd> + </dl> +</p> <form id="form-samples" method="POST" @@ -45,32 +36,32 @@ population_id=population.InbredSetId)}}" enctype="multipart/form-data"> <legend class="heading">upload samples</legend> - <fieldset> + + <div class="form-group"> <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <label class="form-col-1">species:</label> - <span class="form-col-2">{{species.SpeciesName}} [{{species.MenuName}}]</span> - </fieldset> + <label class="form-label">species:</label> + <span class="form-text">{{species.SpeciesName}} [{{species.MenuName}}]</span> + </div> - <fieldset> + <div class="form-group"> <input type="hidden" name="inbredset_id" value="{{population.InbredSetId}}" /> - <label class="form-col-1">grouping/population:</label> - <span class="form-col-2">{{population.Name}} [{{population.FullName}}]</span> - </fieldset> + <label class="form-label">grouping/population:</label> + <span class="form-text">{{population.Name}} [{{population.FullName}}]</span> + </div> - <fieldset> - <input id="chk:heading" - type="checkbox" - name="first_line_heading" - class="form-col-1" /> - <label for="chk:heading" class="form-col-2">first line is a heading?</label> - </fieldset> + <div class="form-group"> + <label for="file-samples" class="form-label">select file</label> + <input type="file" name="samples_file" id="file:samples" + accept="text/csv, text/tab-separated-values" + class="form-control" /> + </div> - <fieldset> - <label for="select:separator" class="form-col-1">field separator</label> + <div class="form-group"> + <label for="select:separator" class="form-label">field separator</label> <select id="select:separator" name="separator" required="required" - class="form-col-2"> + class="form-control"> <option value="">Select separator for your file: (default is comma)</option> <option value="	">TAB</option> <option value=" ">Space</option> @@ -81,43 +72,46 @@ <input id="txt:separator" type="text" name="other_separator" - class="form-col-2" /> - <span class="form-col-2"> - This is the character that separates the fields in your CSV file. If you - select "<strong>Other</strong>", then you must provide the separator in - the text field provided. - </span> - </fieldset> - - <fieldset> - <label for="txt:delimiter" class="form-col-1">field delimiter</label> + class="form-control" /> + <small class="form-text text-muted"> + If you select '<strong>Other</strong>' for the field separator value, + enter the character that separates the fields in your CSV file in the form + field below. + </small> + </div> + + <div class="form-group form-check"> + <input id="chk:heading" + type="checkbox" + name="first_line_heading" + class="form-check-input" /> + <label for="chk:heading" class="form-check-label"> + first line is a heading?</label> + <small class="form-text text-muted"> + Select this if the first line in your file contains headings for the + columns. + </small> + </div> + + <div class="form-group"> + <label for="txt:delimiter" class="form-label">field delimiter</label> <input id="txt:delimiter" type="text" name="field_delimiter" maxlength="1" - class="form-col-2" /> - <span class="form-col-2"> + class="form-control" /> + <small class="form-text text-muted"> If there is a character delimiting the string texts within particular fields in your CSV, provide the character here. This can be left blank if no such delimiters exist in your file. - </span> - </fieldset> + </small> + </div> - <fieldset> - <label for="file:samples" class="form-col-1">select file</label> - <input type="file" name="samples_file" id="file:samples" - accept="text/csv, text/tab-separated-values" - class="form-col-2" /> - </fieldset> - - <fieldset> - <input type="submit" - value="upload samples file" - class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" + class="btn btn-primary">upload samples file</button> </form> -<table id="tbl:samples-preview"> +<table id="tbl:samples-preview" class="table"> <caption class="heading">preview content</caption> <thead> |