Make WordPress Core

Opened 10 years ago

Closed 10 years ago

Last modified 10 years ago

#26481 closed defect (bug) (fixed)

RC1 themes.php Buttons Randomly Appear/Disappear on iPad

Reported by: miqrogroove's profile miqrogroove Owned by: nacin's profile nacin
Milestone: 3.8 Priority: low
Severity: normal Version: 3.8
Component: Customize Keywords: has-patch commit
Focuses: ui Cc:

Description

I thought it was just me at first, but the more time I spend using the new Themes screen on my iPad, the less sense it makes.

There are buttons captioned "Activate" and "Live Preview" that seem to appear and disappear at random as I scroll through the themes list.

The only time these buttons are reliably visible is when I've got my finger directly over one of the screenshots and drag it. When I release my finger, sometimes the buttons are still visible, sometimes not.

Attachments (7)

IMG_0739_2013_12_08_01h06m49s.PNG (2.1 MB) - added by miqrogroove 10 years ago.
iPad Screen Shot
26481.diff (1.3 KB) - added by matveb 10 years ago.
26481.2.diff (1.6 KB) - added by azaozz 10 years ago.
26481.3.diff (1.9 KB) - added by azaozz 10 years ago.
26481.4.diff (1.8 KB) - added by azaozz 10 years ago.
26481.5.diff (1.9 KB) - added by azaozz 10 years ago.
26481.6.diff (1.4 KB) - added by matveb 10 years ago.

Change History (31)

@miqrogroove
10 years ago

iPad Screen Shot

#1 @miqrogroove
10 years ago

Compare behavior to desktop browsers: There are some hover states that cause the buttons to appear only when the mouse pointer is over the screenshot. This does not work on iPads. The buttons should be always visible, and the "Theme Details" button should be always hidden.

#2 @SergeyBiryukov
10 years ago

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

#3 @nacin
10 years ago

  • Priority changed from normal to highest omg bbq

The problem with always showing the buttons is the theme name will often be cut off.

This requires one tap to show the buttons, and a second tap to open the details screen.

#4 @nacin
10 years ago

  • Priority changed from highest omg bbq to low

Check that. When you click a theme, you don't need to see the buttons from that screen. You can be taken straight to the details, which contains those buttons.

It would be nice to avoid the flickering of the buttons and the "Theme Details" text when doing a scroll-drag, but that's fairly mundane.

#5 follow-up: @miqrogroove
10 years ago

Well, it's fairly confusing. And, this may be a separate bug, but why do all those buttons have different names? What's the difference between Live Preview and Customize? Why do I need a Widgets button when I'm looking at a theme that isn't active? How is that different from the Widgets button on the active theme? o_O

#6 in reply to: ↑ 5 @nacin
10 years ago

Replying to miqrogroove:

Well, it's fairly confusing. And, this may be a separate bug, but why do all those buttons have different names? What's the difference between Live Preview and Customize? Why do I need a Widgets button when I'm looking at a theme that isn't active? How is that different from the Widgets button on the active theme? o_O

Customize = current theme. Live Preview = inactive theme.

The fact that the buttons aren't different for active/inactive is a bug. Incoming.

#7 @nacin
10 years ago

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

In 26815:

Don't set the theme overlay active state in the Theme view, as it overwrites the same work in the Details view.

fixes #26481.

@matveb
10 years ago

#8 @matveb
10 years ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

Patch above makes touchevents more responsive and hides :hover elements on smaller viewports.

#9 @nacin
10 years ago

  • Keywords has-patch commit added

#10 @azaozz
10 years ago

The only thing I see after applying 26481.diff is that the opacity transition triggers after dragging. Perhaps remove it for responsive mode?

#11 @matveb
10 years ago

I left it as a hint that you "touched" a theme. But it'll probably be more confusing. Let's remove it.

@azaozz
10 years ago

#12 @azaozz
10 years ago

26481.2.diff seems to do it.

#13 follow-up: @matveb
10 years ago

Just this:

.theme-browser.rendered .theme:hover .theme-screenshot img {
	opacity: 1;
}

... should be fine.

@azaozz
10 years ago

#14 in reply to: ↑ 13 @azaozz
10 years ago

Replying to matveb:

Yeah, but we still tell the browser to do a transition which takes processing power, drains the battery, etc. :)

26481.3.diff works here on iPad and Android, maybe a quick look on Win8?

Last edited 10 years ago by azaozz (previous) (diff)

#15 @nacin
10 years ago

If the properties don't change, are browsers smart enough to avoid doing anything?

#16 @azaozz
10 years ago

Hope so... But who knows.

Another thing: the Customize button disappears after touch on or dragging by the active theme and is not "clickable".

Last edited 10 years ago by azaozz (previous) (diff)

@azaozz
10 years ago

#17 @azaozz
10 years ago

26481.4.diff also hides the Customize button on the active theme.

@azaozz
10 years ago

@matveb
10 years ago

#18 @matveb
10 years ago

Above seems enough for me, and fixes customize button, but don't have conclusive evidence of browsers not running any transition whatsoever :)

#19 @azaozz
10 years ago

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

In 26838:

Themes: fix overlays and buttons in responsive mode, props matveb, fixes #26481.

#20 @miqrogroove
10 years ago

Testing RC2 now and still seeing this bug. Might need to reopen this.

#21 @miqrogroove
10 years ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

I've gone as far as confirming that 26838 is in my RC2 files, and even dumped the browser cache on my iPad.

When I scroll up and down on the Themes pages, I still get things randomly appearing and disappearing all over the page, sometimes in multiple places.

#22 @nacin
10 years ago

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

Let's do a new ticket for this.

#24 @lancewillett
10 years ago

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