Improve documentation for core-icon when using custom icon sets

[tjsavage]

Re: http://www.polymer-project.org/docs/elements/core-elements.html#core-icon

The method for using custom icon sets is not clear and also in error in the documentation for core-icon:

Example using icon cherry from custom iconset fruit:

<core-icon icon="fruit:cherry"></core-icon>
See core-iconset and core-iconset-svg for more information about how to use a 
custom iconset.

See core-icons for the default set of icons. To use the default set of icons you'll 
need to include an import for core-icons.html. To use a different built-in set of 
icons, you'll need to include an import for core-icons/iconsets/<iconset>.html.

Firstly, additional icon sets are located in core-icons/<iconset>.html.

Second, the fruit:cherry example does not make it clear that additional icon sets are identified by an HTML ID and that fruit is the ID for that icon set. A better example would be to use one of the existing icon sets for an example i.e.

<link rel="import" href="../core-icons/social-icons.html"> // iconset HTML ID is 'social'
<link rel="import" href="../core-icons/av-icons.html"> // iconset HTML ID is 'av'
<core-icon icon="social:public"></core-icon> // icon from the custom social-icons iconset
<core-icon icon="av:volume-mute"></core-icon> // icon from the custom av-icons iconset

In addition, some similar language in the demo for http://www.polymer-project.org/components/core-icons/demo.html would be helpful.

Lastly, the [<iconset id>:]<icon id> syntax should be documented in the API reference, as well.

Otherwise, keep up all the great work and thanks!

[ebidel]

This should be filed under core-icons. It's the reference docs.

[tjsavage]

auto-moving this issue to Polymer/core-icon#19 and closing this one

[tjsavage]

Thanks! Moved.