Iconography
Social care and health icons
Social care and health have developed a set of icons for use only in their materials. Please contact web@edinburgh.gov.uk for more details.
Interface icons
There are some icons included by default for use in the user interface. You can easily add any of the below icons with just a class.
icon-search
icon-cancel-circled
icon-calendar
icon-help-circled
icon-info-circled
icon-down-open-mini
icon-left-open-mini
icon-right-open-mini
icon-mail
icon-youtube
icon-facebook-rect
icon-twitter-bird
icon-googleplus-rect
icon-linkedin-rect
Code
HTML
<span class="icon-calendar">12th January 2014</span>
Output: 12th January 2014
<a href="https://twitter.com/Edinburgh_CC" class="icon-twitter-bird"><span class="away">Twitter</span></a>
Output: Twitter
External link icon
The CSS will automatically add an external link icon at the end of any hyperlink that does not point to an internal page or file. There is no need to add this icon manually. Do not use this or similar icons for any other purpose.
Example: BBC
For links which are icons and obviously external links, the icon can be disabled:
Code
HTML
<span class="no-external"><a href="https://twitter.com/edinburgh_cc" class="icon-twitter-bird"><span class="away">Twitter</span></a></span>
Output: Twitter
Govspeak icons
The CSS will automatically add an icon to any section of content marked up as Govspeak. Use Govspeak to denote special types of content as outlined in the Govspeak documentation.