<page xmlns="http://projectmallard.org/1.0/"
      type="guide"
      id="ui-elements">

  <info>
    <credit type="author">
      <name>Allan Day</name>
      <email>aday@gnome.org</email>
    </credit>
    <include href="legal.xml" xmlns="http://www.w3.org/2001/XInclude"/>
  </info>

<title>User interface elements</title>

<p>User interface elements are the building blocks for application interfaces. The guidelines in this section are intended to help you get the details of your design right. It is recommended that you ensure that you are familiar with the <link xref="patterns">design patterns</link> before you use this section.</p>

<table>
<tr>
<td><p><link xref="buttons">Buttons</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/buttons.svg"/></td>
<td><p><link xref="button-menus">Button Menus</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/button-menu.svg"/></td>
</tr>
<tr>
<td><p><link xref="check-boxes">Check boxes</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/check-boxes.svg"/></td>
<td><p><link xref="drop-down-lists">Drop down lists</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/drop-down-list.svg"/></td>
</tr>
<tr>
<td><p><link xref="menus">Menus</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/menu.svg"/></td>
<td><p><link xref="menu-bars">Menu bars</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/menu-bar.svg"/></td>
</tr>
<tr>
<td><p><link xref="popovers">Popovers</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/popover.svg"/></td>
<td><p><link xref="progress-bars">Progress bars</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/progress-bars.svg"/></td>
</tr>
<tr>
<td><p><link xref="progress-spinners">Progress spinners</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/progress-spinner.svg"/></td>
<td><p><link xref="sliders">Sliders</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/sliders.svg"/></td>
</tr>
<tr>
<td><p><link xref="spin-boxes">Spin boxes</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/spin-boxes.svg"/></td>
<td><p><link xref="switches">Switches</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/switches.svg"/></td>
</tr>
<tr>
<td><p><link xref="radio-buttons">Radio buttons</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/radio-buttons.svg"/></td>
<td><p><link xref="tabs">Tabs</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/tabs.svg"/></td>
</tr>
<tr>
<td><p><link xref="text-fields">Text fields</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/text-fields.svg"/></td>
<td><p><link xref="toolbars">Toolbars</link></p></td>
<td><media type="image" mime="image/svg" src="figures/ui-elements/toolbar.svg"/></td>
</tr>
</table>

</page>
