You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

README.md 1.8 KiB

12 years ago
12 years ago
12 years ago
12 years ago
12 years ago
12 years ago
9 years ago
9 years ago
12 years ago
9 years ago
12 years ago
9 years ago
12 years ago
9 years ago
12 years ago
9 years ago
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. # Zocial CSS social buttons
  2. I basically rewrote this entire set so they are full vector buttons, meaning:
  3. - @font-face icons
  4. - custom font file for all social icons
  5. - icon font use private unicode spaces for accessibility
  6. - em sizing based on button font-size
  7. - support for about 83 different services
  8. - buttons and icons supported
  9. - no raster images (sweet)
  10. - works splendidly on any browser supporting @font-face
  11. - CSS3 degrades gracefully in IE8 and below etc.
  12. - also includes generic icon-less primary and secondary buttons
  13. *[Demo](https://smcllns.github.io/css-social-buttons/)*
  14. ## How to use these buttons
  15. ```html
  16. <button class="zocial facebook">Button label here</button>
  17. ```
  18. or
  19. ```html
  20. <a class="zocial twitter">Button label</a>
  21. ```
  22. - Can be any element e.g. `a`, `div`, `button` etc.
  23. - Add class of `.zocial`
  24. - Add class for name of service e.g. `.dropbox`, `.twitter`, `.github`
  25. - Done :-)
  26. Check out [zocial.smcllns.com](http://zocial.smcllns.com) for code examples.
  27. There's also a LESS version from @gustavohenke [here](https://github.com/gustavohenke/zocial-less)
  28. Problems, questions or requests to [@smcllns](http://twitter.com/smcllns)
  29. ## CDN
  30. This project is available on CDNJS:
  31. https://cdnjs.com/libraries/css-social-buttons
  32. ## How to contribute
  33. 1. Install [Font Custom](https://github.com/FontCustom/fontcustom)
  34. 2. Add new font in the `src/` folder.
  35. 3. Set color settings in the `templates/zocial.css` file.
  36. 4. Run `fontcustom compile`
  37. 5. Update the `sample.html` file with both the button and icon.
  38. 6. Test rendering. If broken go to step 2.
  39. 7. Send pull-request !
  40. ## License
  41. Under [MIT License](http://opensource.org/licenses/mit-license.php)
  42. The GitLab logo is derived from [this](https://gitlab.com/gitlab-com/gitlab-artwork/blob/a3aaa39c184e49bb3a0ba0d8be74718b3d5b887b/logo/logo-square.svg) which is released under CC BY-NC-SA 4.0.