Source added

README.markdown

@@ -0,0 +1,5 @@
+This is a CSS "module" essentially consisting of an image (a sprite image) and a stylesheet for you to add nice little icons to the right of hyperlinks that lead to a file with a certain extension. Find examples in index.html.
+
+Installation
+
+For production, simply use the hyperlink_icons.css as a stylesheet and make sure that it is referencing the sprite.gif image correctly. This should make links look like the examples in index.html

hyperlink_icons.css

@@ -0,0 +1,136 @@
+a[href$='.doc'], a[href$='.rtf'],
+a[href$='.txt'],
+a[href$='.xls'],
+a[href$='.rss'], a[href$='.atom'],
+a[href$='.opml'],
+a[href$='.phps'],
+a[href$='.torrent'],
+a[href$='.vcard'],
+a[href$='.exe'],
+a[href$='.dmg'], a[href$='.app'],
+a[href$='.pps'],
+a[href$='.pdf'],
+a[href$='.xpi'],
+a[href$='.fla'], a[href$='.swf'],
+a[href$='.zip'], a[href$='.rar'], a[href$='.gzip'], a[href$='.bzip'], a[href$='.ace'] ,
+a[href$='.ical'],
+a[href$='.css'],
+a[href$='.ttf'],
+a[href$='.jpg'], a[href$='.gif'], a[href$='.png'], a[href$='.bmp'], a[href$='.jpeg'], a[href$='.svg'], a[href$='.eps'],
+a[href$='.mov'], a[href$='.wmv'], a[href$='.mp4'], a[href$='.avi'], a[href$='.mpg'],
+a[href$='.mp3'], a[href$='.wav'], a[href$='.ogg'], a[href$='.wma'], a[href$='.m4a'],
+a[href ^="aim:"],
+a[href ^="msnim:"],
+a[href ^="xmpp:"],
+a[href *="icq.com"],
+a[href *="edit.yahoo.com/config/send_webmesg?"],
+a[href ^="callto:"],
+a[href ^="skype:"],
+a[href ^="gg:"],
+a[href ^="mailto:"] {
+	padding: 5px 20px 5px 0;
+	background-image: url(sprite.gif);
+	background-repeat: no-repeat;  
+}
+
+/* filändelser */
+a[href$='.doc'], a[href$='.rtf'] {
+  background-position: right -186px; 
+}
+a[href$='.txt'] {
+  background-position: right -954px; 
+}
+a[href$='.xls'] {
+  background-position: right -1018px; 
+}
+a[href$='.rss'], a[href$='.atom'] { 
+  background-position: right -282px; 
+}
+a[href$='.opml'] { 
+  background-position: right -602px; 
+}
+a[href$='.phps'] { 
+  background-position: right -666px; 
+}
+a[href$='.torrent'] { 
+  background-position: right -890px; 
+}
+a[href$='.vcard'] { 
+  background-position: right -986px; 
+}
+a[href$='.exe'] { 
+  background-position: right -218px; 
+}
+a[href$='.dmg'], a[href$='.app'] { 
+  background-position: right -154px; 
+}
+a[href$='.pps'] { 
+  background-position: right -794px; 
+}
+a[href$='.pdf'] { 
+  background-position: right -634px; 
+}
+a[href$='.xpi'] { 
+  background-position: right -730px; 
+}
+a[href$='.fla'], a[href$='.swf'] { 
+  background-position: right -346px; 
+}
+a[href$='.zip'], a[href$='.rar'], a[href$='.gzip'], a[href$='.bzip'], a[href$='.ace'] { 
+  background-position: right -26px; 
+}
+a[href$='.ical'] { 
+  background-position: right -410px; 
+}
+a[href$='.css'] { 
+  background-position: right -122px; 
+}
+a[href$='.ttf'] { 
+  background-position: right -922px; 
+}
+a[href$='.jpg'], a[href$='.gif'], a[href$='.png'], a[href$='.bmp'], a[href$='.jpeg'], a[href$='.svg'], a[href$='.eps'] { 
+  background-position: right -698px; 
+}
+a[href$='.mov'], a[href$='.wmv'], a[href$='.mp4'], a[href$='.avi'], a[href$='.mpg'] { 
+  background-position: right -314px; 
+}
+a[href$='.mp3'], a[href$='.wav'], a[href$='.ogg'], a[href$='.wma'], a[href$='.m4a'] { 
+  background-position: right -570px; 
+}
+
+/* messenger */
+a[href ^="aim:"] {
+  background-position: right 6px; 
+}
+a[href ^="msnim:"] {
+  background-position: right -538px; 
+}
+a[href ^="xmpp:"] {
+  background-position: right -474px; 
+}
+a[href *="icq.com"] { 
+  background-position: right -442px; 
+}
+a[href *="edit.yahoo.com/config/send_webmesg?"] { 
+  background-position: right -1050px; 
+}
+a[href ^="callto:"] {
+  background-position: right -58px; 
+}
+a[href ^="skype:"] {
+  background-position: right -858px; 
+}
+a[href ^="gg:"] {
+  background-position: right -378px; 
+}
+
+/* email */
+a[href ^="mailto:"] {
+  background-position: right -506px; 
+}
+
+/* use this class to make sure that images you dont want to get an icon */
+.imageLink {
+	padding-right: 0px !important;
+	background: none !important;
+}

index.html

@@ -0,0 +1,88 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+	<title>CSS link icons pack</title>
+
+	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+	<meta http-equiv="Content-Language" content="en" />
+	<meta name="description" content="CSS-module that automagically adds icons to your hyperlinks depending on target file extension of uri scheme." />
+	<meta name="keywords" content="icons, textlinks, css, xhtml" />
+	<meta name="robots" content="all" />
+
+<!-- CSS for the icons, this is what ypu are looking for -->
+	<link rel="stylesheet" type="text/css" media="screen" href="hyperlink_icons.css" />	
+
+</head>
+<body>
+
+	<h1>Add icons to links with <acronym title="Cascading Style Sheet" xml:lang="en" lang="en">CSS</acronym> and a sprite image</h1>
+
+  <p>This is a "plugin" essentially consisting of an image (a sprite image) and a stylesheet for you to add nice little icons to the right of hyperlinks that lead to a file with a certain extension. Like <a href="#untitled.pdf">my non-existing pdf-file</a> for example. </p>
+
+  <h2>Installation</h2>
+  <p>For production, simply use the hyperlink_icons.css as a stylesheet and make sure that it is referencing the sprite.gif image correctly. This should make links look like the examples below:
+    </p>
+
+	<hr />
+
+<div id="extensions">
+
+<!-- Is this what you are looking for? -->
+<h3>Extensions</h3>
+	<ul>
+		<li><a href="#untitled.doc">.doc</a> - <a href="#untitled.rtf">.rtf</a></li>
+		<li><a href="#untitled.txt">.txt</a></li>
+		<li><a href="#untitled.pdf">.pdf</a></li>
+		<li><a href="#untitled.xls">.xls</a></li>
+		<li><a href="#untitled.xpi">.xpi</a> <small>(Firefox Extension)</small></li>
+		<li><a href="#untitled.rss">.rss</a> - <a href="#untitled.atom">.atom</a></li>
+		<li><a href="#untitled.opml">.opml</a></li>
+		<li><a href="#untitled.vcard">.vcard</a></li>
+		<li><a href="#untitled.exe">.exe</a></li>
+		<li><a href="#untitled.dmg">.dmg</a> - <a href="#untitled.app">.app</a></li>
+		<li><a href="#untitled.pps">.pps</a></li>
+		<li><a href="#untitled.ical">.ical</a> <small>(changed)</small></li>
+		<li><a href="#untitled.jpg">.jpg</a> - <a href="#untitled.gif">.gif</a> - <a href="#untitled.png">.png</a> - <a href="#untitled.bmp">.bmp</a> - <a href="#untitled.svg">.svg</a> - <a href="#untitled.eps">.eps</a></li>
+		<li><a href="#untitled.swf">.swf</a> - <a href="#untitled.fla">.fla</a></li>
+		<li><a href="#untitled.css">.css</a></li>
+		<li><a href="#untitled.mp3">.mp3</a> - <a href="#untitled.wav">.wav</a> - <a href="#untitled.ogg">.ogg</a> - <a href="#untitled.wma">.wma</a> - <a href="#untitled.m4a">.m4a</a></li>
+		<li><a href="#untitled.zip">.zip</a> - <a href="#untitled.rar">.rar</a> - <a href="#untitled.gzip">.gzip</a> - <a href="#untitled.bzip">.bzip</a> - <a href="#untitled.ace">.ace</a></li>
+		<li><a href="#untitled.ttf">.ttf</a></li>
+		<li><a href="#untitled.mov">.mov</a> - <a href="#untitled.wmv">.wmv</a> - <a href="#untitled.mp4">.mp4</a> - <a href="#untitled.avi">.avi</a> - <a href="#untitled.mpg">.mpg</a></li>
+		<li class="new"><a href="#untitled.phps">.phps</a></li>
+		<li class="new"><a href="#untitled.torrent">.torrent</a></li>
+	</ul>
+</div>
+
+<div id="schemes">
+
+	<h3>e-Mail/Messaging <acronym title="Uniform Resource Identifier" xml:lang="en" lang="en">URI</acronym> schemes</h3>
+	<ul>
+		<li><a href="mailto:somebody@somedomain.tld">mailto:</a></li>
+		<li><a href="callto:USERNAME">callto:</a></li>
+		<li><a href="msnim:USERNAME">msnim:</a></li>
+		<li><a href="xmpp:USERNAME">xmpp:</a></li>
+		<li><a href="aim:USERNAME">aim:</a></li>
+		<li><a href="http://www.icq.com/0123456789">ICQ Link</a></li>
+		<li><a href="http://edit.yahoo.com/config/send_webmesg?.target=USERNAME&amp;.src=pg">YIM! Link</a></li>
+		<li><a href="skype:USERNAME">skype:</a></li>
+		<li class="new"><a href="gg:USERNAME">gg:</a></li>
+	</ul>
+
+</ul>
+
+<hr />
+
+<div id="example">
+  <h3>Compatibility</h3>
+  <p>This <acronym title="Cascading Style Sheet" xml:lang="en" lang="en">CSS</acronym> module has been successfully tested in <br />
+    <strong>Firefox</strong> (<em>Mac &amp; PC</em>), <strong>Camino</strong>, <strong>Safari</strong>, <strong>Opera</strong> (<em>Mac &amp; PC</em>) &amp; <strong>Internet Explorer 7</strong> (6 doesn't work)</p>
+  </div>
+
+<div id="footer">
+	<p>Icons by <a href="http://famfamfam.com/">famfamfam</a><br />
+	  This work is licensed under a <a href="http://creativecommons.org/licenses/by/2.5/">Creative Commons Attribution License</a>.</p>
+</div>
+
+</body>
+</html>