backflip/gulp-iconfont-css — pull request #11 by miclf (2014-03-11 11:53:03+00:00)
Title: Group common styles into a single CSS selector

Styles that are common between icons (i.e. everything except the `content` property) are currently duplicated for each icon once the generated `.scss` file is converted to CSS.

This PR extracts these styles from the mixin and add them back via an `@extend` directive, which creates a combined selector for all of the icons. The `%icon` placeholder itself is never rendered in the final CSS.

To illustrate this with an example, the final CSS code changes from this

```css

.icon-cat:before {
content: "\E001";
font-family: "Icons";
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-style: normal;
font-variant: normal;
font-weight: normal;
text-decoration: none;
text-transform: none; }

.icon-dog:before {
content: "\E002";
font-family: "Icons";
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-style: normal;
font-variant: normal;
font-weight: normal;
text-decoration: none;
text-transform: none; }

.icon-unicorn:before {
content: "\E003";
font-family: "Icons";
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-style: normal;
font-variant: normal;
font-weight: normal;
text-decoration: none;
text-transform: none; }

/* ... other icons ... */
```

to this

```css
.icon-cat:before, .icon-dog:before, .icon-unicorn:before /* ... other icon names ... */ {
font-family: "Icons";
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-style: normal;
font-variant: normal;
font-weight: normal;
text-decoration: none;
text-transform: none; }

.icon-cat:before {
content: "\E001"; }

.icon-dog:before {
content: "\E002"; }

.icon-unicorn:before {
content: "\E003"; }

/* ... other icons ... */
```