From 86722dfaaa7d82cab56a2afc23e47f14651ebbac Mon Sep 17 00:00:00 2001 From: Scott Taylor Date: Fri, 14 Mar 2014 12:33:24 +0000 Subject: [PATCH] Load MediaElement's CSS when TinyMCE is loaded via `$mce_css` in `editor_settings()`. Add some baseline styles in `wp-content.css` for audio, video, and embed tags to ensure their `max-width` is `100%`, regardless of whether MEjs is implemented in TinyMCE. See #27389. git-svn-id: https://develop.svn.wordpress.org/trunk@27534 602fd350-edb4-49c9-b593-d223f7449a82 --- src/wp-includes/class-wp-editor.php | 11 +++++++++-- src/wp-includes/js/mediaelement/wp-mediaelement.css | 2 +- .../js/tinymce/skins/wordpress/wp-content.css | 7 +++++++ 3 files changed, 17 insertions(+), 3 deletions(-) diff --git a/src/wp-includes/class-wp-editor.php b/src/wp-includes/class-wp-editor.php index 1ad8900862..ee1c14e69a 100644 --- a/src/wp-includes/class-wp-editor.php +++ b/src/wp-includes/class-wp-editor.php @@ -343,9 +343,16 @@ final class _WP_Editors { $suffix = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ? '' : '.min'; $version = 'ver=' . $GLOBALS['wp_version']; $dashicons = includes_url( "css/dashicons$suffix.css?$version" ); - + $mediaelement = includes_url( "js/mediaelement/mediaelementplayer.min.css?$version" ); + $wpmediaelement = includes_url( "js/mediaelement/wp-mediaelement.css?$version" ); + // WordPress default stylesheet and dashicons - $mce_css = array( $dashicons, self::$baseurl . '/skins/wordpress/wp-content.css' ); + $mce_css = array( + $dashicons, + $mediaelement, + $wpmediaelement, + self::$baseurl . '/skins/wordpress/wp-content.css' + ); // load editor_style.css if the current theme supports it if ( ! empty( $GLOBALS['editor_styles'] ) && is_array( $GLOBALS['editor_styles'] ) ) { diff --git a/src/wp-includes/js/mediaelement/wp-mediaelement.css b/src/wp-includes/js/mediaelement/wp-mediaelement.css index 4abfef8697..b4ae4da99b 100644 --- a/src/wp-includes/js/mediaelement/wp-mediaelement.css +++ b/src/wp-includes/js/mediaelement/wp-mediaelement.css @@ -1,5 +1,5 @@ .mejs-container, .mejs-embed, .mejs-embed body { - background: #464646; + background: #000; } .mejs-controls .mejs-time-rail .mejs-time-loaded { diff --git a/src/wp-includes/js/tinymce/skins/wordpress/wp-content.css b/src/wp-includes/js/tinymce/skins/wordpress/wp-content.css index f23dfbdce1..f8e83dad47 100644 --- a/src/wp-includes/js/tinymce/skins/wordpress/wp-content.css +++ b/src/wp-includes/js/tinymce/skins/wordpress/wp-content.css @@ -203,6 +203,13 @@ img::selection { outline: 0; } +audio, +video, +embed { + display: -moz-inline-stack; + display: inline-block; + max-width: 100%; +} /** * WP Views