Add react challenge view with editor

client/less/main.less

@@ -1,4 +1,4 @@
-@import "lib/bootstrap/bootstrap";
+            @import "lib/bootstrap/bootstrap";
 @import "lib/bootstrap-social/bootstrap-social";
 @import "lib/ionicons/ionicons";
 @import "lib/animate.min.less";
@@ -682,21 +682,11 @@ form.update-email .btn{
   padding-bottom: 117%;
 }
 
-#directions {
-  text-align: left;
-  font-size: 15px;
-}
-
 .graph-rect {
   fill: #ddd !important
 }
 
-
-/**
- * Challenge styling
- */
-
-form.code span {
+.CodeMirror span {
   font-size: 18px;
   font-family: "Ubuntu Mono";
   padding-bottom: 0px;
@@ -713,7 +703,7 @@ form.code span {
   font-family: "Ubuntu Mono";
 }
 
-#mainEditorPanel {
+.challenges-editor {
   height: 100%;
   width: 99%;
 }
@@ -723,10 +713,6 @@ form.code span {
   overflow-y: auto;
 }
 
-#mainEditorPanel .panel-body {
-  padding-bottom: 0px;
-}
-
 div.CodeMirror-scroll {
   padding-bottom: 30px;
 }
@@ -742,6 +728,11 @@ div.CodeMirror-scroll {
   min-height: 650px;
 }
 
+.challenge-log .CodeMirror {
+  height: 100%;
+  width: 100%;
+}
+
 .btn {
   font-weight: 400;
   white-space: normal;