Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/stevenmhunt/badgerly

A CSS 3 library for rendering badges.
https://github.com/stevenmhunt/badgerly

Last synced: about 2 months ago
JSON representation

A CSS 3 library for rendering badges.

Awesome Lists containing this project

README

        

# Badgerly

```
> bower install badgerly --save
```

BADGERLY BADGER BADGE

---
- Integrates easily with [Font Awesome](http://fontawesome.io/)!
- Fully implemented in CSS 3, no spacer images or other hackery.
- Simple to use CSS classes which can be extended.
- Implemented in SCSS, also available in plain CSS for your convenience.

## Check out the [Wall of Badges](https://jsfiddle.net/stevenmhunt/3krm64o1/)
WALL OF BADGES

## Integrations
- [angular-badgerly](https://github.com/stevenmhunt/angular-badgerly) - Adds directive support for Badgerly, making it even easier (somehow) to create badges!

## Colors
Gold, Silver, Bronze

## Sizes
Tiny, Small, Medium, Large, Huge

## Ribbon Patterns
Red, Orange, Yellow, Green, Blue, Purple, Pink, Black, Rainbow, and a bunch of country flags!

Supports either a single ribbon or a lanyard with two visible ribbons.

## Examples

### [Round silver metal with a single purple ribbon](https://jsfiddle.net/stevenmhunt/wqyrq8a0/)
```html








```

### [Diamond gold metal with a red lanyard](https://jsfiddle.net/stevenmhunt/0739du3f/)
```html










```

## Contributing

Contributions and pull requests are welcome! Here are instructions on how to build the project:

- Make changes in the **badgerly.scss** file.
- Then, run `npm install` followed by `gulp sass` to transpile the SCSS file into CSS.
- Push the your changes to your fork and submit a PR.

## Credits
-

Badger icon made by Freepik from www.flaticon.com is licensed by CC 3.0 BY