search

WordPress / dashicons

Dashicons, the WordPress admin icon font. For the official resource, please see the WordPress Developer Hub.
https://developer.wordpress.org/resource/dashicons/
GNU General Public License v3.0
564 stars 185 forks source link

Eyes are not the same (f177 & f530) #392

Closed JJJ closed 4 years ago

JJJ commented 5 years ago

There are two Dashicons that include eyes in them, one open and one with a line through it. These eyes are not the same size, in the same position, or using the same stroke.

Toggling between the two icons makes for an inconsistent appearance.

Below is the New Password UI in WordPress Core. One eye is used for the Password field type, another for the Plaintext field type. Clicking Show/Hide toggles it. A painters eye will identify the difference right away, but I've also overlapped them with 50% opacity so the difference is more obvious:

eyes

field2 commented 5 years ago

This needs to be unzipped, and the folder contents added to /sources/svg Then run grunt and do a PR

Then agree to come to the next WordCamp Buffalo once it's announced

Archive.zip

davewhitley commented 5 years ago

Gridicons has similar icons, and I don't think they have this same issue. The 2 eye icons are the same, except for the diagonal line. Just providing in case it's helpful http://automattic.github.io/gridicons/

Screen Shot 2019-11-15 at 1 43 15 PM Screen Shot 2019-11-15 at 1 43 11 PM

JJJ commented 5 years ago

May need to reopen this. I think something is wrong.

These two icons ended up pretty mangled in the font. They look OK in the sprite SVG though.

Screen Shot 2019-11-15 at 2 19 51 PM Screen Shot 2019-11-15 at 2 22 02 PM
JJJ commented 4 years ago

I've tried again to recompile these assets, and they still look like above. cc @field2 for a consult?

field2 commented 4 years ago

Yeah, it looks like the code that Illustrator pushed out was in an incompatible format. I'm remaking the svg files and comparing them to the prior versions.

field2 commented 4 years ago

Archive.zip Can you try again with the attached svgs? I ran a build on my local system with these and it fixed the issue in the font: image

Zodiac1978 commented 4 years ago

Is this already fixed and can be closed @field2 ?

field2 commented 4 years ago

I just installed the dashicons.ttf by downloading it from the master branch, and it looks like it is still messed up. @jasmussen , can you take a look at this? image

field2 commented 4 years ago

(Les yeux sans visage) The Eyes Are Not the Same -Billy Idol [sorry couldn't help myself]

field2 commented 4 years ago

It looks like this issue is affecting many of the new icons I just added. I think it's something wrong with grunt-webfont, see this issue: https://github.com/sapegin/grunt-webfont/issues/390

jasmussen commented 4 years ago

I created a fix in #409.

As you can see from the GIF there, the vectors for the two eye-icons are perfectly placed on top of each other, so if there is mis-alignment, it must be from CSS.

JJJ commented 4 years ago

Thanks @jasmussen 🙏