SAPikachu / icomoon-build

Build IcoMoon project in Node
MIT License
27 stars 9 forks source link

Missing support for Icomoon's feature for multiple class names #11

Closed Shoplifter closed 8 years ago

Shoplifter commented 8 years ago

When I use multiple class names in icomoon e.g. "image-left-aligned, image-big" for the same icon:

I get this in icon-classes.scss:

.icon-image-left-aligned, image-big:before { content: $icon-image-left-aligned, image-big-content; }

where it should be:

.icon-image-left-aligned:before { content: $icon-image-left-aligned-content; }
.icon-image-big:before { content: $icon-image-big-content; }

or shorter: .icon-image-left-aligned:before, .icon-image-big:before { content: $icon-image-left-aligned-content; }

There is also an error in the declaration of the content variables: $icon-image-left-aligned, image-big-variant-content: "\e800"; instead of:

$icon-image-left-aligned-content: "\e800";
$icon-image-big-content: "\e800";

But that issue is of course easy to work around.

SAPikachu commented 8 years ago

Looks like this is a new feature of IcoMoon, can you post your project file here (or send to i@sapika.ch) so that I can be sure my fix is correct? Thanks. :)

Shoplifter commented 8 years ago

test.zip

you're welcome. Attached archive contains *.json project file from icomoon and _icon-classes.scss generated by icomoon-build

SAPikachu commented 8 years ago

Thanks! I will look into it later this week.

SAPikachu commented 8 years ago

Just fixed in latest version, can you have a try?

Shoplifter commented 8 years ago

@SAPikachu Hi, sorry for the delyay, i have been on vacation last week. Declaration of SASS variables is fine now, but there's still a bug in the icon_classes mixin: Instead of

@mixin icon-classes {
    .icon-search:before { content: $icon-search, magnifier-content; }
    .icon-magnifier:before { content: $icon-search, magnifier-content; }
}

it should look like

@mixin icon-classes {
    .icon-search:before { content: $icon-search-content; }
    .icon-magnifier:before { content: $icon-magnifier-content; }
}

icomoon-test.zip

The archive attached contains the json file (test.json) and the archive downloaded from icomoon (incl. fonts, css, demo files etc. - test.zip

SAPikachu commented 8 years ago

Oops, sorry that I missed one change in the code. Should be fixed in the latest version, can you have a try?

Shoplifter commented 8 years ago

works great now. Thank you for fixing this!