Merge pull request #293 from alphagov/remove-external-link-styles

Remove external link styles

docs/mixins.md

@@ -378,61 +378,6 @@ Tabular numbers have numerals of a standard fixed width. As all numbers have the
 
 [See an example of tabular numbers in a table](http://govuk-elements.herokuapp.com/data/#data-table-numeric)
 
-#### external links
-
-`external-link-default` sets up the background image for all external links.
-This should be included on the default link style for a project.
-
-After setting the default, apply includes from the following for different font sizes:
-
-* `external-link-12`
-* `external-link-12-no-hover`
-* `external-link-13`
-* `external-link-13-no-hover`
-* `external-link-14`
-* `external-link-14-bold-no-hover`
-* `external-link-16`
-* `external-link-16-bold-no-hover`
-* `external-link-19`
-* `external-link-19-no-hover`
-
-`external-link-heading` is a unique style a background image for headings to groups of external links.
-
-This uses the `file-url` helper which will by default output an `image-url` to
-be used with Compass or Rails Asset Pipeline, if you want to use a static path
-then set the `$path` variable to point to the public location of the toolkit
-image assets.
-
-#### Description
-
-For a set style:
-
-`@include external-link-[style]`
-
-For a specific font size:
-
-`@include external-link-[size]-[weight]-[no-hover]`
-
-#### Usage
-
-    /* Default link style */
-    a[rel="external"] {
-      @include external-link-default;
-      @include external-link-19;
-    }
-
-    th.external-link {
-      @include external-link-heading;
-    }
-
-    .inner a[rel="external"] {
-      @include external-link-16;
-    }
-
-    .departments a[rel="external"] {
-     @include external-link-16-bold-no-hover;
-    }
-
 ### <a id="css3"></a>css3
 
 CSS3 helpers to abstract vendor prefixes.

stylesheets/_typography.scss

@@ -247,90 +247,3 @@ $is-print: false !default;
     padding-bottom: 5px;
   }
 }
-
-// External link styles for all font sizes
-
-// Private mixin for use solely by those below
-
-@mixin external-link-size($content, $top, $top-hover: top) {
-  &:after {
-    content: $content;
-    background-position: right $top;
-  }
-
-  @if $top-hover == top {
-    $top-hover: $top;
-  }
-
-  &:hover:after {
-    background-position: right $top-hover;
-  }
-}
-
-@mixin external-link-12-no-hover {
-  @include external-link-size($content: "\A0\A0\A0\A0\A0\A0\A0\A0", $top: 0);
-}
-
-@mixin external-link-12 {
-  @include external-link-size($content: "\A0\A0\A0\A0\A0\A0\A0\A0", $top: 0, $top-hover: -388px);
-}
-
-@mixin external-link-13-no-hover {
-  @include external-link-size($content: "\A0\A0\A0\A0\A0", $top: 1px);
-}
-
-@mixin external-link-13 {
-  @include external-link-size($content: "\A0\A0\A0\A0\A0", $top: 1px, $top-hover: -387px);
-}
-
-@mixin external-link-14 {
-  @include external-link-size($content: "\A0\A0\A0\A0\A0", $top: 1px, $top-hover: -387px);
-}
-
-@mixin external-link-14-bold-no-hover {
-  @include external-link-size($content: "\A0\A0\A0\A0\A0\A0", $top: 2px);
-}
-
-@mixin external-link-16 {
-  @include external-link-size($content: "\A0\A0\A0\A0\A0", $top: 3px, $top-hover: -385px);
-}
-
-@mixin external-link-16-bold-no-hover {
-  @include external-link-size($content: "\A0\A0\A0\A0\A0\A0", $top: 3px);
-}
-
-@mixin external-link-19-no-hover {
-  @include external-link-size($content: "\A0\A0\A0\A0", $top: 6px);
-}
-
-@mixin external-link-19 {
-  @include external-link-size($content: "\A0\A0\A0\A0", $top: 6px, $top-hover: -382px);
-}
-
-@mixin external-link-19-bold-no-hover {
-  @include external-link-size($content: "\A0\A0\A0\A0\A0\A0", $top: 6px);
-}
-
-@mixin external-link-default {
-  &:after {
-    background-image: file-url("external-links/external-link.png");
-    background-repeat: no-repeat;
-
-    @include device-pixel-ratio() {
-      background-image: file-url("external-links/external-link-24x24.png");
-      background-size: 12px 400px;
-    }
-  }
-}
-
-@mixin external-link-heading {
-  &:after {
-    background-image: file-url("external-links/external-link-black-12x12.png");
-    background-repeat: no-repeat;
-
-    @include device-pixel-ratio() {
-      background-image: file-url("external-links/external-link-black-24x24.png");
-      background-size: 12px 400px;
-    }
-  }
-}

stylesheets/design-patterns/_buttons.scss

@@ -126,14 +126,6 @@
     }
   }
 
-  // Reset styles applied to external links
-  &[rel="external"]:after {
-    display: none;
-    content: none;
-    margin-left: 0;
-    margin-right: 0;
-  }
-
   // Fixes a bug where IE puts a black border around certain elements
   @include ie-lte(8) {
     &[type="submit"],