From 9fe305e02b9b00c3c95d33a51f76f288b9d95cc8 Mon Sep 17 00:00:00 2001
From: Will Daly <will@edx.org>
Date: Wed, 27 Feb 2013 13:05:29 -0500
Subject: [PATCH] Modified ChoiceGroup to display correct/incorrect indicators
 (check or x) next to the option the user selected (check boxes or radio
 buttons).

---
 .../lib/capa/capa/templates/choicegroup.html  | 38 ++++++++++++-------
 .../lib/xmodule/xmodule/css/capa/display.scss |  4 +-
 2 files changed, 27 insertions(+), 15 deletions(-)

diff --git a/common/lib/capa/capa/templates/choicegroup.html b/common/lib/capa/capa/templates/choicegroup.html
index 457d9e7817..b9d8164321 100644
--- a/common/lib/capa/capa/templates/choicegroup.html
+++ b/common/lib/capa/capa/templates/choicegroup.html
@@ -1,23 +1,35 @@
 <form class="choicegroup capa_inputtype" id="inputtype_${id}">
-  <div class="indicator_container">
-    % if status == 'unsubmitted':
-    <span class="unanswered" style="display:inline-block;" id="status_${id}"></span>
-    % elif status == 'correct': 
-    <span class="correct" id="status_${id}"></span>
-    % elif status == 'incorrect':
-    <span class="incorrect" id="status_${id}"></span>
-    % elif status == 'incomplete':
-    <span class="incorrect" id="status_${id}"></span>
-    % endif
-  </div>
 
   <fieldset>
     % for choice_id, choice_description in choices:
-    <label for="input_${id}_${choice_id}">  <input type="${input_type}" name="input_${id}${name_array_suffix}" id="input_${id}_${choice_id}" value="${choice_id}"
+    <label for="input_${id}_${choice_id}">          
+
+        % if choice_id in value:
+        <span class="indicator_container">
+            % if status == 'unsubmitted':
+            <span class="unanswered" style="display:inline-block;" id="status_${id}"></span>
+            % elif status == 'correct': 
+            <span class="correct" id="status_${id}"></span>
+            % elif status == 'incorrect':
+            <span class="incorrect" id="status_${id}"></span>
+            % elif status == 'incomplete':
+            <span class="incorrect" id="status_${id}"></span>
+            % endif
+        </span>
+        % else:
+        <span class="indicator_container">&#160;</span>
+        % endif
+        
+        <input type="${input_type}" name="input_${id}${name_array_suffix}" id="input_${id}_${choice_id}" value="${choice_id}"
     % if choice_id in value:
     checked="true"
     % endif
-    /> ${choice_description} </label>
+    />
+    
+    ${choice_description}
+
+    </label>
+
     % endfor
     <span id="answer_${id}"></span>
   </fieldset>
diff --git a/common/lib/xmodule/xmodule/css/capa/display.scss b/common/lib/xmodule/xmodule/css/capa/display.scss
index d40bdb556e..007178834d 100644
--- a/common/lib/xmodule/xmodule/css/capa/display.scss
+++ b/common/lib/xmodule/xmodule/css/capa/display.scss
@@ -227,7 +227,7 @@ section.problem {
         background: url('../images/correct-icon.png') center center no-repeat;
         height: 20px;
         position: relative;
-        top: 6px;
+        top: 3px;
         width: 25px;
       }
 
@@ -237,7 +237,7 @@ section.problem {
         height: 20px;
         width: 20px;
         position: relative;
-        top: 6px;
+        top: 3px;
       }
     }