|
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253 |
- # Zocial CSS social buttons
-
- I basically rewrote this entire set so they are full vector buttons, meaning:
-
- - @font-face icons
- - custom font file for all social icons
- - icon font use private unicode spaces for accessibility
- - em sizing based on button font-size
- - support for about 83 different services
- - buttons and icons supported
- - no raster images (sweet)
- - works splendidly on any browser supporting @font-face
- - CSS3 degrades gracefully in IE8 and below etc.
- - also includes generic icon-less primary and secondary buttons
-
- *[Demo](https://samcollins.github.io/css-social-buttons/)*
-
- ## How to use these buttons
-
- ```html
- <button class="zocial facebook">Button label here</button>
- ```
-
- or
-
- ```html
- <a class="zocial twitter">Button label</a>
- ```
-
- - Can be any element e.g. `a`, `div`, `button` etc.
- - Add class of `.zocial`
- - Add class for name of service e.g. `.dropbox`, `.twitter`, `.github`
- - Done :-)
-
- Check out [zocial.smcllns.com](http://zocial.smcllns.com) for code examples.
-
- There's also a LESS version from @gustavohenke [here](https://github.com/gustavohenke/zocial-less)
-
- Problems, questions or requests to [@smcllns](http://twitter.com/smcllns)
-
- ## How to contribute
-
- 1. Install [Font Custom](http://fontcustom.com/#installation)
- 2. Add new font in the `src/` folder.
- 3. Set color settings in the `templates/zocial.css` file.
- 4. Run `fontcustom compile`
- 5. Update the `sample.html` file with both the button and icon.
- 6. Test rendering. If broken go to step 2.
- 7. Send pull-request !
-
- ## License
-
- Under [MIT License](http://opensource.org/licenses/mit-license.php)
|