From e47bc77616c4dad7eae79e59916fba0aba4544ab Mon Sep 17 00:00:00 2001
From: Scott Taylor <scott.c.taylor@mac.com>
Date: Fri, 14 Mar 2014 12:34:16 +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.


Built from https://develop.svn.wordpress.org/trunk@27534


git-svn-id: http://core.svn.wordpress.org/trunk@27377 1a063a9b-81f0-0310-95a4-ce76da25c4cd
---
 wp-includes/class-wp-editor.php                       | 11 +++++++++--
 wp-includes/js/mediaelement/wp-mediaelement.css       |  2 +-
 wp-includes/js/tinymce/skins/wordpress/wp-content.css |  7 +++++++
 3 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/wp-includes/class-wp-editor.php b/wp-includes/class-wp-editor.php
index 1ad8900862..ee1c14e69a 100644
--- a/wp-includes/class-wp-editor.php
+++ b/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/wp-includes/js/mediaelement/wp-mediaelement.css b/wp-includes/js/mediaelement/wp-mediaelement.css
index 4abfef8697..b4ae4da99b 100644
--- a/wp-includes/js/mediaelement/wp-mediaelement.css
+++ b/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/wp-includes/js/tinymce/skins/wordpress/wp-content.css b/wp-includes/js/tinymce/skins/wordpress/wp-content.css
index f23dfbdce1..f8e83dad47 100644
--- a/wp-includes/js/tinymce/skins/wordpress/wp-content.css
+++ b/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