JSPM – file-icons-js@1.1.0

Package Exports

file-icons-js
file-icons-js/css/style.css

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 (file-icons-js) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

╭───────╮                    ╭────╮
│    ╭──╯╭───╮╭───╮╭──────╮  ├────┤╭──────╮╭──────╮╭────┬─╮╭──────╮
│    ╰──╮├───┤│   ││  ──  │  │    ││   ╭──╯│   ╭╮ ││      ││  ────┤
│    ╭──╯│   ││   ││      │  │    ││   ╰──╮│   ││ ││   ╭╮ ││      │
│    │   │   ││   ││  ────┤  │    ││      ││   ╰╯ ││   ││ │├────  │
╰────╯   ╰───╯╰───╯╰──────╯  ╰────╯╰──────╯╰──────╯╰───╯╰─╯╰──────╯
╭─╮  ╭─╮  ┬─╮         ┬  ╭─╮  ┬  ┬  ╭─╮  ╭─╮  ╭─╮  ┬─╮  ┬  ╭─╮  ╭┬╮
├┤   │ │  ├┬╯         │  ├─┤  ╰╮╭╯  ├─┤  ╰─╮  │    ├┬╯  │  ├─╯   │
┴    ╰─╯  ┴╰─       ╰─╯  ┴ ┴   ╰╯   ┴ ┴  ╰─╯  ╰─╯  ┴╰─  ┴  ┴     ┴

File specific icons for the browser from Atom File-icons, https://github.com/file-icons/atom

Install

Use npm to install as follows,

npm i websemantics/file-icons-js

Or, Bower,

bower i websemantics/file-icons-js

Getting Started

Include css styles from css/style.css in the header of an html document.

Get an instance of FileIcons class,

var icons = window.FileIcons;

Get the class name of the icon that represent a filename (for example text-icon),

var filename = 'src/app.js';
var class_name = icons.getClass(filename);

You can also get a class name of the associated icon color,

var  filename = 'README.md';
var class_name = icons.getClassWithColor(filename);

Use the class name to generate html, for example,

document.body.innerHTML = "<a><i class=" + class_name + "></i>$filename</a>";

Resources

Atom File Icons, file specific icons for improved visual grepping.
Markdown Browser Plus, Github flavoured, local file browser for markdown docs.

Support

Need help or have a question? post at StackOverflow.

Please don't use the issue trackers for support/questions.

Star if you find this project useful, to show support or simply for being awesome :)

Contribution

Contributions to this project are accepted in the form of feedback, bugs reports and even better - pull requests.

file-icons-js