Make WordPress Core

Opened 11 years ago

Closed 11 years ago

#22166 closed defect (bug) (fixed)

jQuery UI autocomplete needs tweaking (again)

Reported by: helenyhou's profile helenyhou Owned by: ryan's profile ryan
Milestone: 3.5 Priority: normal
Severity: normal Version: 3.5
Component: UI Keywords: has-patch
Focuses: Cc:

Description

Seems that the update to 1.9 has some side effects. The .ui-state-hover background change isn't working (haven't investigated why, might just be a matter of naming), and there is now some helpful text that appears beside the input.

http://f.cl.ly/items/1i0I1l1X38131g1u3m1Y/Screen%20Shot%202012-10-11%20at%2011.16.48%20AM.png

It looks okay, until the screen is narrower.

http://f.cl.ly/items/2F2z152a202D3u0W1D0J/Screen%20Shot%202012-10-11%20at%2011.18.38%20AM.png

Should probably figure out what to do with that, either styling or removing/hiding.

Attachments (1)

22166.diff (1.6 KB) - added by helenyhou 11 years ago.

Download all attachments as: .zip

Change History (8)

#1 @helenyhou
11 years ago

Styling history from last release: #20584

#2 @nacin
11 years ago

Per one of the jQuery UI developers, this is supposed to be hidden text. We need to update our style to match new structural CSS in the jQuery UI 1.9.0. This span has the class of ui-helper-hidden-accessible.

As also need to pass a messages option that is internationalized to the widget, see https://github.com/jquery/jquery-ui/commit/f4b2d7a4115814b64ff291e3518fe15f2dfbe390#L4R532. I'm working on JS-based plural forms for something koopersmith needs, so we can use that here.

@helenyhou
11 years ago

#3 @helenyhou
11 years ago

  • Keywords has-patch added; needs-patch removed

22166.diff adds .ui-helper-hidden-accessible to the same style block as .screen-reader-text, fixes the selector for the focus state, and changes the border color to match that of the new input focus styles. It looks a little weird in blue, but blue having gray border colors for inputs is a separate issue.

#4 @nacin
11 years ago

This .ui-helper-hidden-accessible class is already in wp-includes/css/jquery-ui-dialog.css. Assuming that we should *not* be including that CSS file here, then this change looks good.

#5 @helenyhou
11 years ago

Nope, no need for that file here. Reminds me of #18909 though.

#6 @sabreuse
11 years ago

Patch works for me.

#7 @ryan
11 years ago

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

In [22285]:

Update autocomplete CSS to make nice with jQuery UI 1.9. Give ui-helper-hidden-accessible the same treatment as screen-reader-text. Props helenyhou. fixes #22166

Note: See TracTickets for help on using tickets.