From 88fd7b8652adf0c76fcdaad256eacfdf843d67ff Mon Sep 17 00:00:00 2001
From: Mel Choyce <melchoyce@git.wordpress.org>
Date: Mon, 15 May 2017 20:12:59 +0000
Subject: [PATCH] Plugins: Fix plugin name display on Chrome 58 and above.

On Chrome 58 and above, plugin names within the plugin details modal were collapsed down into an ellipsis. This fix rewrites the CSS to make sure the titles are always shown.

Props mrwweb, afercia, Presskopp.
Fixes #40579.


git-svn-id: https://develop.svn.wordpress.org/trunk@40672 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-admin/css/common.css | 26 ++++++++++----------------
 1 file changed, 10 insertions(+), 16 deletions(-)

diff --git a/src/wp-admin/css/common.css b/src/wp-admin/css/common.css
index c769898281..969e54595e 100644
--- a/src/wp-admin/css/common.css
+++ b/src/wp-admin/css/common.css
@@ -2535,25 +2535,18 @@ div.action-links {
 }
 
 #plugin-information-title {
-	padding: 0 20px;
+	padding: 0 26px;
 	background: #f5f5f5;
 	font-size: 22px;
 	font-weight: 600;
 	line-height: 56px;
 	position: relative;
-	top: 0;
-	right: 0;
-	left: 0;
 	height: 56px;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
 }
 
 #plugin-information-title.with-banner {
 	margin-right: 0;
 	height: 250px;
-	bottom: 250px;
 	-webkit-background-size: cover;
 	background-size: cover;
 }
@@ -2563,19 +2556,23 @@ div.action-links {
 	font-weight: 600;
 	padding: 0;
 	margin: 0;
-	max-width: 680px;
 	overflow: hidden;
 	text-overflow: ellipsis;
 	white-space: nowrap;
 }
 
 #plugin-information-title.with-banner h2 {
+	position: relative;
 	font-family: "Helvetica Neue", sans-serif;
 	display: inline-block;
 	font-size: 30px;
 	line-height: 50px;
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+	max-width: 100%;
 	padding: 0 15px;
-	margin: 174px 0 0 10px;
+	margin-top: 174px;
 	color: #fff;
 	background: rgba( 30, 30, 30, 0.9 );
 	text-shadow: 0 1px 3px rgba( 0, 0, 0, 0.4 );
@@ -2590,12 +2587,12 @@ div.action-links {
 }
 
 #plugin-information-title.with-banner div.vignette {
+	position: absolute;
 	display: block;
-	float: right;
 	top: 0;
+	left: 0;
 	height: 250px;
-	width: 772px;
-	margin: 0 -20px;
+	width: 100%;
 	background: transparent;
 	-webkit-box-shadow: inset 0 0 50px 4px rgba( 0, 0, 0, 0.2 ), inset 0 -1px 0 rgba( 0, 0, 0, 0.1 );
 	box-shadow: inset 0 0 50px 4px rgba( 0, 0, 0, 0.2 ), inset 0 -1px 0 rgba( 0, 0, 0, 0.1 );
@@ -2898,7 +2895,6 @@ div.action-links {
 @media screen and ( max-width: 771px ) {
 	#plugin-information-title.with-banner {
 		height: 100px;
-		bottom: 100px;
 	}
 
 	#plugin-information-title.with-banner h2 {
@@ -2910,8 +2906,6 @@ div.action-links {
 
 	#plugin-information-title.with-banner div.vignette {
 		height: 100px;
-		bottom: 100px;
-		width: 800%;
 	}
 
 	#plugin-information-tabs {