Style external links

nice-digital · Aug 12, 2016 · f7582e3 · f7582e3
1 parent 62f8919
commit f7582e3
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 1 deletion.
diff --git a/src/stylesheets/helpers/_helpers-glyphs.scss b/src/stylesheets/helpers/_helpers-glyphs.scss
@@ -19,7 +19,8 @@ $glyphs: (
 	greater-than: '003e',
 	less-than: '003c',
 	copyright: '00a9',
-	left-double-quotation-mark: '201C'
+	left-double-quotation-mark: '201C',
+	ne-arrow: '021D7'
 	// Add more entity codes here as and when they're needed
 );
 

diff --git a/src/stylesheets/typography/_typography-global.scss b/src/stylesheets/typography/_typography-global.scss
@@ -45,6 +45,21 @@ a {
 		@include default-focus-style;
 		background-color: $focus-colour;
 	}
+
+	// Add icon to external links
+	&[rel='external'] {
+		&::after {
+			color: $link-colour;
+			content: get-glyph(ne-arrow);
+		    display: inline-block;
+	        position: relative;
+    		top: -.5em;
+		}
+
+		&:hover::after {
+			color: $link-hover-colour;
+		}
+	}
 }
 
 p,