Skip to content

Instantly share code, notes, and snippets.

@BPScott
Created August 13, 2015 10:12
Show Gist options
  • Save BPScott/1643c339fcefd7017877 to your computer and use it in GitHub Desktop.
Save BPScott/1643c339fcefd7017877 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// libsass (v3.2.5)
// ----
// Sass is really dumb about creating literal backslashes, such as when
// creating codepoints for icon fonts.
// This works in LibSass 3.2 and Ruby Sass 3.4
// Shamelessly pilfered from https://github.com/sass/sass/issues/659#issuecomment-71759457
@mixin icon-content($codepoint) {
content: #{"\"\\"}#{$codepoint + "\""};
}
// Defaults to be applied to every icon
// Use placeholder extends here so this gets compiled into a single selector
%icon {
font-family: 'intGEL icons';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
$icons: (
copy: e604,
more: e600,
unpublish: e601,
);
@each $name, $codepoint in $icons {
.icon-#{$name} {
@extend %icon;
&:before{
@include icon-content($codepoint); }
}
}
.icon-copy, .icon-more, .icon-unpublish {
font-family: 'intGEL icons';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-copy:before {
content: "\e604";
}
.icon-more:before {
content: "\e600";
}
.icon-unpublish:before {
content: "\e601";
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment