octoleo/file-icon-vectors
1
1
Fork 0
mirror of https://github.com/namibia/file-icon-vectors.git synced 2024-09-27 20:19:03 +00:00
Code Issues Releases Activity
109 Commits 3 Branches 3 Tags 3.2 MiB
SCSS 97.3%
JavaScript 2.7%
225681d98c
Go to file
Eric Lapouyade 225681d98c
Added .ods vivid icon
2018-03-26 14:56:23 +02:00
demo Moved css to ./dist; added uglifycss 2018-01-28 20:44:11 -06:00
dist Added .ods vivid icon 2018-03-26 14:56:23 +02:00
src/scss Moved css to ./dist; added uglifycss 2018-01-28 20:44:11 -06:00
.gitignore Added lock files 2018-01-28 20:41:30 -06:00
bower.json Added gulpfile.js to Bower ignore list 2018-01-28 20:52:13 -06:00
composer.json Removed version 2018-01-28 15:40:19 -06:00
gulpfile.js Adding package.json, gulpfile.js 2018-01-28 20:40:17 -06:00
LICENSE Updated license 2017-09-16 00:26:09 -05:00
package.json Adding package.json, gulpfile.js 2018-01-28 20:40:17 -06:00
README.md Updated CSS paths in examples 2018-01-28 20:48:20 -06:00

README.md

Author Release License Total Downloads Bower CloudVerve, LLC Donate Twitter

File Vector Icons

A collection of file type SVG icons.

Icon Sets

Currently, there are two icon sets in the dist/icons directory:

Demo: View Icon Sets

Installation

To install with Bower:

bower install file-icon-vectors

To install with Composer:

composer require dmhendricks/file-icon-vectors

Usage

To display a file icon, simply link to one or both of the icon set CSS files in the css directory:

<link rel="stylesheet" href="dist/file-icon-classic.min.css" />
<link rel="stylesheet" href="dist/file-icon-vivid.min.css" />

From there, you can use CSS classes to display the icons:

<span class="fiv-cla fiv-icon-ppt"></span>
<span class="fiv-cla fiv-icon-xls"></span>
<span class="fiv-viv fiv-icon-pdf"></span>
<span class="fiv-viv fiv-icon-wav"></span>

Notice that the classes contain either flv-cla for the Classic set or flv-viv for the Vivid set.

If you want to override the size of the icons, you can do so with CSS:

<style>
   .fiv-cla, .fiv-viv { font-size: 3em; }
</style>

If you prefer, you may also use .fiv-size-md, .fiv-size-lg and .fiv-size-xl to modify the icon sizes:

<span class="fiv-viv fiv-icon-pdf fiv-size-lg"></span>

TODO

  • Fix inconsistent sizing in classic set
  • Add additional Adobe Suite, Microsoft Office icons
  • Add to NPM, CDN
  • Add additional libraries, such as square icons, et al

Legal Stuff

All icons used in the creation of this library were licensed MIT or purchased royalty-free, with exceptions noted below.

If you feel that you have a copyright issue, please feel free to post it.

Attribution