Ticket #19119 (closed defect (bug): fixed)

Opened 7 months ago

Last modified 6 months ago

Admin menu flyouts are one pixel off when collapsed

Reported by: olleicua Owned by: koopersmith
Priority: normal Milestone: 3.3
Component: UI Version: 3.3
Severity: normal Keywords: has-patch
Cc: olleicua@…

Description

In Revision #19118 admin menu flyouts are 1 pixel too low when the menu is collapsed. See attachment. This is consistent in Firefox, Safari, and Chrome.

Attachments

collapsedFlyoutBug.png Download (53.4 KB) - added by olleicua 7 months ago.
19119.fix.patch Download (482 bytes) - added by olleicua 7 months ago.
19119.2.patch Download (368 bytes) - added by SergeyBiryukov 7 months ago.
19119.3.patch Download (497 bytes) - added by trepmal 7 months ago.
fixes offset on current menu item and menu item below it
19119.diff Download (356 bytes) - added by helenyhou 7 months ago.
wp-admin.dev.css.diff Download (748 bytes) - added by trepmal 6 months ago.
should fix both issues I just mentioned
bug.png Download (29.1 KB) - added by olleicua 6 months ago.

Change History

  • Summary changed from admin menu flyouts to Admin menu flyouts are one pixel off when collapsed
  • Milestone changed from Awaiting Review to 3.3
  • Keywords has-patch needs-testing added

Fixed, looks much better. Doesn't break non-collapsed view.

Probably would be better to decrease margin-top (19119.2.patch Download).

fixes offset on current menu item and menu item below it

2 ruins the current sub-menu. 3 looks perfect.

19119.diff is the middle ground between SergeyBiryukov and trepmal's patches.

comment:6 follow-up: ↓ 7   trepmal7 months ago

That causes a pixel offset on the flyout below the current item

http://cl.ly/Bap2/offset.png

comment:7 in reply to: ↑ 6   helenyhou7 months ago

Replying to trepmal:

Ah true. Missed that case.

I'm pretty sure 19119.3.patch is correct.

Fixed in [19277]?

Not quite, pixel offset on current item's flyout and flyout of item directly below the current item (see screenshot above) still present in r19277 (and r19278)

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

In [19279]:

Fix folded flyout overlaps for current items. props trepmal. fixes #19119.

  • Status changed from closed to reopened
  • Resolution fixed deleted

Seems my selector was a bit too specific - if the current item doesn't have a submenu, the pixel offset still happens with the flyout below.

Also, hoverstate on the current item with no submenu isn't right. Following the unfolded style, it shouldn't change on hover .

Probably not necessary, but here's a short (8s) screencast that shows both quirks  http://screencast.com/t/VeGYxhwyPk2

should fix both issues I just mentioned

Was [19119/wp-admin.dev.css.diff] intended to be applied on top of your other patch because if not then it doesn't seem to be fixing the problem for me:

Hmm.... Just double-checked the patch and it worked for me.

To be sure, I deleted my wp-admin(.dev).css files, svn up'd and applied the patch.

For some reason I am seeing this bug in FF7 in all four of the following circumstances:

• right after svn up'ing, no patches

• right after svn up'ing and applying just patch 3

• right after svn up'ing and applying just wp-admin.dev.css.diff

• right after svn up'ing and applying patch 3 then wp-admin.dev.css.diff

not sure what's going on here..

Figured it out. I had reduced the font size in my browser. When I restored it to the normal size everything worked as expected. Not sure how many people actually change their font size in FF frequently while trying to use the WP admin but it seems to severely break the admin bar in other ways too. Anyway not the point of this ticket so pretend I said nothing.

trepmal, is it still an issue?

Partially fixed, the pixel offset seems to be fixed. But the hoverstate problem is still there

Also, hoverstate on the current item with no submenu isn't right. Following the unfolded style, it shouldn't change on hover .

If comments (a menu item without submenu items) is the current item, the arrow is visible but disappears on mouseover.

If needed, I can create a new ticket for this since it's not part of the original issue reported here.

  • Keywords needs-testing removed
  • Status changed from reopened to closed
  • Resolution set to fixed

trepmal, that is correct behavior.

We had a long discussion on this in IRC, see  https://irclogs.wordpress.org/chanlog.php?channel=wordpress-dev&day=2011-11-08&sort=asc#m329457

Okay, it just doesn't give the impression of being intentional to me. Especially since in the unfolded menu there is no change on mouseover.

comment:18 addressed in [19433]

Note: See TracTickets for help on using tickets.