From ee694739ec99a0569c8c59742b885ad157f44de4 Mon Sep 17 00:00:00 2001
From: Daryl Koopersmith <koop@git.wordpress.org>
Date: Thu, 15 Nov 2012 23:53:06 +0000
Subject: [PATCH] Media: Update in-grid captions.

* Use input fields instead of textboxes (which provide better handling for smaller attachments).
* Provide `data-setting` properties to properly sync the changes.

see #21390.


git-svn-id: https://develop.svn.wordpress.org/trunk@22603 602fd350-edb4-49c9-b593-d223f7449a82
---
 wp-includes/css/media-views.css |  1 -
 wp-includes/media.php           | 10 ++++------
 2 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/wp-includes/css/media-views.css b/wp-includes/css/media-views.css
index c087c2f0e4..c7e151a5a6 100644
--- a/wp-includes/css/media-views.css
+++ b/wp-includes/css/media-views.css
@@ -603,7 +603,6 @@
 	position: relative;
 	display: block;
 	width: 100%;
-	height: 50px;
 	margin: -1px 0 0;
 	padding: 8px;
 	font-size: 12px;
diff --git a/wp-includes/media.php b/wp-includes/media.php
index 4eed29dec4..87e20fdc7c 100644
--- a/wp-includes/media.php
+++ b/wp-includes/media.php
@@ -1447,19 +1447,17 @@ function wp_print_media_templates( $attachment ) {
 		</div>
 		<# if ( data.describe ) { #>
 			<# if ( 'image' === data.type ) { #>
-				<textarea class="describe"
-					placeholder="<?php esc_attr_e('Describe this image&hellip;'); ?>"
-					>{{ data.caption }}</textarea>
+				<input type="text" value="{{ data.caption }}" class="describe" data-setting="caption"
+					placeholder="<?php esc_attr_e('Describe this image&hellip;'); ?>" />
 			<# } else { #>
-				<textarea class="describe"
+				<input type="text" value="{{ data.title }}" class="describe" data-setting="title"
 					<# if ( 'video' === data.type ) { #>
 						placeholder="<?php esc_attr_e('Describe this video&hellip;'); ?>"
 					<# } else if ( 'audio' === data.type ) { #>
 						placeholder="<?php esc_attr_e('Describe this audio file&hellip;'); ?>"
 					<# } else { #>
 						placeholder="<?php esc_attr_e('Describe this media file&hellip;'); ?>"
-					<# } #>
-					>{{ data.title }}</textarea>
+					<# } #> />
 			<# } #>
 		<# } #>
 	</script>