Skip to content

Instantly share code, notes, and snippets.

@pfulton
Created September 14, 2015 19:18

Revisions

  1. pfulton created this gist Sep 14, 2015.
    24 changes: 24 additions & 0 deletions SassMeister-input.scss
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,24 @@
    // ----
    // Sass (v3.4.14)
    // Compass (v1.0.3)
    // ----

    @mixin icon-base {
    background-size: contain;
    display: inline-block;
    height: 18px;
    width: 18px;
    vertical-align: top;
    }

    %icon-base {
    @include icon-base;
    }

    $icons: instagram twitter facebook mail;

    @each $icon in $icons {
    .icon-#{$icon} {
    @extend %icon-base;
    }
    }
    7 changes: 7 additions & 0 deletions SassMeister-output.css
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,7 @@
    .icon-instagram, .icon-twitter, .icon-facebook, .icon-mail {
    background-size: contain;
    display: inline-block;
    height: 18px;
    width: 18px;
    vertical-align: top;
    }