Make WordPress Core

Opened 11 years ago

Closed 9 years ago

#26584 closed defect (bug) (fixed)

Theme screenshot thumbnails rendered crisp in theme browser

Reported by: ericlewis's profile ericlewis Owned by: sergeybiryukov's profile SergeyBiryukov
Milestone: 4.2 Priority: normal
Severity: normal Version: 3.8
Component: Themes Keywords: good-first-bug has-patch
Focuses: ui Cc:


The anti-aliasing on these looks off, at least in Chrome 31.

The -webkit-transform property seems to be the culprit here in wp-admin.css...

.theme-browser .theme .theme-screenshot img {
	height: auto;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	-webkit-transform: translateZ( 0 ); /* Prevents rendering bugs in Chrome */
	-webkit-transition: opacity 0.2s ease-in-out;
	transition:         opacity 0.2s ease-in-out;

but given the comment there seems to be something else afoot.

Attachments (2)

Screen Shot 2013-12-12 at 4.38.39 PM.png (227.6 KB) - added by ericlewis 11 years ago.
26584.diff (464 bytes) - added by mzak 9 years ago.
Removed webkit-transform from line 155

Download all attachments as: .zip

Change History (11)

#1 @SergeyBiryukov
11 years ago

  • Version changed from trunk to 3.8

#2 @SergeyBiryukov
11 years ago

  • Keywords ui-focus added

#3 @Clorith
10 years ago

I think this is just relevant to the viewport, I was looking into the same today and see that at the "right" sizes the screenshots are nice and crisp, but if I move above/below them they look rather bad until I hit a new "right" size again.

Same behavior in IE11 and chrome 31 here.

#4 @obenland
9 years ago

  • Keywords dev-feedback added
  • Milestone changed from Awaiting Review to 4.2

Let's make a decision on this in 4.2. I pinged matveb and shaunandrews to get their feedback on it too.

It was first introduced in to fix a "flicker of the screenshot on hover", but I can't reproduce that without it.

Last edited 9 years ago by obenland (previous) (diff)

#5 @obenland
9 years ago

  • Keywords needs-patch good-first-bug added; dev-feedback removed

Shaun got back to me:

I don't recall the exact problem (since I was the one who added it over a year ago), but usually the flicker is more prevalent in slow/old hardware. However, since its seems to be just the opacity that's changing, it may not be needed.

Let's remove it then.

9 years ago

Removed webkit-transform from line 155

#6 @mzak
9 years ago

  • Keywords has-patch added; needs-patch removed

This ticket was mentioned in Slack in #core by mikehansenme. View the logs.

9 years ago

#8 @SergeyBiryukov
9 years ago

The "Prevents rendering bugs in Chrome" comment was initially introduced in [26142] and duplicated in [27174], apparently accidentally.

#9 @SergeyBiryukov
9 years ago

  • Owner set to SergeyBiryukov
  • Resolution set to fixed
  • Status changed from new to closed

In 31316:

Themes: Remove a Chrome workaround that causes theme screenshots to look too crisp and no longer appears to be relevant.

props mzak.
fixes #26584.

Note: See TracTickets for help on using tickets.