Package Exports

css-codepoints

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (css-codepoints) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

css-codepoints

Generate CSS classes per font glyph.

Example

var cssCodepoints = require('css-codepoints');

var css = cssCodepoints({
  fontFamily: 'MySuperFont',
  prefix: 'icon-',
  formats: {
    svg: 'my_super_font.svg',
    ttf: 'my_super_font.ttf'
  },
  icons: {
    foo: 0x1337,
    bar: 0x266e
  }
});

fs.writeFileSync('generated.css', css);

generated.css:

@font-face {
    font-family: "MySuperFont";
    src: url("my_super_font.svg") format("svg"),
         url("my_super_font.ttf") format("ttf");
}

.icon-foo::before {
    content: "\1337";
    font-family: "MySuperFont";
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    vertical-align: bottom;
}
.icon-bar::before {
    content: "\266e";
    font-family: "MySuperFont";
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    vertical-align: bottom;
}

Options

Option	Required?	Type
fontFamily	Yes	string
formats	Yes, ≥1	Object.<type: string, url: string>[]
icons	No	Object.<name: string, codepoint: {number\|string}>[]
prefix	No	string

options.fontFamily is merely the value of font-face property.

options.formats describes the @font-face's src property.

options.icons describes code points to generate classes for. Each codepoint value should normally be a number, but for the sake of compatibility with JSON configs (which have no notion of a hexadecimal number) it is also allowed to be a string of hex digits.

options.prefix is the common class prefix, empty by default.

License

MIT