WordPress.org

Make WordPress Core

Opened 6 years ago

Closed 6 years ago

Last modified 6 years ago

#26172 closed defect (bug) (fixed)

Theme screenshots get blurry at various breakpoints

Reported by: shaunandrews Owned by: iammattthomas
Milestone: 3.8 Priority: high
Severity: normal Version:
Component: Customize Keywords: needs-patch
Focuses: ui Cc:

Description

With the new installed theme page, screenshots can get a little too large and look fuzzy, especially on retina displays. At larger screen sizes, the grid should adapt to add more columns and force a max-width on the detail view screenshot. Each breakpoint should also ensure that it doesn't let screenshots in the grid get "too large."

Attachments (3)

26172.diff (1.4 KB) - added by shaunandrews 6 years ago.
26172.2.diff (1.3 KB) - added by shaunandrews 6 years ago.
26172.3.diff (313 bytes) - added by matveb 6 years ago.

Download all attachments as: .zip

Change History (15)

@shaunandrews
6 years ago

#1 @shaunandrews
6 years ago

26172.diff updates a few media queries and adds a few new ones to ensure that screenshots never get larger than 450px wide.

#2 @SergeyBiryukov
6 years ago

  • Component changed from Themes to Administration
  • Keywords ui-focus added
  • Milestone changed from Awaiting Review to 3.8

#3 @SergeyBiryukov
6 years ago

  • Component changed from Administration to Themes

#4 @shaunandrews
6 years ago

  • Keywords has-patch added

#5 follow-up: @iammattthomas
6 years ago

  • Keywords needs-patch added; has-patch removed

I'm afraid 26172.diff doesn't apply cleanly now that theme.css has been merged into wp-admin.css. Since this also makes some changes to media query breakpoints and I'm not exactly sure what the finished product is supposed to look like, I think it'd be best to make a new patch rather than me try to merge bits by hand.

#6 @nacin
6 years ago

  • Priority changed from normal to high

#7 in reply to: ↑ 5 @shaunandrews
6 years ago

Replying to iammattthomas:

I'm afraid 26172.diff doesn't apply cleanly now that theme.css has been merged into wp-admin.css. Since this also makes some changes to media query breakpoints and I'm not exactly sure what the finished product is supposed to look like, I think it'd be best to make a new patch rather than me try to merge bits by hand.

Ugh. Ok. Working on refreshing the patch now.

@shaunandrews
6 years ago

#8 @shaunandrews
6 years ago

26172.2.diff​ refreshes the previous diff to work with the now merged theme styles in wp-admin.css.

#9 @iammattthomas
6 years ago

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

In 26633:

Add more columns in the theme browser on screens over 2000px wide to ensure that theme screenshots never appear larger than their resolution allows. Fixes #26172, props shaunandrews.

#10 @matveb
6 years ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

We are missing the max-width check for the detailed view. Let's set that 880px which gives us a nice round height number at 4:3 — 660px.

@matveb
6 years ago

#11 @nacin
6 years ago

  • Resolution set to fixed
  • Status changed from reopened to closed

In 26730:

Themes: Set a max-width on screenshots so they don't get blurry at very wide screen widths.

props matveb.
fixes #26172.

#12 @lancewillett
6 years ago

  • Component changed from Themes to Appearance
Note: See TracTickets for help on using tickets.