IPPC Design Docs / Icons


Updated: Wednesday, 18 November 2009

The IPPC icons use a technique called CSS sprites. CSS sprites are a way to reduce the number of HTTP requests made for image resources referenced by the site. Images are combined into one larger image at defined X and Y coordinates. Having assigned this generated image to relevant page elements the background-position CSS property can then be used to shift the visible area to the required component image. More information, CSS sprite generator, Silk icon set.

File types

Adopted standard badge  <span class="icn-adoptedbadge"><a href="#">...</a></span>
Unknown file type  class="icn-blank"
Word document  class="icn-doc"
Image file  class="icn-img"
PDF document  class="icn-pdf"
Powerpoint presentation  class="icn-ppt"
Plain text file  class="icn-txt"
Project  class="icn-project"
Website Link  class="icn-www"
Excel spreadsheet  class="icn-xls"
Zipped/Compressed file(s)  class="icn-zip"


Back to top  class="icn-backtotop" Also applied to links inside backtotop paragraphs p class="backtotop"
Green arrow  class="bullet-triangle" To assign arrows to an entire list use: ul class="arrows"
Black arrow  class="bullet-triangle-black"
Feed  class="icn-feed"
Edit  class="icn-edit"
Preview  class="icn-preview"
Required  class="icn-required" Also available as inline image for forms accessibility <img src="icn-required.gif" alt="Required" />
Translatable  class="icn-translatable" Also available as inline image for forms accessibility <img src="icn-translatable.gif" alt="Translatable" />
Create page  class="icn-page-add"
Edit page  class="icn-page-edit"
Delete page  class="icn-page-delete"
Delete  class="icn-delete"
New item  class="icn-addnew-inline" Also applied to table captions with: a class="inlineaddnew"
Subscribe  class="icn-subscribe"
Bookmark  class="icn-bookmark"
Copy Link  class="icn-copylink"

Work Area Quicklinks

Publication  class="icn-publication-add"
Contact  class="icn-contact-add"
Email  class="icn-email-add"
Event  class="icn-event-add"
Group  class="icn-group-add"
Keyword  class="icn-keyword-add"
Pest report  class="icn-pestreport-add"
News item  class="icn-news-add"
User  class="icn-user-add"
Project  class="icn-project-add"
Website  class="icn-www-add"
Non-contracting party  class="icn-noncontracting"
Territory  class="icn-territory"
Warning  class="icn-warning"
Error  class="icn-error"
Success  class="icn-success"