Opened 14 years ago
Closed 10 years ago
#4447 closed bug (wontfix)
UI Icons are not even, causes misaligned buttons
Reported by: | epascarello | Owned by: | |
---|---|---|---|
Priority: | major | Milestone: | none |
Component: | ui.css-framework | Version: | 1.7.1 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description (last modified by )
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 (3)
Change History (22)
Changed 14 years ago by
Attachment: | arrowsBadlyLinedUp.PNG added |
---|
comment:1 Changed 14 years ago by
Component: | ui.core → CSS Framework |
---|---|
Milestone: | TBD → 1.8 |
Changed 14 years ago by
Attachment: | fixed_icons_not_optipngd.zip added |
---|
Changed 14 years ago by
Attachment: | fixed_icons_optipngd_o7.zip added |
---|
comment:2 follow-up: 3 Changed 14 years ago by
comment:3 Changed 14 years ago by
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.
comment:4 Changed 14 years ago by
Description: | modified (diff) |
---|---|
Resolution: | → fixed |
Status: | new → closed |
fixed in revs 1001,1002,1003 in website svn
comment:5 Changed 14 years ago by
Milestone: | 1.8 → 1.7.2 |
---|
comment:6 Changed 13 years ago by
Resolution: | fixed |
---|---|
Status: | closed → reopened |
I still see in 1.8.2 that the North and South arrows are not horizontally aligned
comment:7 Changed 13 years ago by
Milestone: | 1.7.2 → 1.9 |
---|
comment:8 follow-up: 9 Changed 13 years ago by
Priority: | critical → major |
---|
comment:9 follow-up: 10 Changed 13 years ago by
Replying to scott.gonzalez: This issue is noticed in ui-icon-bullet as well. Maybe all icons should be eval'd to see which ones have an odd px width of their inner graphic. Can we help in any way? I might be able to check all of them if you want.
comment:10 follow-up: 11 Changed 13 years ago by
Replying to banzor: Unfortunately the source for the sprite is in a private repo for ThemeRoller. We're hoping to open it up after the rewrite. I think this may have actually been addressed already, but we haven't moved to the new icon sprite yet.
comment:11 Changed 12 years ago by
Replying to scott.gonzalez: Any progress on this? I am running into the ui-icon-bullet issue now when working on Menu since it doesn't align with ui-icon-radio-off to use it as the checked radio button.
comment:12 Changed 12 years ago by
Still noticed this problem in 1.8.16 for ui-icon-triangle-1-s... it's currently listed as: .ui-icon-triangle-1-s { background-position: -64px -16px; } and should be .ui-icon-triangle-1-s { background-position: -65px -16px; }
Going to override it, but would be nice if it was correct in the style sheet.
comment:13 Changed 12 years ago by
The position values in the css are correct as the sprite image is made up of 16px by 16px cells. It's the image date itself that needs adjusting. As you found, this override is a reasonable workaround in the meantime.
comment:14 Changed 12 years ago by
Downloaded the latest github jquery-ui and checked the images. This issue has been fixed if these icon images are the only source files for theme rolling.
comment:15 Changed 11 years ago by
It seems even in latest github that the N/S images aren't going to align properly. Either N needs to move one pixel to the Right or S needs to move one pixel to the Left OR new images will need to be created that take the same amount of pixels on either side.
comment:16 Changed 11 years ago by
Milestone: | 1.9.0 → 1.10.0 |
---|
comment:17 Changed 11 years ago by
Status: | reopened → open |
---|
comment:18 Changed 11 years ago by
Milestone: | 1.10.0 → none |
---|
comment:19 Changed 10 years ago by
Resolution: | → wontfix |
---|---|
Status: | open → closed |
At this point, I think this is a won't fix. We'll just need to make sure the new CSS framework doesn't have these issues.
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.