Rename, add css file.

cms/templates/widgets/problem-edit.html

 <%include file="metadata-edit.html" />
 <section class="problem-editor editor">
     <div class="row">
-        <%
-         markdown = 'foo'
-        %>
         %if markdown != '' or data == '':
         <div class="editor-bar">
             <ul class="format-buttons">
@@ -24,7 +21,7 @@
                 <li><a href="#" class="cheatsheet-toggle" data-tooltip="Toggle Cheatsheet">?</a></li>
             </ul>
         </div>
-        <textarea class="edit-box">${markdown}</textarea>
+        <textarea class="markdown-box">${markdown}</textarea>
         %endif
         <textarea class="xml-box" rows="8" cols="40">${data | h}</textarea>
     </div>

common/lib/xmodule/xmodule/capa_module.py

@@ -651,8 +651,9 @@ class CapaDescriptor(RawDescriptor):
     has_score = True
     template_dir_name = 'problem'
     mako_template = "widgets/problem-edit.html"
-    js = {'coffee': [resource_string(__name__, 'js/src/problem/markdown.coffee')]}
+    js = {'coffee': [resource_string(__name__, 'js/src/problem/edit.coffee')]}
     js_module_name = "MarkdownEditingDescriptor"
+    css = {'scss': [resource_string(__name__, 'css/problem/edit.scss')]}
 
     # Capa modules have some additional metadata:
     # TODO (vshnayder): do problems have any other metadata?  Do they

common/lib/xmodule/xmodule/js/src/problem/edit.coffee

@@ -6,11 +6,12 @@ class @MarkdownEditingDescriptor extends XModule.Descriptor
     lineWrapping: true
     })
 
-    @markdown_editor = CodeMirror.fromTextArea($(".edit-box", @element)[0], {
-    lineWrapping: true
-    mode: null
-    onChange: @onMarkdownEditorUpdate
-    })
+    if $(".markdown-box", @element).length != 0
+      @markdown_editor = CodeMirror.fromTextArea($(".markdown-box", @element)[0], {
+      lineWrapping: true
+      mode: null
+      onChange: @onMarkdownEditorUpdate
+      })
 
   onMarkdownEditorUpdate: ->
     console.log('update')