Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/spheresoftware/rebel-icons
http://rebel-icons.com/
https://github.com/spheresoftware/rebel-icons
Last synced: about 1 month ago
JSON representation
http://rebel-icons.com/
- Host: GitHub
- URL: https://github.com/spheresoftware/rebel-icons
- Owner: SphereSoftware
- License: mit
- Created: 2016-08-03T17:34:53.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2016-12-06T22:36:40.000Z (about 8 years ago)
- Last Synced: 2024-04-26T18:47:08.280Z (8 months ago)
- Language: JavaScript
- Homepage:
- Size: 12.5 MB
- Stars: 11
- Watchers: 172
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE.md
Awesome Lists containing this project
README
# rebel-icons
Include pixel perfect icons in your React projects easily with `rebel-icons`.
Use ES6 imports and include only the icons that your project is using.
Use `React Higher Order` component to adjust your icons defaults.
Override an attribute if needed and even more... with `Rebel Icons`.
## Dependencies
This library designed to be used with `React`, you don't need any other packages to use this icons.
## Installation
We distribute this package as `npm` package. In order to use it you just need to install it as
any other project in your system.
npm install rebel-icons --save
## Usage
You can easily add `rebel-icons` to any Component in you app, just import it, and you good to go.
```javascript
import Icon from 'rebel-icons';
class OneAwesomeComponent extends Component {
render() {
return
Lets do some
}
}
```
## Configuration
All components use `IconBase`, so you can use `Context` to provide some defaults to your project.
Your can use one of your root component to set this configuration.
```js
export default class RootComponent extends Component {
static childContextTypes = {
rebelIconsBase: PropTypes.object
};
getChildContext() {
return {
rebelIconsBase: {
color: 'grey',
size: 64,
style: {
...
}
}
}
}
...
}
```
If you want to reduce the size of your bundle and you are using [webpack](https://webpack.github.io/)
you can use [ContextReplacementPlugin](https://webpack.github.io/docs/list-of-plugins.html#contextreplacementplugin)
to specify the list of Rebel Icons that you want to use.
```js
// Webpack_config.js
const Icons = ['rebel', 'js', 'ruby', ...];
const regExp = new RegExp(`(?:${Icons.join('|')})Icon`, 'i');
plugins: [
...
new webpack.ContextReplacementPlugin(/rebel-icons[\/\\]rebel-lib$/, regExp)
]
```
# 
## Getting help
If you have questions, concerns, bug reports, etc, please file an issue in this repository's
Issue Tracker. We appreciate all feedback and will be glad to help if we can.
## Getting involved
- [ ] Fork it!
- [ ] Create your feature branch: git checkout -b my-new-feature
- [ ] Commit your changes: git commit -am 'Add some feature'
- [ ] Push to the branch: git push origin my-new-feature
- [ ] Submit a pull request :D
General instructions on _how_ to contribute can be found here [CONTRIBUTING](CONTRIBUTING.md).
## Contributors
| **Alla Odeyanenko** | **Anton Shemerey** | **Aleksandr Zhukov** |
| :---: |:---:| :---:|
| [
](https://www.linkedin.com/in/alla-odeyanenko-3171762a) | [](https://github.com/shemerey) | [](https://github.com/AleksandrZhukov)
| `https://www.linkedin.com/in/alla-odeyanenko` | `https://github.com/shemerey` | `https://github.com/AleksandrZhukov`
----
## LICENSE
This project released under MIT [LICENSE](LICENSE.md)
----
## Credits and references
1. [react-icons](https://github.com/gorangajic/react-icons)
2. [Devicon](http://devicon.fr)
### FAQ.
* Where is the font? `Rebel Icons` doesn’t come as a font we are target `React` only.
* Is `Rebel Icons` free even for commercial use? Yes, absolutely.