adding simple line icons

Go to solution

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

Arjan Woldring 124 posts 231 karma points

Nov 09, 2017 @ 08:49
0

Adding Simple Line Icons
Hi Mario,

First of all love your package! This is a good example of a good extensible package!

I do have a problem with adding "Simple Line Icons". Likely I am doing something wrong because I am definitely no Regex Expert xD

This is the css: Line Icons CSS

This is what I added to preconfigs.json:
```
        {
        "name": "Simple Line Icons",
        "selector": "\\.(icon-[\\w-]+):before{",
        "template": "<i class=\"{icon}\"></i>"
    }
```
But when adding the package on the iconic datatype it says in the chrome console: "Extracted styles are 0"

Any help would be great! Thanks, Arjan
Copy Link
Mario Lopez 168 posts 958 karma points MVP 4x c-trib

Nov 09, 2017 @ 09:23
100
Hey Arjan,

So glad you like the package :)

You are almost there man, you are missing a space before the curly brace. The full configuration would be:
```
    {
      "name": "Simple Line Icons",
      "selector": "\\.(icon-[\\w-]+):before {",
      "template": "<i class=\"{icon}\"></i>"
    }
```
If you use a minimised version remember to remove that space.

If you don't mind I'll steal this configuration to include it in the next version of the package :P
Copy Link
Arjan Woldring 124 posts 231 karma points

Nov 09, 2017 @ 12:40

1

Because Umbraco uses the same ".icon-" classes, all the icons in Umbraco backend are replaced with the Simple Line Icons, which looks pretty awesome but that is a side-effect which we do not want. So we need to keep in mind to use different icon class names for Icons starting with ".icon-"

Copy Link
Arjan Woldring 124 posts 231 karma points

Nov 09, 2017 @ 12:00

0

Thank you so much! That stupid space was the solution xD

Of course you can use the configuration for the next release!

Keep up the good work! Cheers, Arjan

Copy Link
is working on a reply...

Please Sign in or register to post replies

Flag this post as spam?