Add the 'is reviwed' badge to the charm icons

Add the 'is reviwed' badge to the charm icons

- Add the original svg given in case we need it at different sizes
- Save a .png version for use in sprites
- Add the check/html to the templates
- Add the css in both locations, charm-token and the full charm details
display.

https://code.launchpad.net/~rharding/juju-gui/reviewed-indicator/+merge/161426

(do not edit description out of merge proposal)

[rharding, 2013-04-29 13:21:15]

Please take a look.

[rharding, 2013-04-29 14:28:25]

Please take a look.

[j.c.sackett, 2013-04-29 14:39:48]

https://codereview.appspot.com/8797047/diff/3001/app/subapps/browser/template...
File app/subapps/browser/templates/browser_charm.handlebars (right):

https://codereview.appspot.com/8797047/diff/3001/app/subapps/browser/template...
app/subapps/browser/templates/browser_charm.handlebars:23: <i class="sprite
badge-approved"></i>
Why are we using an italics tag for this?

https://codereview.appspot.com/8797047/diff/3001/lib/views/browser/charm-full...
File lib/views/browser/charm-full.less (right):

https://codereview.appspot.com/8797047/diff/3001/lib/views/browser/charm-full...
lib/views/browser/charm-full.less:95: }
Again, I'm very confused about the use of an italic tag for this; why not just a
span? <i> is an old tag, almost solely about text-presentation--it makes for
weird markup here.

[rharding, 2013-04-29 14:59:39]

Comment below.

https://codereview.appspot.com/8797047/diff/3001/app/subapps/browser/template...
File app/subapps/browser/templates/browser_charm.handlebars (right):

https://codereview.appspot.com/8797047/diff/3001/app/subapps/browser/template...
app/subapps/browser/templates/browser_charm.handlebars:23: <i class="sprite
badge-approved"></i>
On 2013/04/29 14:39:48, j.c.sackett wrote:
> Why are we using an italics tag for this?

I copied the use from other places with sprites. Using a span tag won't work as
browsers will collapse an empty span tag regardless of the css width/height set.

Changing to a div will have block level issue. I could try to float it and such,
but the <i> used throughout the other places works so I ran with convention.

[rharding, 2013-04-29 14:59:55]

Please take a look.

[j.c.sackett, 2013-04-29 15:00:52]

On 2013/04/29 14:59:39, rharding wrote:
> Comment below.
> 
>
https://codereview.appspot.com/8797047/diff/3001/app/subapps/browser/template...
> File app/subapps/browser/templates/browser_charm.handlebars (right):
> 
>
https://codereview.appspot.com/8797047/diff/3001/app/subapps/browser/template...
> app/subapps/browser/templates/browser_charm.handlebars:23: <i class="sprite
> badge-approved"></i>
> On 2013/04/29 14:39:48, j.c.sackett wrote:
> > Why are we using an italics tag for this?
> 
> I copied the use from other places with sprites. Using a span tag won't work
as
> browsers will collapse an empty span tag regardless of the css width/height
set.
> 
> Changing to a div will have block level issue. I could try to float it and
such,
> but the <i> used throughout the other places works so I ran with convention.

Ok; let's leave it for now, but follow up with Huw and see about doing a large
fix if there's something better. This really doesn't feel right to me.

Otherwise, LGTM.

[matthew.scott, 2013-04-29 15:35:04]

LGTM - thanks for the branch

[rharding, 2013-04-29 16:05:49]

*** Submitted:

Add the 'is reviwed' badge to the charm icons

- Add the original svg given in case we need it at different sizes
- Save a .png version for use in sprites
- Add the check/html to the templates
- Add the css in both locations, charm-token and the full charm details
display.

R=j.c.sackett, matthew.scott
CC=
https://codereview.appspot.com/8797047