<?xml version="1.0" encoding="utf-8"?>
<page xmlns="http://projectmallard.org/1.0/" type="guide" style="xslt-stylesheet" id="icons">
 <info>
  <link type="guide" xref="stylesheets" group="icons"/>
  <desc>Specify common named icons to style output.</desc>
  <revision version="3.28" date="2017-05-24" status="final"/>
 </info>
 <title>Icons</title>
 <p>This stylesheet provides a common interface to specify icons for transformations
 to presentation-oreinted formats. This allows similar output for different
 types of input documents.</p>
 <p>Many of the icons are output as SVG elements that can be embedded directly
 into an HTML document. These icons use class names like <sys>yelp-svg-fill</sys> and
 <sys>yelp-svg-stroke</sys>, allowing you to style them with colors from the <code xref="colors">colors</code>
 module.</p>
 <p>Some SVG icons are read from separate source SVG files. When this is done, the
 <code xref="icons.svg.mode">icons.svg.mode</code> mode is applied to reduce the SVG to the minimal form needed
 for proper presentation.</p>
 <links type="topic" groups="imports" style="linklist">
  <title>Imports Stylesheets</title>
 </links>
 <links type="topic" groups="includes" style="linklist">
  <title>Includes Stylesheets</title>
 </links>
 <links type="topic" groups="params" style="linklist">
  <title>Defines Parameters</title>
 </links>
 <links type="topic" groups="keys" style="linklist">
  <title>Defines Keys</title>
 </links>
 <links type="topic" groups="templates" style="linklist">
  <title>Defines Templates</title>
 </links>
 <links type="topic" groups="modes" style="linklist">
  <title>Defines Modes</title>
 </links>
 <list style="compact">
  <title>Calls Modes</title>
  <item>
   <p><link xref="icons.svg.mode"/></p>
  </item>
 </list>
 <table rules="rows">
  <title>Implements Templates</title>
  <thead>
   <tr>
    <th>
     <p>Mode</p>
    </th>
    <th>
     <p>Match</p>
    </th>
   </tr>
  </thead>
  <tbody>
   <tr>
    <td>
     <p><code xref="icons.svg.mode">icons.svg.mode</code></p>
    </td>
    <td>
     <p><code>svg:title</code></p>
    </td>
   </tr>
   <tr>
    <td>
     <p><code xref="icons.svg.mode">icons.svg.mode</code></p>
    </td>
    <td>
     <p><code>svg:metadata</code></p>
    </td>
   </tr>
   <tr>
    <td>
     <p><code xref="icons.svg.mode">icons.svg.mode</code></p>
    </td>
    <td>
     <p><code>svg:*</code></p>
    </td>
   </tr>
   <tr>
    <td>
     <p><code xref="icons.svg.mode">icons.svg.mode</code></p>
    </td>
    <td>
     <p><code>text()</code></p>
    </td>
   </tr>
   <tr>
    <td>
     <p><code xref="icons.svg.mode">icons.svg.mode</code></p>
    </td>
    <td>
     <p><code>*</code></p>
    </td>
   </tr>
  </tbody>
 </table>
</page>
