Norse Polytheistic Mythology

    postcss-icon.joshnh

    1.0.1 • Public • Published

    postcss-icon.joshnh

    Icon set data for postcss-icon plugin, based on joshnh/Pure-CSS-Icons

    postcss-icon.joshnh

    Install

    npm install -D postcss-icon.joshnh postcss-icon
    # or 
    yarn add -D postcss-icon.joshnh postcss-icon

    Input

    .custom-selector {
      @icon: joshnh-pause; /* 'joshnh-' is Prefix , 'pause' is name Icon*/
      color: gold;
      /* ... your css code */
    }

    Output

    .custom-selector::after{
      content: '';
      /* ... */
    }
    /* after before i span if needed */
    .custom-selector{
      color: #000;
      width: 20px;
      heigth: 20px;
      /* ... */
      color: gold;
      /* ... your css code */
    }

    Use (more examples)

    const     postcss = require('postcss');
    const postcssIcon = require('postcss-icon');
     
    const CSS = `
    .custom-selector {
      @icon: joshnh-pause;
    }`;
     
    postcss(
      postcssIcon({
        "postcss-icon.joshnh": {
          prefix: 'joshnh-' /* required when using multiple Icon data sets */
        },
        "postcss-icon.OtherSetName": { /* Options */ }
      })
    ).process(CSS).then(({css, messages}) => {
      console.log(css);
      messages
        .filter(i => i.type === "warning")
        .map(e => console.log(e.toString()));
    });

    Other icon sets:

    Font icons:

    Css only icons:

    All name icons (count: 24) result demo

    add, batEmpty, batFull, calendar, chart, clock, comment, contacts, cross, eject, flag, folder, heart, home, mail, newDoc, next, pause, play, prev, stop, subtract, tick, user

    Keywords

    none

    Install

    npm i postcss-icon.joshnh

    DownloadsWeekly Downloads

    1

    Version

    1.0.1

    License

    MIT

    Last publish

    Collaborators

    • retyui