studio html editor - sync'ed up previous style and behavior work to refactored xmodule sass/js

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

@@ -27,6 +27,7 @@
         background: rgba(255, 255, 255, .5);
       }
     }
+  }
 
   .editor-tabs {
     position: absolute;
@@ -35,6 +36,11 @@
 
     li {
       float: left;
+      margin-right: 5px;
+
+      &:last-child {
+        margin-right: 0;
+      }
     }
 
     .tab {
@@ -55,5 +61,4 @@
       }
     }
   }
-  }
 }
\ No newline at end of file

common/lib/xmodule/xmodule/css/html/edit.scss

@@ -2,19 +2,28 @@
   @include clearfix();
 
   .CodeMirror {
-    display: none;
+    @include box-sizing(border-box);
     position: absolute;
     top: 46px;
     width: 100%;
-    height: 378px;
+    height: 379px;
+    border: 1px solid #3c3c3c;
+    border-top: 1px solid #8891a1;
     background: #fff;
     color: #3c3c3c;
-    @include box-sizing(border-box);
+  }
+
+  .CodeMirror-scroll {
+    height: 100%;
   }
 
   .editor-tabs {
-    top: 11px;
-    right: 30px;
+    top: 11px !important;
+    right: 10px;
     z-index: 99;
   }
+
+  .is-inactive {
+    display: none;
+  }
 }
\ No newline at end of file

common/lib/xmodule/xmodule/editing_module.py

@@ -30,7 +30,7 @@ class XMLEditingDescriptor(EditingDescriptor):
     any validation of its definition
     """
 
-    css = {'scss': [resource_string(__name__, 'css/editor/display.scss'), resource_string(__name__, 'css/codemirror/codemirror.scss')]}
+    css = {'scss': [resource_string(__name__, 'css/codemirror/codemirror.scss')]}
 
     js = {'coffee': [resource_string(__name__, 'js/src/raw/edit/xml.coffee')]}
     js_module_name = "XMLEditingDescriptor"
@@ -42,7 +42,7 @@ class JSONEditingDescriptor(EditingDescriptor):
     any validation of its definition
     """
 
-    css = {'scss': [resource_string(__name__, 'css/editor/display.scss'), resource_string(__name__, 'css/codemirror/codemirror.scss')]}
+    css = {'scss': [resource_string(__name__, 'css/codemirror/codemirror.scss')]}
 
     js = {'coffee': [resource_string(__name__, 'js/src/raw/edit/json.coffee')]}
     js_module_name = "JSONEditingDescriptor"

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

@@ -9,6 +9,8 @@ class @HTMLEditingDescriptor
       lineNumbers: true
       lineWrapping: true})
 
+    $(@advanced_editor.getWrapperElement()).addClass('is-inactive')
+
     @tiny_mce_textarea = $(".tiny-mce", @element).tinymce({
       script_url : '/static/js/vendor/tiny_mce/tiny_mce.js',
       theme : "advanced",
@@ -41,18 +43,20 @@ class @HTMLEditingDescriptor
       $(e.currentTarget).addClass('current')
       visualEditor = @getVisualEditor()
 
-      $('table.mceToolbar').toggleClass('is-inactive')
-      $(@advanced_editor.getWrapperElement()).toggleClass('is-inactive')
-
       if $(e.currentTarget).attr('data-tab') is 'visual'
         @showVisualEditor(visualEditor)
+        $('table.mceToolbar').removeClass('is-inactive')
+        $(@advanced_editor.getWrapperElement()).addClass('is-inactive')
+
       else
         # @tiny_mce_textarea.hide()
         @showAdvancedEditor(visualEditor)
+        $('table.mceToolbar').addClass('is-inactive')
+        $(@advanced_editor.getWrapperElement()).removeClass('is-inactive')
+
 
   # Show the Advanced (codemirror) Editor. Pulled out as a helper method for unit testing.
   showAdvancedEditor: (visualEditor) ->
-    # $(@advanced_editor.getWrapperElement()).show()
     if visualEditor.isDirty()
       @advanced_editor.setValue(visualEditor.getContent({no_events: 1}))
       @advanced_editor.setCursor(0)