| OLD | NEW |
| 1 | 1 |
| 2 /** | 2 /** |
| 3 * The `iron-iconset-svg` element allows users to define their own icon sets | 3 * The `iron-iconset-svg` element allows users to define their own icon sets |
| 4 * that contain svg icons. The svg icon elements should be children of the | 4 * that contain svg icons. The svg icon elements should be children of the |
| 5 * `iron-iconset-svg` element. Multiple icons should be given distinct id's. | 5 * `iron-iconset-svg` element. Multiple icons should be given distinct id's. |
| 6 * | 6 * |
| 7 * Using svg elements to create icons has a few advantages over traditional | 7 * Using svg elements to create icons has a few advantages over traditional |
| 8 * bitmap graphics like jpg or png. Icons that use svg are vector based so the
y | 8 * bitmap graphics like jpg or png. Icons that use svg are vector based so the
y |
| 9 * are resolution independent and should look good on any device. They are | 9 * are resolution independent and should look good on any device. They are |
| 10 * stylable via css. Icons can be themed, colorized, and even animated. | 10 * stylable via css. Icons can be themed, colorized, and even animated. |
| 11 * | 11 * |
| 12 * Example: | 12 * Example: |
| 13 * | 13 * |
| 14 * <iron-iconset-svg id="my-svg-icons" iconSize="24"> | 14 * <iron-iconset-svg name="my-svg-icons" size="24"> |
| 15 * <svg> | 15 * <svg> |
| 16 * <defs> | 16 * <defs> |
| 17 * <g id="shape"> | 17 * <g id="shape"> |
| 18 * <rect x="50" y="50" width="50" height="50" /> | 18 * <rect x="50" y="50" width="50" height="50" /> |
| 19 * <circle cx="50" cy="50" r="50" /> | 19 * <circle cx="50" cy="50" r="50" /> |
| 20 * </g> | 20 * </g> |
| 21 * </defs> | 21 * </defs> |
| 22 * </svg> | 22 * </svg> |
| 23 * </iron-iconset-svg> | 23 * </iron-iconset-svg> |
| 24 * | 24 * |
| (...skipping 144 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 169 // TODO(dfreedm): `pointer-events: none` works around https://crbug.com/
370136 | 169 // TODO(dfreedm): `pointer-events: none` works around https://crbug.com/
370136 |
| 170 // TODO(sjmiles): inline style may not be ideal, but avoids requiring a
shadow-root | 170 // TODO(sjmiles): inline style may not be ideal, but avoids requiring a
shadow-root |
| 171 svg.style.cssText = 'pointer-events: none; display: block; width: 100%;
height: 100%;'; | 171 svg.style.cssText = 'pointer-events: none; display: block; width: 100%;
height: 100%;'; |
| 172 svg.appendChild(sourceSvg.cloneNode(true)).removeAttribute('id'); | 172 svg.appendChild(sourceSvg.cloneNode(true)).removeAttribute('id'); |
| 173 return svg; | 173 return svg; |
| 174 } | 174 } |
| 175 return null; | 175 return null; |
| 176 } | 176 } |
| 177 | 177 |
| 178 }); | 178 }); |
| OLD | NEW |