diff --git a/cms/envs/common.py b/cms/envs/common.py index a8b2fc1276..817fe27594 100644 --- a/cms/envs/common.py +++ b/cms/envs/common.py @@ -316,6 +316,7 @@ PIPELINE_CSS = { }, 'style-vendor-tinymce-content': { 'source_filenames': [ + 'css/tinymce-studio-content-fonts.css', 'js/vendor/tinymce/js/tinymce/skins/studio-tmce4/content.min.css', 'css/tinymce-studio-content.css' ], diff --git a/common/static/css/tinymce-studio-content-fonts.css b/common/static/css/tinymce-studio-content-fonts.css new file mode 100644 index 0000000000..0fc13697a4 --- /dev/null +++ b/common/static/css/tinymce-studio-content-fonts.css @@ -0,0 +1,2 @@ +/* NOTE: This file, which loads all necessary fonts for rendering Studio UI, is 1 of 3 CSS files compiled in our production pipeline */ +@import url(//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,300,600,700); diff --git a/common/static/css/tinymce-studio-content.css b/common/static/css/tinymce-studio-content.css index 81598f8d01..cfe542239b 100644 --- a/common/static/css/tinymce-studio-content.css +++ b/common/static/css/tinymce-studio-content.css @@ -1,10 +1,9 @@ -@import url(//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,300,600,700); - +/* NOTE: This file, which customizes mid-editing styling to match xmodule preview rendering, is 3 of 3 CSS files compiled in our production pipeline */ .mce-content-body { padding: 10px; background-color: #fff; font-family: 'Open Sans', Verdana, Arial, Helvetica, sans-serif; - font-size: 14px; + font-size: 16px; line-height: 1.6; color: #3c3c3c; scrollbar-3dlight-color: #F0F0EE; @@ -28,7 +27,7 @@ .mce-content-body h2 { color: #646464; - font-weight: normal; + font-weight: 300; font-size: 1.2em; line-height: 1.2em; letter-spacing: 1px; diff --git a/common/static/js/vendor/tinymce/js/tinymce/skins/studio-tmce4/content.min.css b/common/static/js/vendor/tinymce/js/tinymce/skins/studio-tmce4/content.min.css index c2e367f5b2..214e570d69 100755 --- a/common/static/js/vendor/tinymce/js/tinymce/skins/studio-tmce4/content.min.css +++ b/common/static/js/vendor/tinymce/js/tinymce/skins/studio-tmce4/content.min.css @@ -1 +1,2 @@ +/* NOTE: This file, which based off of TinyMCE's vendor content styling (but customized to help with scoping), is 2 of 3 CSS files compiled in our production pipeline */ .mce-content-body{background-color:#fff;font-family:Verdana,Arial,Helvetica,sans-serif;font-size:14px;scrollbar-3dlight-color:#f0f0ee;scrollbar-arrow-color:#676662;scrollbar-base-color:#f0f0ee;scrollbar-darkshadow-color:#ddd;scrollbar-face-color:#e0e0dd;scrollbar-highlight-color:#f0f0ee;scrollbar-shadow-color:#f0f0ee;scrollbar-track-color:#f5f5f5}.mce-content-body td,.mce-content-body th{font-family:Verdana,Arial,Helvetica,sans-serif;font-size:11px}.mce-content-body .mce-object{border:1px dotted #3a3a3a;background:#d5d5d5 url(img/object.gif) no-repeat center}.mce-content-body .mce-pagebreak{cursor:default;display:block;width:100%;height:5px;border:1px dashed #666;margin-top:15px}.mce-content-body .mce-item-anchor{cursor:default;display:inline-block;-webkit-user-select:all;-webkit-user-modify:read-only;-moz-user-select:all;-moz-user-modify:read-only;user-select:all;user-modify:read-only;width:9px!important;height:9px!important;border:1px dotted #3a3a3a;background:#d5d5d5 url(img/anchor.gif) no-repeat center}.mce-content-body .mce-nbsp{background:#AAA}.mce-content-body hr{cursor:default}.mce-content-body .mce-match-marker{background:#AAA;color:#fff}.mce-content-body .mce-match-marker-selected{background:#39f;color:#fff}.mce-content-body .mce-spellchecker-word{background:url(img/wline.gif) repeat-x bottom left;cursor:default}.mce-content-body .mce-item-table,.mce-content-body .mce-item-table caption,.mce-content-body .mce-item-table td,.mce-content-body .mce-item-table th{border:1px dashed #BBB}.mce-content-body td.mce-item-selected,.mce-content-body th.mce-item-selected{background-color:#39f!important}.mce-content-body .mce-edit-focus{outline:1px dotted #333}