Updates to the CSS and html formatting for statuses

and self-assessment

common/lib/xmodule/xmodule/css/combinedopenended/display.scss

@@ -54,10 +54,17 @@ section.combined-open-ended-status {
       font-family: monospace;
       font-size: 1em;
       padding: 10px;
+      .show-results {
+          margin-top: .3em;
+          text-align:right;
+      }
+      .show-results-button {
+          font: 1em monospace;
+      }
    }
 
    .statusitem-current {
-     background-color: #ccc;
+     background-color: #cdc;
      color: #2C2C2C;
   }
 
@@ -624,7 +631,15 @@ section.open-ended-child {
     font-size: 0.9em;
   }
 
-  .assessment {
-      margin: 40px 0px 20px 0px;
+  .assessment-container {
+      margin: 40px 0px 30px 0px;
+      .scoring-container
+      {
+          p
+          {
+              margin-bottom: 1em;
+          }
+
+      }
   }
 }

lms/templates/combined_open_ended.html

@@ -2,10 +2,7 @@
 
     <h2>${display_name}</h2>
     <div class="status-container">
-        <h4>Status</h4>
-        <div class="status-elements">
             ${status | n}
-        </div>
     </div>
 
     <div class="item-container">
@@ -21,6 +18,7 @@
         <input type="button" value="Next Step" class="next-step-button" name="reset"/>
     </div>
 
+    <a name="results" />
     <div class="result-container">
     </div>
 </section>

lms/templates/combined_open_ended_results.html

 <div class="result-container">
-    <h4>Results from Step ${task_number}</h4><br/>
+    <h4>Results from Step ${task_number}</h4>
     ${results | n}
-</div>
+</div>
\ No newline at end of file

lms/templates/combined_open_ended_status.html

+%if len(status_list) > 1:
+<h4>Status</h4>
+<div class="status-elements">
 <section id="combined-open-ended-status" class="combined-open-ended-status">
     %for i in xrange(0,len(status_list)):
         <%status=status_list[i]%>
@@ -20,9 +23,12 @@
 
             %if status['type']=="openended" and status['state'] in ['done', 'post_assessment']:
                 <div class="show-results">
-                    <a href="#" class="show-results-button">Show results from step ${status['task_number']}</a>
+                    <a href="#results" class="show-results-button">Show results from Step ${status['task_number']}</a>
+
                 </div>
             %endif
         </div>
     %endfor
 </section>
+</div>
+%endif

lms/templates/self_assessment_rubric.html

-<div class="assessment">
+<div class="assessment-container">
     <div class="rubric">
     ${rubric | n }
     </div>
 
     % if not read_only:
+    <div class="scoring-container">
+    <h3>Scoring</h3>
+    <p>Please select a score below:</p>
     <select name="assessment" class="assessment">
         %for i in xrange(0,max_score+1):
             <option value="${i}">${i}</option>
         %endfor
     </select>
+    </div>
     % endif
 
 </div>