wpLink: bring back the Cancel link, improve responsive styles, see #26952

Built from https://develop.svn.wordpress.org/trunk@27510


git-svn-id: http://core.svn.wordpress.org/trunk@27353 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-includes/class-wp-editor.php

@@ -1091,6 +1091,9 @@ final class _WP_Editors {
 			<div id="wp-link-update">
 				<input type="submit" value="<?php esc_attr_e( 'Add Link' ); ?>" class="button-primary" id="wp-link-submit" name="wp-link-submit">
 			</div>
+			<div id="wp-link-cancel">
+				<a class="submitdelete deletion" href="#"><?php _e( 'Cancel' ); ?></a>
+			</div>
 		</div>
 		</form>
 		</div>

wp-includes/css/editor-rtl.css

@@ -1153,8 +1153,8 @@ i.mce-caret:before {
 	left: 0;
 }
 
-#wp-link-cancel { 
-	line-height: 25px; 
+#wp-link-cancel {
+	line-height: 25px;
 }
 
 #wp-link-update {
@@ -1167,39 +1167,61 @@ i.mce-caret:before {
 	margin-bottom: 0;
 }
 
-@media screen and ( max-width: 782px ), ( max-height: 520px ) {
+@media screen and ( max-width: 782px ) {
+	#wp-link-wrap {
+		height: 270px;
+		margin-top: -135px;
+	}
 
-	#wp-link-wrap,
-	#wp-link-wrap.search-panel-visible {
+	#wp-link-wrap.search-panel-visible .query-results {
+		top: 235px;
+	}
+}
+
+@media screen and ( max-width: 620px ) {
+	#wp-link-wrap {
 		width: auto;
-		height: auto;
-		margin: 0;
-		top: 10px;
+		margin-right: 0;
 		right: 10px;
 		left: 10px;
-		bottom: 10px;
 		max-width: 600px;
-		margin: auto;
+	}
+}
+
+@media screen and ( max-height: 520px ) {
+	#wp-link-wrap.search-panel-visible {
+		height: auto;
+		margin-top: 0;
+		top: 10px;
+		bottom: 10px;
+	}
+
+	.search-panel-visible #link-selector {
+		overflow: auto;
+	}
+
+	.search-panel-visible #search-panel .query-results {
+		position: static;
+	}
+}
+
+@media screen and ( max-height: 290px ) {
+	#wp-link-wrap {
+		height: auto;
+		margin-top: 0;
+		top: 10px;
+		bottom: 10px;
 	}
 
 	#link-selector {
 		overflow: auto;
-		height: calc(100% - 88px);
-		padding-bottom: 0;
-	}
-
-	#wp-link #search-panel {
-		display: block;
-	}
-
-	#wp-link-search-toggle {
-		display: none;
+		height: calc(100% - 92px);
+		padding-bottom: 10px;
 	}
 
 	#search-panel .query-results {
 		position: static;
 	}
-
 }
 
 /* Old TinyMCE 3.x modal */

wp-includes/css/editor.css

@@ -1153,8 +1153,8 @@ i.mce-caret:before {
 	right: 0;
 }
 
-#wp-link-cancel { 
-	line-height: 25px; 
+#wp-link-cancel {
+	line-height: 25px;
 }
 
 #wp-link-update {
@@ -1167,39 +1167,61 @@ i.mce-caret:before {
 	margin-bottom: 0;
 }
 
-@media screen and ( max-width: 782px ), ( max-height: 520px ) {
+@media screen and ( max-width: 782px ) {
+	#wp-link-wrap {
+		height: 270px;
+		margin-top: -135px;
+	}
 
-	#wp-link-wrap,
-	#wp-link-wrap.search-panel-visible {
+	#wp-link-wrap.search-panel-visible .query-results {
+		top: 235px;
+	}
+}
+
+@media screen and ( max-width: 620px ) {
+	#wp-link-wrap {
 		width: auto;
-		height: auto;
-		margin: 0;
-		top: 10px;
+		margin-left: 0;
 		left: 10px;
 		right: 10px;
-		bottom: 10px;
 		max-width: 600px;
-		margin: auto;
+	}
+}
+
+@media screen and ( max-height: 520px ) {
+	#wp-link-wrap.search-panel-visible {
+		height: auto;
+		margin-top: 0;
+		top: 10px;
+		bottom: 10px;
+	}
+
+	.search-panel-visible #link-selector {
+		overflow: auto;
+	}
+
+	.search-panel-visible #search-panel .query-results {
+		position: static;
+	}
+}
+
+@media screen and ( max-height: 290px ) {
+	#wp-link-wrap {
+		height: auto;
+		margin-top: 0;
+		top: 10px;
+		bottom: 10px;
 	}
 
 	#link-selector {
 		overflow: auto;
-		height: calc(100% - 88px);
-		padding-bottom: 0;
-	}
-
-	#wp-link #search-panel {
-		display: block;
-	}
-
-	#wp-link-search-toggle {
-		display: none;
+		height: calc(100% - 92px);
+		padding-bottom: 10px;
 	}
 
 	#search-panel .query-results {
 		position: static;
 	}
-
 }
 
 /* Old TinyMCE 3.x modal */

wp-includes/js/wplink.js

@@ -38,7 +38,7 @@ var wpLink;
 				event.preventDefault();
 				wpLink.update();
 			});
-			inputs.close.add( inputs.backdrop ).click( function( event ) {
+			inputs.close.add( inputs.backdrop ).add( '#wp-link-cancel a' ).click( function( event ) {
 				event.preventDefault();
 				wpLink.close();
 			});