Fix positioning of attachment thumbnail overlays.

Prevents the overlay from blocking buttons inside the attachment preview, such as the remove button in the gallery editor.

see #21390.


git-svn-id: http://core.svn.wordpress.org/trunk@22343 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Daryl Koopersmith 2012-10-31 20:34:50 +00:00
parent 9b1ac05bc0
commit c419700f93
2 changed files with 18 additions and 11 deletions

View File

@ -273,21 +273,13 @@
margin: 0 auto;
}
.attachment .thumbnail {
-webkit-transform: translate( 50%, 50% );
-moz-transform: translate( 50%, 50% );
-ms-transform: translate( 50%, 50% );
-o-transform: translate( 50%, 50% );
transform: translate( 50%, 50% );
}
/* Vertically center the icons. */
.attachment .icon {
top: 50%;
left: 50%;
}
.attachment-preview:after {
.attachment-preview .thumbnail:after {
content: '';
display: block;
position: absolute;
@ -304,8 +296,21 @@
left: 0;
}
.attachment .thumbnail .centered {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-webkit-transform: translate( 50%, 50% );
-moz-transform: translate( 50%, 50% );
-ms-transform: translate( 50%, 50% );
-o-transform: translate( 50%, 50% );
transform: translate( 50%, 50% );
}
.attachment .icon,
.attachment .thumbnail img {
.attachment .thumbnail .centered img {
-webkit-transform: translate( -50%, -50% );
-moz-transform: translate( -50%, -50% );
-ms-transform: translate( -50%, -50% );

View File

@ -1327,7 +1327,9 @@ function wp_print_media_templates( $attachment ) {
<div class="media-progress-bar"><div></div></div>
<% } else if ( 'image' === type ) { %>
<div class="thumbnail">
<img src="<%- url %>" draggable="false" />
<div class="centered">
<img src="<%- url %>" draggable="false" />
</div>
</div>
<% } else { %>
<img src="<%- icon %>" class="icon" draggable="false" />