Add js to the problem and move around that css and js to accomodate Tonys new HTML Structure

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

@@ -453,37 +453,33 @@ section.problem {
       }
     }
 
-    .longform, .shortform {
+    > section {
       border: 1px solid #ddd;
-      padding: 9px;
+      padding: 9px 9px 20px;
       margin-bottom: 10px;
       background: #FFF;
+      position: relative;
       @include box-shadow(inset 0 0 0 1px #eee);
       @include border-radius(3px);
 
       p:last-of-type {
         margin-bottom: 0;
       }
-    }
-
-    a.full {
-      @include position(absolute,  0 0 1px 0px);
-      font-size: .8em;
-      padding: 4px;
-      text-align: right;
-      width: 100%;
-      display: block;
-      background: #F3F3F3;
-      @include box-sizing(border-box);
-    }
 
-    .longform {
-      position: relative;
-      padding-bottom: 20px;
-    }
+      .shortform {
+        margin-bottom: .6em;
+      }
 
-    .longform-header {
-      margin-bottom: .6em;
+      a.full {
+        @include position(absolute,  0 0 1px 0px);
+        font-size: .8em;
+        padding: 4px;
+        text-align: right;
+        width: 100%;
+        display: block;
+        background: #F3F3F3;
+        @include box-sizing(border-box);
+      }
     }
   }
 }

lms/templates/problem.html

@@ -32,3 +32,27 @@
   </section>
 </section>
 
+<%block name="js_extra">
+<script type="text/javascript" charset="utf-8">
+  $(function(){
+      // this should be brought back into problems
+      $('.longform').hide();
+      $('.shortform').append('<a href="#" class="full">See full output</a>');
+
+      $('.full').click(function() {
+        $(this).parent().siblings().slideToggle();
+        $(this).parent().parent().toggleClass('open');
+        var text = $(this).text() == 'See full output' ? 'Hide output' : 'See full output';
+        $(this).text(text);
+        return false;
+      });
+
+      $('.collapsible section').hide()
+      $('.collapsible header a').click(function() {
+        $(this).parent().siblings().slideToggle();
+        $(this).parent().parent().toggleClass('open');
+        return false
+      });
+    });
+</script>
+</%block>