Use sprite for icons

In this situation, I think we'll need to use a horizontal sprite rather than a vertical one. Either that or give it more vertical space. This patch would have a problem with large font sizes.

What is the progress on this? It would be great to see it implemented.

The patch looks great, I'm just a bit busy and this is a minor issue. I'll commit it next time I'm working on Extlink.

Arg, bummer. In my testing this breaks the description text on admin/settings/extlink. We've tried to fix this in a dozen ways to no real avail. See #403786: Show themed icons on settings page.

Now that issue is closed, has this been committed?

It's not closed, it's "needs work". No it hasn't been committed since it breaks the display on admin/settings/extlink.

Tested and works.

Good work jcisio!!

I will leave the status changes to quicksketch

@quicksketch - Does this fix the issue?

I'm not sure these changes are going to work across browsers as-is. I know the "inline-block" CSS is not supported by IE6 (not sure about IE7). Do you think anyone would really care if we just kept all 3 images? That way we could use the sprite image on the front-end and the individual images on the back-end and not worry about this problem at all.

The main reason for the change is performance, if the individual images are used in the backend, it doesn't matter as people don't care about that for normal users.

Good idea, let's just make sure that the images are losslessly compressed as much as possible (I'm marking #1098186: extlink.png can be losslessly compressed as duplicate)

Has this been implemented yet?

Would you mind re-rolling that patch git-style? Thanks.

Here's a D6 patch. Just rerolled as requested in August.

Here's a D7 version too. I've added invisible text in so that it is as accessible as it can be. Sprites vs alt text is still an ongoing debate.

It works fine in Firefox, but not in Chrome for some reason.

Bumping too see its inclusion.

Patch to be re-rolled.

• Administration interface to use normal images
• Everything else will use the sprite
• Alt text will be added using "title" attribute

See reference: http://www.w3schools.com/tags/att_global_title.asp

Thanks @elachlan. Hopefully someone gets to re-rolling that patch.

Adding alt text via a title attribute is a bad idea. Many screenreader simply ignore titles, particularly on images.

Now if an organization like WebAIM.org was suggesting titles, that would be another issue, but w3schools does not have expertise in accessibility.

Good call.

Will use what we already have then.

<div class="element-invisible">' + Drupal.t('External Links icon') + '</div>

Yup. That will work better.

Re-rolled the patch with changes.

Removed the sprite image file for now from patch.

Commited to Git. Needs Port to 6.x and 8.x

Moving to the correct branch.

Looks like it's already implemented in 8.x-1.x-dev.