From 1e4238d6a85f81ce234d1bb6fd0890432a8f88b7 Mon Sep 17 00:00:00 2001
From: Lance Willett <lancewillett@git.wordpress.org>
Date: Fri, 20 Mar 2015 16:34:15 +0000
Subject: [PATCH] Bundled themes: update editor styles to better display images
 and captions in small screens.

Props jacklenox, see #31250.

git-svn-id: https://develop.svn.wordpress.org/trunk@31849 602fd350-edb4-49c9-b593-d223f7449a82
---
 .../themes/twentyfifteen/css/editor-style.css    | 16 ++++++++++++++++
 .../themes/twentyfourteen/css/editor-style.css   | 16 ++++++++++++++++
 .../themes/twentythirteen/css/editor-style.css   | 16 ++++++++++++++++
 3 files changed, 48 insertions(+)

diff --git a/src/wp-content/themes/twentyfifteen/css/editor-style.css b/src/wp-content/themes/twentyfifteen/css/editor-style.css
index c9ea518d35..28ba7b3696 100644
--- a/src/wp-content/themes/twentyfifteen/css/editor-style.css
+++ b/src/wp-content/themes/twentyfifteen/css/editor-style.css
@@ -15,6 +15,7 @@ Description: Used to style the TinyMCE editor.
  * 6.0 - Galleries
  * 7.0 - Audio / Video
  * 8.0 - RTL
+ * 9.0 - Media Queries
  */
 
 
@@ -479,3 +480,18 @@ body.rtl {
 .rtl table caption {
 	text-align: right;
 }
+
+
+/**
+ * 9.0 Media Queries
+ */
+
+@media screen and (max-width: 660px) {
+	body, img, .wp-caption {
+		max-width: 100%;
+	}
+
+	img, .wp-caption {
+		width: auto !important;
+	}
+}
diff --git a/src/wp-content/themes/twentyfourteen/css/editor-style.css b/src/wp-content/themes/twentyfourteen/css/editor-style.css
index 010f35809e..d8706f701f 100644
--- a/src/wp-content/themes/twentyfourteen/css/editor-style.css
+++ b/src/wp-content/themes/twentyfourteen/css/editor-style.css
@@ -17,6 +17,7 @@ Description: Used to style the TinyMCE editor.
  * 8.0 - Galleries
  * 9.0 - Audio/Video
  * 10.0 - RTL
+ * 11.0 - Media Queries
  * ----------------------------------------------------------------------------
  */
 
@@ -719,3 +720,18 @@ html .mceContentBody.rtl {
 .rtl td {
 	text-align: right;
 }
+
+
+/**
+ * 11.0 Media Queries
+ */
+
+@media screen and (max-width: 474px) {
+	body, img, .wp-caption {
+		max-width: 100%;
+	}
+
+	img, .wp-caption {
+		width: auto !important;
+	}
+}
diff --git a/src/wp-content/themes/twentythirteen/css/editor-style.css b/src/wp-content/themes/twentythirteen/css/editor-style.css
index 568418992b..2e6218449e 100644
--- a/src/wp-content/themes/twentythirteen/css/editor-style.css
+++ b/src/wp-content/themes/twentythirteen/css/editor-style.css
@@ -18,6 +18,7 @@ Description: Used to style the TinyMCE editor.
  * 9.0 - Audio/Video
  * 10.0 - Post Formats
  * 11.0 - RTL
+ * 12.0 - Media Queries
  * ----------------------------------------------------------------------------
  */
 
@@ -769,3 +770,18 @@ html .mceContentBody.rtl {
 	background: none;
 	content: none;
 }
+
+
+/**
+ * 12.0 Media Queries
+ */
+
+@media screen and (max-width: 604px) {
+	body, img, .wp-caption {
+		max-width: 100%;
+	}
+
+	img, .wp-caption {
+		width: auto !important;
+	}
+}