Ticket #4447 (closed bug: fixed)

Opened 11 months ago

Last modified 8 weeks ago

UI Icons are not even, causes misaligned buttons

Reported by: epascarello Owned by:
Priority: critical Milestone: 1.7.2
Component: CSS Framework Version: 1.7.1
Keywords: Cc:

Description (last modified by scottjehl) (diff)

Place an East and West arrow icon side by side. When you look at the arrow icons you will see they are all on a different y axis. Seems like they were rotated on a wrong central point.
.ui-icon-triangle-1-e
.ui-icon-triangle-1-w

You can see an example on the Grid mock-up: http://jquery-ui.googlecode.com/svn/branches/dev/grid/tests/static/grid/default.html

I attached a blown up version showing how off the arrows are when looking at ui-icons_222222_256x240.png.

As a temp fix, the CSS can be adjusted so the sprite is lined up correctly.

Attachments

arrowsBadlyLinedUp.PNG (16.0 kB) - added by epascarello 11 months ago.
fixed_icons_not_optipngd.zip (63.5 kB) - added by andreas 11 months ago.
fixed_icons_optipngd_o7.zip (21.8 kB) - added by andreas 11 months ago.

Change History

Changed 11 months ago by epascarello

  Changed 11 months ago by rdworth

  • component changed from ui.core to CSS Framework
  • milestone changed from TBD to 1.8

Changed 11 months ago by andreas

Changed 11 months ago by andreas

follow-up: ↓ 3   Changed 11 months ago by epascarello

The changes andreas made to the buttons appears to fix the alignment issue with the east/west arrows.

When checking this, I noticed that the North and South arrows .ui-icon-triangle-1-n .ui-icon-triangle-1-s and not centered in the x direction. It appears that the width can not be divided evenly in the icon width.

in reply to: ↑ 2   Changed 11 months ago by andreas

Replying to epascarello:

The changes andreas made to the buttons appears to fix the alignment issue with the east/west arrows. When checking this, I noticed that the North and South arrows .ui-icon-triangle-1-n .ui-icon-triangle-1-s and not centered in the x direction. It appears that the width can not be divided evenly in the icon width.

The east/west aren't vertical aligned either because of icon height.

  Changed 10 months ago by scottjehl

  • status changed from new to closed
  • resolution set to fixed
  • description modified (diff)

fixed in revs 1001,1002,1003 in website svn

  Changed 9 months ago by rdworth

  • milestone changed from 1.8 to 1.7.2
Note: See TracTickets for help on using tickets.