revising newly abstracted template's HTML

apps/openassessment/templates/openassessmentblock/oa_response_submitted_collapsed.html

-{% extends "openassessmentblock/oa_response.html" %}
-
-{% block list_item %}
-<li id="openassessment__response" class="openassessment__steps__step step--response is--submitted is--unavailable ui-toggle-visibility">
-{% endblock %}
-
-{% block body %}
-    <div class="step__content">
-        <!-- user's response -->
-        <article class="submission__answer__display">
-            <h3 class="submission__answer__display__title">Your Submitted Response</h3>
-
-            <div class="submission__answer__display__content">
-                {{ student_submission.answer }}
-            </div>
-        </article>
-    </div>
-{% endblock %}

apps/openassessment/templates/openassessmentblock/peer/oa_peer_assessment.html

@@ -11,7 +11,7 @@
 
 <!-- CASE: default/not started -->
 {% block list_item %}
-<li id="openassessment__peer-assessment" class="openassessment__steps__step step--peer-assessment ui-toggle-visibility">
+<li id="openassessment__peer-assessment" class="openassessment__steps__step step--peer-assessment ui-toggle-visibility is--expanded">
 {% endblock %}
     <span class="system__element" id="peer_submission_uuid">
         {{ peer_submission.uuid }}

apps/openassessment/templates/openassessmentblock/peer/oa_peer_closed.html

@@ -3,14 +3,18 @@
 {% block list_item %}
 <li id="openassessment__peer-assessment"class="openassessment__steps__step step--peer-assessment is--unavailable ui-toggle-visibility is--collapsed">
 {% endblock %}
+
 {% block title %}
     <span class="step__status">
-      <span class="ico"><i class="fa fa-info-circle"></i></span>
       <span class="step__status__label">This step's status:</span>
       <span class="step__status__value">
-        <span class="step__status__value--completed">{{ graded }}</span> of
-        <span class="step__status__value--required">{{ must_grade }}</span> completed
+        <i class="ico fa fa-exclamation-triangle"></i>
+        <span class="copy">
+          <span class="step__status__value--completed">{{ graded }}</span> of
+          <span class="step__status__value--required">{{ must_grade }}</span> completed
+        </span>
       </span>
     </span>
 {% endblock %}
-{% block body %}{% endblock %}
\ No newline at end of file
+
+{% block body %}{% endblock %}

apps/openassessment/templates/openassessmentblock/peer/oa_peer_complete.html

@@ -3,14 +3,18 @@
 {% block list_item %}
 <li id="openassessment__peer-assessment" class="openassessment__steps__step step--peer-assessment ui-toggle-visibility is--collapsed">
 {% endblock %}
+
 {% block title %}
     <span class="step__status">
-      <span class="ico"><i class="fa fa-check"></i></span>
       <span class="step__status__label">This step's status:</span>
       <span class="step__status__value">
-        <span class="step__status__value--completed">{{ graded }}</span> of
-        <span class="step__status__value--required">{{ must_grade }}</span> completed
+        <i class="ico fa fa-check"></i>
+        <span class="copy">
+          <span class="step__status__value--completed">{{ graded }}</span> of
+          <span class="step__status__value--required">{{ must_grade }}</span> completed
+        </span>
       </span>
     </span>
 {% endblock %}
-{% block body %}{% endblock %}
\ No newline at end of file
+
+{% block body %}{% endblock %}

apps/openassessment/templates/openassessmentblock/peer/oa_peer_waiting.html

@@ -3,13 +3,15 @@
 {% block list_item %}
 <li id="openassessment__peer-assessment" class="openassessment__steps__step step--peer-assessment is--unavailable ui-toggle-visibility is--collapsed">
 {% endblock %}
+
 {% block title %}
     <span class="step__status">
       <span class="ico"><i class="fa fa-info-circle"></i></span>
       <span class="step__status__label">This step's status:</span>
       <span class="step__status__value">
-        Awaiting Peer Responses
+      <span class="copy">Awaiting Peer Responses</span>
       </span>
     </span>
 {% endblock %}
-{% block body %}{% endblock %}
\ No newline at end of file
+
+{% block body %}{% endblock %}

apps/openassessment/templates/openassessmentblock/response/oa_response.html

@@ -17,7 +17,6 @@
 <li id="openassessment__response" class="openassessment__steps__step step--response ui-toggle-visibility is--expanded">
 {% endblock %}
 
-    {%  block header %}
     <header class="step__header ui-toggle-visibility__control">
         <h2 class="step__title">
             <span class="step__counter"></span>
@@ -29,6 +28,7 @@
             </span>
         </h2>
 
+        {%  block title %}
         <span class="step__status">
             <span class="step__status__label">This step's status:</span>
             <span class="step__status__value">
@@ -36,8 +36,8 @@
                 <span class="copy">{{ step_status }}</span>
             </span>
         </span>
+        {% endblock %}
     </header>
-    {% endblock %}
 
     {% block body %}
     <div class="step__instruction">

apps/openassessment/templates/openassessmentblock/response/oa_response_closed.html

@@ -2,8 +2,19 @@
 {% block list_item %}
 <li id="openassessment__response" class="openassessment__steps__step step--response is--unavailable ui-toggle-visibility">
 {% endblock %}
+
+{% block title %}
+    <span class="step__status">
+      <span class="step__status__label">This step's status:</span>
+      <span class="step__status__value">
+        <i class="ico fa fa-exclamation-triangle"></i>
+        <span class="copy">{{ step_status }}</span>
+      </span>
+    </span>
+{% endblock %}
+
 {% block body %}
     <div class="step__instruction">
         <p>You did not complete this portion of the problem before its due date.</p>
     </div>
-{% endblock %}
\ No newline at end of file
+{% endblock %}

apps/openassessment/templates/openassessmentblock/response/oa_response_collapsed.html

 {%  extends "openassessmentblock/response/oa_response.html" %}
+
 {% block list_item %}
     <li id="openassessment__response" class="openassessment__steps__step step--response is--collapsed ui-toggle-visibility">
 {% endblock %}
+
 {% block body %}
-{% endblock %}
\ No newline at end of file
+{% endblock %}

apps/openassessment/templates/openassessmentblock/response/oa_response_graded.html

 {%  extends "openassessmentblock/response/oa_response.html" %}
+
 {% block list_item %}
 <li id="openassessment__response" class="openassessment__steps__step step--response is--graded is--collapsed ui-toggle-visibility">
 {% endblock %}
+
+{% block title %}
+    <span class="step__status">
+      <span class="step__status__label">This step's status:</span>
+      <span class="step__status__value">
+        <i class="ico fa fa-check"></i>
+        <span class="copy">{{ step_status }}</span>
+      </span>
+    </span>
+{% endblock %}
+
 {% block body %}
 <div class="step__content">
 <!-- user's response -->
@@ -18,6 +30,7 @@
 <h3 class="submission__peer-evaluations__title">Peer Evaluations Of Your Response</h3>
 
 <ol class="list submission__peer-evaluations__questions">
+
 {% for criterion in rubric_criteria %}
 {% with criterion_num=forloop.counter %}
 <!-- individual question from rubric -->
@@ -82,4 +95,4 @@
     </ul>
 </form>
 </div>
-{% endblock %}
\ No newline at end of file
+{% endblock %}

apps/openassessment/templates/openassessmentblock/response/oa_response_submitted.html

 {% extends "openassessmentblock/response/oa_response.html" %}
+
 {% block list_item %}
-<li id="openassessment__response" class="openassessment__steps__step step--response is--submitted is--unavailable ui-toggle-visibility">
+<li id="openassessment__response" class="openassessment__steps__step step--response is--submitted is--expanded ui-toggle-visibility">
+{% endblock %}
+
+{% block title %}
+    <span class="step__status">
+      <span class="step__status__label">This step's status:</span>
+      <span class="step__status__value">
+        <i class="ico fa fa-check"></i>
+        <span class="copy">{{ step_status }}</span>
+      </span>
+    </span>
 {% endblock %}
+
 {% block body %}
     <div class="step__content">
         <!-- user's response -->
@@ -13,4 +25,4 @@
             </div>
         </article>
     </div>
-{% endblock %}
\ No newline at end of file
+{% endblock %}

apps/openassessment/templates/openassessmentblock/self/oa_self_assessment.html

@@ -12,23 +12,27 @@
 
 <!-- CASE: default/not started -->
 {% block list_item %}
-<li id="openassessment__self-assessment" class="openassessment__steps__step step--self-assessment">
+<li id="openassessment__self-assessment" class="openassessment__steps__step step--self-assessment is--expanded">
 {% endblock %}
-    <header class="step__header">
+    <header class="step__header ui-toggle-visibility__control">
         <h2 class="step__title">
             <span class="step__counter"></span>
             <span class="wrapper--copy">
-                <span class="step__title__label">Evaluate Your Response</span>
+                <span class="step__label">Evaluate Your Response</span>
                 <span class="step__deadline">due <span class="date">{{ formatted_due_datetime }}</span></span>
             </span>
         </h2>
-    {% block title %}
+
+        {% block title %}
         <span class="step__status">
           <span class="step__status__label">This step's status:</span>
-          <span class="step_status_value">{{ step_status }}</span>
+          <span class="step__status__value">
+              <span class="copy">{{ step_status }}</span>
+          </span>
         </span>
-    {% endblock %}
+        {% endblock %}
     </header>
+
     {% block body %}
     <div class="step--content">
         <article class="self-assessment" id="self-assessment">

apps/openassessment/templates/openassessmentblock/self/oa_self_assessment_collapsed.html

 {%  extends "openassessmentblock/self/oa_self_assessment.html" %}
+
 {% block list_item %}
     <li id="openassessment__self-assessment" class="openassessment__steps__step is--collapsed step--self-assessment">
 {% endblock %}
+
 {% block body %}
 {% endblock %}
-

apps/openassessment/templates/openassessmentblock/self/oa_self_closed.html

 {%  extends "openassessmentblock/self/oa_self_assessment.html" %}
+
 <!-- CASE: not started and problem closed -->
 {% block list_item %}
 <li id="openassessment__self-assessment" class="openassessment__steps__step step--self-assessment is--unavailable ui-toggle-visibility is--collapsed">
 {% endblock %}
+
 {% block title %}
     <span class="step__status">
-      <span class="ico"><i class="fa fa-info-circle"></i></span>
       <span class="step__status__label">This step's status:</span>
-      <span class="step_status_value">{{ step_status }}</span>
+      <span class="step__status__value">
+        <i class="ico fa fa-exclamation-triangle"></i>
+        <span class="copy">{{ step_status }}</span>
+      </span>
     </span>
 {% endblock %}
-{% block body %}{% endblock %}
\ No newline at end of file
+
+{% block body %}{% endblock %}

apps/openassessment/templates/openassessmentblock/self/oa_self_complete.html

 {%  extends "openassessmentblock/self/oa_self_assessment.html" %}
+
 <!-- CASE: complete -->
 {% block list_item %}
 <li id="openassessment__self-assessment" class="openassessment__steps__step step--self-assessment ui-toggle-visibility is--collapsed">
 {% endblock %}
+
 {% block title %}
     <span class="step__status">
-      <span class="ico"><i class="fa fa-check"></i></span>
       <span class="step__status__label">This step's status:</span>
-      <span class="step_status_value">{{ step_status }}</span>
+      <span class="step__status__value">
+        <i class="ico fa fa-check"></i>
+        <span class="copy">{{ step_status }}</span>
+      </span>
     </span>
 {% endblock %}
-{% block body %}{% endblock %}
\ No newline at end of file
+
+{% block body %}{% endblock %}