Merge pull request #9168 from edx/marco/TNL-2946/capa/styling-fixes

Capa Styling Fixes for Annotation Problems

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

@@ -17,6 +17,7 @@
 // * +Problem - Annotation
 // * +Problem - Choice Text Group
 // * +Problem - Image Input Overrides
+// * +Problem - Annotation Problem Overrides
 
 // +Variables - Capa
 // ====================
@@ -464,15 +465,6 @@ div.problem {
         background: url('../images/correct-icon.png') center center no-repeat;
       }
 
-      &.partially-correct {
-        display: inline-block;
-        position: relative;
-        top: 6px;
-        width: 25px;
-        height: 20px;
-        background: url('../images/partially-correct-icon.png') center center no-repeat;
-      }
-
       &.incomplete, &.ui-icon-close {
         display: inline-block;
         position: relative;
@@ -1378,10 +1370,44 @@ div.problem .imageinput.capa_inputtype {
     width: 25px;
     height: 20px;
   }
+
   .correct {
     background: url('../images/correct-icon.png') center center no-repeat;
   }
+
   .incorrect {
     background: url('../images/incorrect-icon.png') center center no-repeat;
   }
+
+  .partially-correct {
+    background: url('../images/partially-correct-icon.png') center center no-repeat;
+  }
 }
+
+// +Problem - Annotation Problem Overrides
+// ====================
+
+// NOTE: temporary override until annotation problem inputs use same base html structure as other common capa input types.
+div.problem .annotation-input {
+
+  .tag-status {
+    display: inline-block;
+    position: relative;
+    top: 3px;
+    width: 25px;
+    height: 20px;
+  }
+
+  .correct {
+    background: url('../images/correct-icon.png') center center no-repeat;
+  }
+
+  .incorrect {
+    background: url('../images/incorrect-icon.png') center center no-repeat;
+  }
+
+  .partially-correct {
+    background: url('../images/partially-correct-icon.png') center center no-repeat;
+  }
+}
+