Use horizontal-form for "Create Species" form.

1 files changed, 15 insertions, 6 deletions

diff --git a/uploader/templates/species/create-species.html b/uploader/templates/species/create-species.html
index 0d0bedf..9b7c954 100644
--- a/uploader/templates/species/create-species.html
+++ b/uploader/templates/species/create-species.html
@@ -19,14 +19,16 @@
 <div class="row">
   <form id="frm-create-species"
         method="POST"
-        action="{{url_for('species.create_species')}}">
+        action="{{url_for('species.create_species')}}"
+        class="form-horizontal">
     <legend>Create Species</legend>
 
     {{flash_all_messages()}}
 
     <div class="form-group">
-      <label for="txt-taxonomy-id" class="form-label">
+      <label for="txt-taxonomy-id" class="control-label col-sm-2">
         Taxonomy ID</label>
+      <div class="col-sm-10">
       <div class="input-group">
         <input id="txt-taxonomy-id"
                name="species_taxonomy_id"
@@ -43,10 +45,12 @@
         While it is recommended to provide a value for this field, doing so is
         optional.
       </small>
+      </div>
     </div>
 
     <div class="form-group">
-      <label for="txt-species-name" class="form-label">Common Name</label>
+      <label for="txt-species-name" class="control-label col-sm-2">Common Name</label>
+      <div class="col-sm-10">
       <input id="txt-species-name"
              name="common_name"
              type="text"
@@ -54,11 +58,13 @@
              required="required" />
       <small class="form-text text-muted">Provide the common, possibly
         non-scientific name for the species here, e.g. Human, Mouse, etc.</small>
+      </div>
     </div>
 
     <div class="form-group">
-      <label for="txt-species-scientific" class="form-label">
+      <label for="txt-species-scientific" class="control-label col-sm-2">
         Scientific Name</label>
+      <div class="col-sm-10">
       <input id="txt-species-scientific"
              name="scientific_name"
              type="text"
@@ -66,10 +72,12 @@
              required="required" />
       <small class="form-text text-muted">Provide the scientific name for the
         species you are creating, e.g. Homo sapiens, Mus musculus, etc.</small>
+      </div>
     </div>
 
     <div class="form-group">
-      <label for="select-species-family" class="form-label">Family</label>
+      <label for="select-species-family" class="control-label col-sm-2">Family</label>
+      <div class="col-sm-10">
       <select id="select-species-family"
               name="species_family"
               required="required"
@@ -82,9 +90,10 @@
       <small class="form-text text-muted">
         This is a generic grouping for the species that determines under which
         grouping the species appears in the GeneNetwork menus</small>
+      </div>
     </div>
 
-    <div class="form-group">
+    <div class="col-sm-offset-2 col-sm-10">
       <input type="submit"
              value="create new species"
              class="btn btn-primary" />