From 8f581ae3dc0675b1c00ccfd801f53f26af5b10d0 Mon Sep 17 00:00:00 2001
From: Andrew Ozz <azaozz@git.wordpress.org>
Date: Mon, 9 Dec 2013 19:37:36 +0000
Subject: [PATCH] Themes: fix overlays and buttons in responsive mode, props
 matveb, fixes #26481.

git-svn-id: https://develop.svn.wordpress.org/trunk@26838 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-admin/css/wp-admin.css | 11 +++++++++++
 src/wp-admin/js/theme.js      | 15 ++++++++++++++-
 2 files changed, 25 insertions(+), 1 deletion(-)

diff --git a/src/wp-admin/css/wp-admin.css b/src/wp-admin/css/wp-admin.css
index 7d0c2962aa..e72f777088 100644
--- a/src/wp-admin/css/wp-admin.css
+++ b/src/wp-admin/css/wp-admin.css
@@ -7194,15 +7194,26 @@ body.folded .theme-overlay .theme-wrap {
 	.theme-browser .theme .theme-actions {
 		padding: 5px 10px 4px 10px;
 	}
+
 	.theme-overlay.small-screenshot .theme-screenshots {
 		position: static;
 		float: none;
 		max-width: 302px;
 	}
+
 	.theme-overlay.small-screenshot .theme-info {
 		margin-left: 0;
 		width: auto;
 	}
+
+	.theme:not(.active):hover .theme-actions,
+	.theme:hover .more-details {
+		display: none;
+	}
+
+	.theme-browser.rendered .theme:hover .theme-screenshot img {
+		opacity: 1.0;
+	}
 }
 
 @media only screen and (max-width: 480px) {
diff --git a/src/wp-admin/js/theme.js b/src/wp-admin/js/theme.js
index 9a525895a2..ac5e51d907 100644
--- a/src/wp-admin/js/theme.js
+++ b/src/wp-admin/js/theme.js
@@ -187,9 +187,13 @@ themes.view.Theme = wp.Backbone.View.extend({
 	html: themes.template( 'theme' ),
 
 	events: {
-		'click': 'expand'
+		'click': 'expand',
+		'touchend': 'expand',
+		'touchmove': 'preventExpand'
 	},
 
+	touchDrag: false,
+
 	render: function() {
 		var data = this.model.toJSON();
 		// Render themes using the html template
@@ -215,6 +219,11 @@ themes.view.Theme = wp.Backbone.View.extend({
 	expand: function( event ) {
 		var self = this;
 
+		// Bail if the user scrolled on a touch device
+		if ( this.touchDrag === true ) {
+			return this.touchDrag = false;
+		}
+
 		event = event || window.event;
 
 		// Prevent the modal from showing when the user clicks
@@ -224,6 +233,10 @@ themes.view.Theme = wp.Backbone.View.extend({
 		}
 
 		this.trigger( 'theme:expand', self.model.cid );
+	},
+
+	preventExpand: function() {
+		this.touchDrag = true;
 	}
 });