tiny mce styling

cms/static/coffee/src/views/unit.coffee

@@ -96,7 +96,6 @@ class CMS.Views.UnitEdit extends Backbone.View
         initProblemEditors(@$editor, $preview)
       when 'html'
         @$editor = $($('#html-editor').html())
-        $preview = $('<div class="html-preview">')
         initHTMLEditor(@$editor, $preview)
       when 'discussion'
         @$editor = $($('#discussion-editor').html())
@@ -110,7 +109,8 @@ class CMS.Views.UnitEdit extends Backbone.View
     $componentActions = $($('#component-actions').html())
 
     @$componentItem.append(@$editor)
-    @$componentItem.append($preview)
+    if $preview
+      @$componentItem.append($preview)
 
     @$componentItem.append($componentActions)
     @$componentItem.hide()

cms/static/js/html-editor.js

@@ -60,11 +60,7 @@ function initHTMLEditor($editor, $prev) {
     // Example content CSS (should be your site CSS)
     content_css : "/static/css/html-editor.css",
     width: '100%',
-    height: '400px',
-    setup : function(ed) {
-      ed.onChange.add(onHTMLEditorUpdate);
-      ed.onKeyUp.add(onHTMLEditorUpdate);
-    }
+    height: '400px'
   });
 
 }

cms/static/js/tiny_mce/themes/advanced/skins/studio/ui.css

@@ -63,16 +63,18 @@
 
 /* ListBox */
 .studioSkin .mceListBox {
-  background: #fff;
+  background: -webkit-linear-gradient(top, #dbe5ef, #cfdce9);
+  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 0 0 1px rgba(0, 0, 0, 0.2);
   border-radius: 2px;
   padding: 3px;
   margin-right: 4px;
 }
+.studioSkin .mceListBox:hover {
+  background: -webkit-linear-gradient(top, #e6eff8, #d9e8f6);
+}
 .studioSkin .mceListBox, .studioSkin .mceListBox a {display:block}
 .studioSkin .mceListBox .mceText {padding-left:4px; width:70px; text-align:left; font-size:11px; height:20px; line-height:20px; overflow:hidden}
 .studioSkin .mceListBox .mceOpen {width:9px; height:20px; background:url(../../img/studio-icons.png) -741px 0; margin-right:2px;}
-.studioSkin table.mceListBoxEnabled:hover .mceText, .studioSkin .mceListBoxHover .mceText, .studioSkin .mceListBoxSelected .mceText {background:#FFF}
-.studioSkin table.mceListBoxEnabled:hover .mceOpen, .studioSkin .mceListBoxHover .mceOpen, .studioSkin .mceListBoxSelected .mceOpen {background-color: rgba(255, 255, 255, .5);}
 .studioSkin .mceListBoxDisabled a.mceText {color:gray; background-color:transparent;}
 .studioSkin .mceListBoxMenu {overflow:auto; overflow-x:hidden}
 .studioSkin .mceOldBoxModel .mceListBox .mceText {height:22px}