Merge pull request #781 from starteam/jmclaus/improve-a11y

Improve a11y

html_app/ui/common.gss

@@ -9,10 +9,6 @@
 .dummy {
 }
 
-#main button, #main *[role=button], input[type=radio] {
-	outline:none !important;
-}
-
 body {
     background-color: #e9edf1;
 }

instructor/templates/instructor/assignment_modify.html

@@ -1,7 +1,6 @@
 {% extends "instructor/assignment_sidebar.html" %}
 
 {% block right_side %}
-
     <div class='scb_s_assignment_setup_title'>Assignment Setup</div>
     <div class='scb_s_assignment_setup_radio_choice' aria-label='Create New Assignment'>
         <input class='scb_s_experiment_setup_choose_template_kind' type="radio" name="setup_kind"
@@ -49,21 +48,20 @@
             </ul>
         </div>
         <div>
+            <input type="file" name="files" id="files" class="scb_ab_s_add_files_input" multiple>
             <label for="files" class="scb_s_gray_button scb_ab_s_add_files_button">
                 ADD FILES
             </label>
-            <input type="file" name="files" id="files" class="scb_ab_s_add_files_input" multiple>
         </div>
-        <div>
+        <div class="scb_ab_s_nav_controls_right">
             <input type="submit"
-                   name="continue"
+                   name="save"
                    class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-                   value="SAVE AND CONTINUE &nbsp; &#9654;"/>
+                   value="SAVE">
             <input type="submit"
-                   name="save"
+                   name="continue"
                    class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-                   value="SAVE"/>
+                   value="SAVE AND CONTINUE &nbsp; &#9654;">
         </div>
     </form>
-
 {% endblock %}

instructor/templates/instructor/assignment_select_variables.html

@@ -29,19 +29,20 @@
             <div class='scb_ab_f_select_variable scb_ab_s_variable_wrapper'>
                 {{ form.has_collection_time }} Collection Time
             </div>
-            <input type="submit"
-               name="continue"
-               class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-               value="SAVE AND CONTINUE &nbsp; &#9654;">
-            <input type="submit"
-               name="save"
-               class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-               value="SAVE"/>
-
-
+            <div class="scb_ab_s_nav_controls scb_ab_s_shift_left">
+                <input type="button"
+                       class="scb_ab_s_navigation_button scb_s_back_btn"
+                       value="&#9664; &nbsp; BACK"
+                       data-location="{% url "common_assignments_edit_strains" %}">
+                <input type="submit"
+                       name="save"
+                       class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
+                       value="SAVE">
+                <input type="submit"
+                       name="continue"
+                       class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
+                       value="SAVE AND CONTINUE &nbsp; &#9654;">
+            </div>
         </form>
     </div>
-    <a href="{% url "common_assignments_edit_strains" %}">
-    <button class="scb_ab_s_navigation_button scb_s_back_btn" role='button'>&#9664; &nbsp; BACK</button>
-</a>
 {% endblock %}

instructor/templates/instructor/assignment_setup.html

@@ -42,17 +42,18 @@
         <div class='scb_s_assignment_setup_course_name_heading'>What files would you like to upload?</div>
         <div class="scb_ab_s_file_list"><ul></ul></div>
         <div>
+            <input type="file" name="assignment_files" id="files" class="scb_ab_s_add_files_input_setup" multiple>
             <label for="files" class="scb_s_gray_button scb_ab_s_add_files_button">
                 ADD FILES
             </label>
         </div>
-        <input type="file" name="assignment_files" id="files" class="scb_ab_s_add_files_input_setup" multiple>
         <div class="scb_ab_s_input_error">{{ error }}</div>
         <input type="hidden" name="based_on" id="based_on">
-        <input type="submit" data-based_on="null"
-               name="continue"
-               class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-               value="SAVE AND CONTINUE &nbsp; &#9654;"/>
+        <div class="scb_ab_s_nav_controls_right">
+            <input type="submit" data-based_on="null"
+                   name="continue"
+                   class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
+                   value="SAVE AND CONTINUE &nbsp; &#9654;">
+        </div>
     </form>
-
 {% endblock %}

instructor/templates/instructor/course_modify.html

@@ -58,25 +58,20 @@
                 <input type="submit" name="add" class='scb_s_gray_button scb_s_experiment_setup_add_button' value="ADD">
             </div>
         </div>
-        <div>
+        <div class="scb_ab_s_nav_controls">
+            <input type="button"
+                   class="scb_ab_s_navigation_button scb_s_back_btn"
+                   value="&#9664; &nbsp; BACK"
+                   data-location="{% if new %}{% url "common_assignment_setup" %}
+                                  {% else %}{% url "common_assignment_modify" %}{% endif %}">
             <input type="submit"
-                   name="continue"
-                   class=" scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-                   value="SAVE AND CONTINUE &nbsp; &#9654;"/>
+                    name="save"
+                    class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
+                    value="SAVE">
             <input type="submit"
-                   name="save"
-                   class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-                   value="SAVE"/>
+                    name="continue"
+                    class=" scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
+                    value="SAVE AND CONTINUE &nbsp; &#9654;">
         </div>
     </form>
-
-    <div>
-
-        <a href="{% if new %}{% url "common_assignment_setup" %}
-            {% else %}{% url "common_assignment_modify" %}{% endif %}">
-            <button class="scb_ab_s_navigation_button scb_s_back_btn" role='button'>&#9664; &nbsp; BACK</button>
-        </a>
-
-    </div>
-
 {% endblock %}

instructor/templates/instructor/courses.html

@@ -9,7 +9,6 @@
         {% endfor %}
         </div>
         <hr>
-
     {% endfor %}
-<input type="submit" value="Save"/>
-</form>
+    <input type="submit" value="Save">
+</form>

instructor/templates/instructor/facs_analyze.html

@@ -127,7 +127,7 @@ <h1 class="scb_ab_s_dialog_title" role="presentation" aria-label="Create Histogr
                     <div class="scb_ab_s_histogram_tab_selected">Select Histogram</div>
                     <div class="scb_ab_s_histogram_tab_not_selected">Draw New Histogram</div>
                 </div>
-             <div class="scb_ab_s_draw_new_histogram_content">
+                <div class="scb_ab_s_draw_new_histogram_content">
                     <div class="scb_ab_s_chosen_sample_heading">
                         <div class="scb_ab_s_row scb_ab_s_grouping_header_row">
                             <div class="scb_ab_s_facs_condition_header scb_ab_f_treatment_text">
@@ -136,7 +136,6 @@ <h1 class="scb_ab_s_dialog_title" role="presentation" aria-label="Create Histogr
                         <div class="scb_ab_s_row scb_ab_f_sample_name">
                         </div>
                     </div>
-
                 </div>
                 <div class="scb_ab_s_canvas_library scb_ab_s_canvas_library_histogram">
                     {% for histogram in all_histograms %}
@@ -147,20 +146,15 @@ <h1 class="scb_ab_s_dialog_title" role="presentation" aria-label="Create Histogr
                         </div>
 
                     {% endfor %}
-
                 </div>
                 <div class="scb_ab_s_save_btn_position_wrapper">
                     <button class="scb_s_gray_button scb_ab_s_save_btn_position scb_ab_f_save_selected_histogram">
                         SAVE HISTOGRAM
                     </button>
                 </div>
-
             </div>
-
         </div>
     </div><!-- End of hidden window -->
-
-
     <div class="scb_ab_s_heading_div">
         <div class="scb_ab_s_page_title">Analyze</div>
         <div class='scb_ab_s_heading_description'>
@@ -176,16 +170,12 @@ <h1 class="scb_ab_s_dialog_title" role="presentation" aria-label="Create Histogr
             </div>
             <!-- Instances are grouped by cell_treatment, analysis, condition-->
             {% for cell_treatment, analysis, condition, instance_list in histogram_groups %}
-
                 <div class="scb_ab_s_row scb_ab_s_grouping_header_row">
                     <div class="scb_ab_s_facs_condition_header">
                         {{ cell_treatment }}, {{ analysis }}, {{ condition }}
                     </div>
                 </div>
-
                 {% for instance in instance_list %}
-
-
                     <div class="scb_ab_s_row">
                         <div class="scb_ab_s_col_width_number">{{ forloop.counter }}.</div>
                         <div class="scb_ab_s_col_width_facs_sample">
@@ -212,18 +202,15 @@ <h1 class="scb_ab_s_dialog_title" role="presentation" aria-label="Create Histogr
                     </div>
                     <!-- display selected histogram, small version  -->
                     <div class="scb_ab_s_row">
-
                     </div>
                     <div class="scb_ab_s_row" style="padding: 10px 0 8px 0">
-
                         <div class="scb_ab_s_col_width_number"></div>
                         <div class="scb_ab_s_col_width_facs_sample">
                             <div class="scb_ab_s_remove_histogram_icon_position">
                                 <span class="scb_ab_s_remove_icon scb_ab_f_remove_histogram"
                                       role="button" data-cell_treatment="{{ cell_treatment }}"
                                       data-pk="{{ instance.id }}" aria-label="Remove Histogram">×</span>
                             </div>
-
                             <canvas id="canvas-{{ cell_treatment }}_{{ instance.id }}"
                                 class="scb_ab_s_small_canvas">
                             </canvas>
@@ -251,26 +238,28 @@ <h1 class="scb_ab_s_dialog_title" role="presentation" aria-label="Create Histogr
                     </div>
                 {% endfor %}
             {% endfor %}
-            <input type="submit"
-                   name="continue"
-                   class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-                   value="SAVE AND CONTINUE &nbsp; &#9654;">
-            <input type="submit"
-                   name="save"
-                   class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-                   value="SAVE"/>
+            <div class="scb_ab_s_nav_controls scb_ab_s_shift_left">
+                <input type="button"
+                       class="scb_ab_s_navigation_button scb_s_back_btn"
+                       value="&#9664; &nbsp; BACK"
+                       data-location="{% url "facs_setup" %}">
+                <input type="submit"
+                       name="save"
+                       class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
+                       value="SAVE">
+                <input type="submit"
+                       name="continue"
+                       class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
+                       value="SAVE AND CONTINUE &nbsp; &#9654;">
+            </div>
         </form>
     </div>
-    <a href="{% url "facs_setup" %}">
-        <button class="scb_ab_s_navigation_button scb_s_back_btn" role='button'>&#9664; &nbsp; BACK</button>
-    </a>
     <script type="text/javascript">
-    all_histograms_data = {{ all_histograms_data|safe }}
-    histograms = {{ histograms|safe }};
-    scale = {{ scale|safe }};
-    x_upper_bound = {{ x_upper_bound|safe }};
-    y_upper_bound = {{ y_upper_bound|safe }};
-    paper.install(window);
-
+        all_histograms_data = {{ all_histograms_data|safe }}
+        histograms = {{ histograms|safe }};
+        scale = {{ scale|safe }};
+        x_upper_bound = {{ x_upper_bound|safe }};
+        y_upper_bound = {{ y_upper_bound|safe }};
+        paper.install(window);
     </script>
 {% endblock %}

instructor/templates/instructor/facs_sample_prep.html

@@ -35,17 +35,20 @@
         <div>
             <input type="submit" name="add" class='scb_s_gray_button scb_ab_s_experiment_setup_add_button' value="ADD">
         </div>
-        <input type="submit"
-               name="continue"
-               class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-               value="SAVE AND CONTINUE &nbsp; &#9654;">
-        <input type="submit"
-               name="save"
-               class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-               value="SAVE"/>
+        <div class="scb_ab_s_nav_controls">
+          <input type="button"
+                 class="scb_ab_s_navigation_button scb_s_back_btn"
+                 value="&#9664; &nbsp; BACK"
+                 data-location="{% url back_url %}">
+          <input type="submit"
+                 name="save"
+                 class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
+                 value="SAVE">
+          <input type="submit"
+                 name="continue"
+                 class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
+                 value="SAVE AND CONTINUE &nbsp; &#9654;">
+        </div>
     </form>
 </div>
-<a href="{% url back_url %}">
-    <button class="scb_ab_s_navigation_button scb_s_back_btn" role='button'>&#9664; &nbsp; BACK</button>
-</a>
 {% endblock %}

instructor/templates/instructor/facs_setup.html

@@ -35,18 +35,21 @@
       <div>{{ form.xrange }}</div>
       <div>{{ form.yrange }}</div>
     </div>
-    <input type="submit"
-           name="continue"
-           class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-           value="SAVE AND CONTINUE &nbsp; &#9654;">
-    <input type="submit"
-           name="save"
-           class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-           value="SAVE"/>
+    <div class="scb_ab_s_nav_controls">
+      <input type="button"
+             class="scb_ab_s_navigation_button scb_s_back_btn"
+             value="&#9664; &nbsp; BACK"
+             data-location="{% url "facs_sample_prep" %}">
+      <input type="submit"
+             name="save"
+             class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
+             value="SAVE">
+      <input type="submit"
+             name="continue"
+             class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
+             value="SAVE AND CONTINUE &nbsp; &#9654;">
+    </div>
   </form>
-  <a href="{% url "facs_sample_prep" %}">
-    <button class="scb_ab_s_navigation_button scb_s_back_btn" role='button'>&#9664; &nbsp; BACK</button>
-  </a>
   <script type="text/javascript">
     paper.install(window);
   </script>

instructor/templates/instructor/generic_formset.html

@@ -11,7 +11,7 @@
             {% for form in formset %}
                 {{ form.as_p }}
             {% endfor %}
-            <input type="submit" class="scb_s_assignment_setup_save_button scb_s_navigation_button" value="Submit Questions"/>
+            <input type="submit" class="scb_s_assignment_setup_save_button scb_s_navigation_button" value="Submit Questions">
         </form>
     </div>
 {% endblock %}

instructor/templates/instructor/micro_analyze.html

@@ -201,20 +201,23 @@ <h1 class="scb_ab_s_dialog_title" role="presentation" aria-label="Create Histogr
           {% endif %}
         {% endfor %}
       {% endfor %}
-      <input type="submit"
-             name="continue"
-             class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-             value="{{ save_and_continue }} &nbsp; &#9654;">
-      <input type="submit"
-             name="save"
-             class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
-             value="SAVE"/>
+      <div class="scb_ab_s_nav_controls scb_ab_s_shift_left">
+        <input type="button"
+               class="scb_ab_s_navigation_button scb_s_back_btn"
+               value="&#9664; &nbsp; BACK"
+               data-location="{% url "microscopy_sample_prep" %}">
+        <input type="submit"
+               name="save"
+               class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
+               value="SAVE">
+        <input type="submit"
+               name="continue"
+               class="scb_ab_s_navigation_button scb_ab_s_nav_continue_btn"
+               value="{{ save_and_continue }} &nbsp; &#9654;">
+      </div>
     </form>
   </div>
-  <a href="{% url "microscopy_sample_prep" %}">
-    <button class="scb_ab_s_navigation_button scb_s_back_btn" role='button'>&#9664; &nbsp; BACK</button>
-  </a>
-   <script type="text/javascript">
+  <script type="text/javascript">
     dialog_open = {{ dialog_open|safe }};
   </script>
 {% endblock %}