Some interface cleanup stuff for the combined open ended module.

common/lib/xmodule/xmodule/combined_open_ended_module.py

@@ -305,6 +305,7 @@ class CombinedOpenEndedModule(XModule):
             'task_count': len(self.task_xml),
             'task_number': self.current_task_number + 1,
             'status': self.get_status(),
+            'display_name': self.display_name 
         }
 
         return context

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

@@ -40,6 +40,10 @@ section.combined-open-ended {
       width: 93%;
       position:relative;
   }
+  h4
+  {
+      margin-bottom:10px;
+  }
 }
 
 section.combined-open-ended-status {
@@ -49,15 +53,12 @@ section.combined-open-ended-status {
       color: #2C2C2C;
       font-family: monospace;
       font-size: 1em;
-      padding-top: 10px;
+      padding: 10px;
    }
 
    .statusitem-current {
-     background-color: #BEBEBE;
+     background-color: #ccc;
      color: #2C2C2C;
-     font-family: monospace;
-     font-size: 1em;
-     padding-top: 10px;
   }
 
     span {

lms/templates/combined_open_ended.html

 <section id="combined-open-ended" class="combined-open-ended" data-ajax-url="${ajax_url}" data-allow_reset="${allow_reset}" data-state="${state}" data-task-count="${task_count}" data-task-number="${task_number}">
 
+    <h2>${display_name}</h2>
     <div class="status-container">
-        <h4>Status</h4><br/>
+        <h4>Status</h4>
+        <div class="status-elements">
             ${status | n}
         </div>
+    </div>
 
     <div class="item-container">
-        <h4>Problem</h4><br/>
+        <h4>Problem</h4>
+        <div class="problem-container">
         % for item in items:
         <div class="item">${item['content'] | n}</div>
         % endfor
+        </div>
 
 
         <input type="button" value="Reset" class="reset-button" name="reset"/>

lms/templates/combined_open_ended_status.html

@@ -2,7 +2,7 @@
     %for i in xrange(0,len(status_list)):
         <%status=status_list[i]%>
         %if i==len(status_list)-1:
-            <div class="statusitem-current" data-status-number="${i}">
+            <div class="statusitem statusitem-current" data-status-number="${i}">
         %else:
             <div class="statusitem" data-status-number="${i}">
         %endif