From 2388095150f57739e3ab3a37eb3a9522637029cc Mon Sep 17 00:00:00 2001
From: Dion Hulse <dd32@git.wordpress.org>
Date: Fri, 22 Nov 2013 04:02:37 +0000
Subject: [PATCH] Theme Installer: Fix the Theme Preview function, and bring
 the button handling/styling inline with the Customizer. Fixes #26129

git-svn-id: https://develop.svn.wordpress.org/trunk@26317 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-admin/css/wp-admin.css                 | 24 ++++++++++++++++++-
 .../class-wp-theme-install-list-table.php     |  3 ++-
 src/wp-admin/js/theme-install.js              |  4 ++++
 3 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/src/wp-admin/css/wp-admin.css b/src/wp-admin/css/wp-admin.css
index d80d37bfad..e3d530cbd8 100644
--- a/src/wp-admin/css/wp-admin.css
+++ b/src/wp-admin/css/wp-admin.css
@@ -7689,6 +7689,7 @@ body.full-overlay-active {
 	font-size: 16px;
 	line-height: 24px;
 	margin-bottom: 0;
+	margin-top: 0;
 }
 
 .install-theme-info .theme-screenshot {
@@ -7717,6 +7718,26 @@ body.full-overlay-active {
 	line-height: 20px;
 }
 
+#theme-installer .wp-full-overlay-header {
+	margin-top: 9px;
+}
+
+#theme-installer .wp-full-overlay-header .theme-install {
+	float: right;
+	/* For when .theme-install is a span rather than a.button-primary (already installed theme) */
+	line-height: 26px;
+}
+
+#theme-installer .wp-full-overlay-sidebar { 
+	background: #EEE;
+	border-right: 1px solid #DDD;
+}
+
+#theme-installer .wp-full-overlay-main {
+	background: #fff url('../images/spinner.gif') no-repeat fixed center center;
+	background-size: 20px 20px;
+}
+
 /*------------------------------------------------------------------------------
   25.0 - Misc
 ------------------------------------------------------------------------------*/
@@ -10720,7 +10741,8 @@ li#wp-admin-bar-toggle-button {
 	.spinner,
 	.imgedit-wait,
 	.customize-loading #customize-container,
-	.revision-tick.completed-false {
+	.revision-tick.completed-false,
+	#theme-installer .wp-full-overlay-main {
 		background-image: url('../images/spinner-2x.gif');
 	}
 
diff --git a/src/wp-admin/includes/class-wp-theme-install-list-table.php b/src/wp-admin/includes/class-wp-theme-install-list-table.php
index 356a3f9412..7bb8f18626 100644
--- a/src/wp-admin/includes/class-wp-theme-install-list-table.php
+++ b/src/wp-admin/includes/class-wp-theme-install-list-table.php
@@ -255,7 +255,8 @@ class WP_Theme_Install_List_Table extends WP_Themes_List_Table {
 		<div id="theme-installer" class="wp-full-overlay expanded">
 			<div class="wp-full-overlay-sidebar">
 				<div class="wp-full-overlay-header">
-					<a href="#" class="close-full-overlay"><?php _e( '&larr; Close' ); ?></a>
+					<a href="#" class="close-full-overlay button-secondary"><?php _e( 'Close' ); ?></a>
+					<span class="theme-install"></span>
 				</div>
 				<div class="wp-full-overlay-sidebar-content">
 					<div class="install-theme-info"></div>
diff --git a/src/wp-admin/js/theme-install.js b/src/wp-admin/js/theme-install.js
index ed7d775c1c..e2a46c97e0 100644
--- a/src/wp-admin/js/theme-install.js
+++ b/src/wp-admin/js/theme-install.js
@@ -60,6 +60,7 @@ jQuery( function($) {
 	}
 
 	var preview = $('#theme-installer'),
+		header  = preview.find('.wp-full-overlay-header'),
 		info    = preview.find('.install-theme-info'),
 		panel   = preview.find('.wp-full-overlay-main'),
 		body    = $( document.body );
@@ -81,6 +82,9 @@ jQuery( function($) {
 		var src;
 
 		info.html( $(this).closest('.installable-theme').find('.install-theme-info').html() );
+
+		header.find( '.theme-install' ).replaceWith( info.find( '.theme-install' ) );
+
 		src = info.find( '.theme-preview-url' ).val();
 		panel.html( '<iframe src="' + src + '" />');
 		preview.fadeIn( 200, function() {