[WebProfilerBundle] New icons

[lmcd]

I always thought the profiler icons looked a bit mspaint-ish. I've used icons from The Entypo Pictogram Suite and things look a lot better imo. If someone wants to give the go-ahead on this, I'll submit a PR.

Before:

After:

Icons can be found here: http://www.entypo.com/

[Tobion]

Looks better. But since these icons are CC BY, it would require a link to the author on the WDT, wouldn't it?

[lmcd]

Current icons are attributed to Sensio in ICONS_LICENSE.txt

[Tobion]

I'm talking about the new ones you would like to use.

[lmcd]

Yeah I meant to suggest that perhaps the new ones could be credited in the same place. May be a good idea to contact the author if we decide to use them.

[lmcd]

Scales great at bigger resolutions too:
https://dl.dropbox.com/u/169382/wdt-big.png

[empire]

@lmcd And what about using http://fortawesome.github.com/Font-Awesome/ instead. Maybe some icon is not exist, but we can ask needed icons by submitting issues.
This icon set is great on bigger resolutions too.
Font-Awesome has better developer friendly naming when using them (<li></li> vs <i class="icon-github"></i>)

[empire]

And one more things, Font-Awesome is based on twitter bootrstrap. In the future, we can use twitter bootsrap framework for Profiler page and this Font-Awesome is compatible with.

[TroodoNmike]

I am not sure if "After" looks better. Perhaps for "Exception" and "Events" yes but others are good?

[lmcd]

@empire - the Font-Awesome set is also nice, but not quite as good in my opinion. Also the class names are achieved using CSS :before pseudo-elements... there is nothing stopping us doing the same thing. e.g. <span class="icon-exception"></span>. This way we can fall back to images for custom WDT panels.

[lmcd]

@Tobion also note that the current icons are under exactly the same CC BY license

[lmcd]

Some more profiler cleanups with entypo icons:

Before:

After:

[dlsniper]

@lmcd is there a live link to see them in action rather that the screenshots? They look great imho and would be a nice change for the WDT.
And why don't you submit a PR directly since you've done the work already and see the feedback there? ;)

[lmcd]

I'll create a PR in the next few days. This issue touches various other bundles (e.g. DoctrineBundle), making it a bit of a headache to demo.

[lmcd]

The actual toolbar with entypo icons:

Higher res:

What's the current policy on linking external assets in WebProfilerBundle? I see everything is currently inlined on the page as base64 data uris. What's the reason for this?

If we strip the woff font file of everything except the glyphs we need, it weighs in at only 4,060 bytes. This is way less than the images we're using at the moment, provides scalability at higher resolutions and can be easily inlined. The downside is that we'll lose a bunch of other useful glyphs that developers could leverage. Would be nicer if we could link the font.

Edit: also contacted Daniel Bruce from entypo. He's happy for us to use the icons and attribute via the ICONS_LICENSE.txt file.

[fabpot]

we are using base64 images to avoid any external files. This makes the webprofiler independant of Symfony, the full-stack framework, so that it can be used on Drupal or Silex (I have a working prototype that I will publish soon).