mergus-icons
v1.0.0
Published
mergus-icons it's a hard-to-get set of scalable icons commonly used in Argentina
Downloads
2
Maintainers
Readme
#mergus-icons
###Getting started Install the package with:
npm install --save mergus-icons
or
bower install --save mergus-icons
In the < head > of your html, reference the location to your mergus-icons.min.css:
<link rel="stylesheet" href="path/to/build/font/mergus-icons.min.css">
###Usage
All icons require the class mgi as base, followed by the individual icon class. This classes, can be combined with any helper class to style icons.
<i class="mgi mgi-mergus"></i>
<i class="mgi mgi-mergus mgi-lg"></i>
Tip: You can also use the svg files individually, you can find them in the folder /lib/svg .
###Helper classes
Larger icons: The class mgi-lg makes the font 33% larger relative to the icon container. mgi-2x, mgi-3x, mgi-4x, mgi-5x make the font x times larger relative to the icon container.
Fixed Width Icons: mgi-fw sets icons at a fixed width.
List Icons: mgi-ul and mgi-li are used to replace default bullets in unordered lists.
Bordered & Pulled Icons: mgi-border creates a border around the icon and it can be combined with mgi-pull-left or mgi-pull-right to make an icon stand out.
Animated Icons: mgi-spin makes icons rotate and use mgi-pulse to make the icon rotate with 8 steps.
Rotate & Flip: Use mgi-rotate-90, mgi-rotate-180 and mgi-rotate-270 to rotate icons X degrees over itself. Use mgi-flip-horizontal and mgi-flip-vertical to make icons flip horizontally or vertically.
Stacked Icons: To stack multiple icons, use the mgi-stack class on the parent, the mgi-stack-1x for the regularly sized icon, and mgi-stack-2x for the larger icon.
Inverse color: mgi-inverse makes icons to change its color to white.
Accessibility: sr-only allows to add alternative information such as displays and text for screen readers.
You can also change the icons color through CSS, like with any font:
body {
color: blue;
}
###Request an icon? Yes, sure! Just open an issue with the "new icon" label. The more information and references you leave us, the better!
###License All font files and SVG files are under SIL OFL 1.1 License
All other files are under MIT License
###Credits Based on Octicons and Font Awesome.
###Brand Icons
- All brand icons are trademarks of their respective owners.
- The use of these trademarks does not indicate endorsement of the trademark holder by Mergus Design, nor vice versa.
- Brand icons should only be used to represent the company or product to which they refer.