Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.

3 лет назад
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. # [ReactCSS](http://reactcss.com/)
  2. [![Build Status][travis-svg]][travis-url]
  3. [![dependency status][deps-svg]][deps-url]
  4. [![dev dependency status][dev-deps-svg]][dev-deps-url]
  5. [![License][license-image]][license-url]
  6. [![Downloads][downloads-image]][downloads-url]
  7. ## Inline Styles in JS with support for [React](http://reactcss.com/#react), [React Native](http://reactcss.com/#react-native), [Autoprefixing](http://reactcss.com/#autoprefixing), [Hover](http://reactcss.com/#hover), [Pseudo-Elements](http://reactcss.com/#pseudo-elements) & [Media Queries](http://reactcss.com/#media-queries)
  8. ## Install
  9. ```
  10. npm install reactcss --save
  11. ```
  12. ## Style Object
  13. Define a default styles for your elements:
  14. ```javascript
  15. import reactCSS from 'reactcss'
  16. const styles = reactCSS({
  17. 'default': {
  18. card: {
  19. background: this.props.background,
  20. boxShadow: '0 2px 4px rgba(0,0,0,.15)',
  21. },
  22. },
  23. })
  24. ```
  25. Pass style definitions via inline styles:
  26. ```javascript
  27. <div style={ styles.card } />
  28. ```
  29. ## Activating Classes
  30. Activate additional classes by passing down objects as additional parameters to `reactCSS`:
  31. ```javascript
  32. const styles = reactCSS({
  33. 'default': {
  34. card: {
  35. background: '#fff',
  36. boxShadow: '0 2px 4px rgba(0,0,0,.15)',
  37. },
  38. },
  39. 'zIndex-2': {
  40. card: {
  41. boxShadow: '0 4px 8px rgba(0,0,0,.15)',
  42. },
  43. },
  44. }, {
  45. 'zIndex-2': props.zIndex === 2,
  46. })
  47. ```
  48. ## Documentation
  49. See the [Full Documentation](http://reactcss.com)
  50. ## Examples
  51. Examples and projects built with reactCSS:
  52. [Felony](https://github.com/henryboldi/felony) - Next Level PGP Desktop App
  53. [React Color](https://github.com/casesandberg/react-color) - Color Pickers from Sketch, Photoshop, Chrome, Github, Twitter & more
  54. [Buffer App Components](https://www.npmjs.com/package/@bufferapp/components) - A shared set of UI Components
  55. [React Reactions](https://github.com/casesandberg/react-reactions) - Use Reactions from Slack, Facebook, Pokemon, Github and Youtube
  56. [travis-svg]: https://travis-ci.org/casesandberg/reactcss.svg
  57. [travis-url]: https://travis-ci.org/casesandberg/reactcss
  58. [deps-svg]: https://david-dm.org/casesandberg/reactcss.svg
  59. [deps-url]: https://david-dm.org/casesandberg/reactcss
  60. [dev-deps-svg]: https://david-dm.org/casesandberg/reactcss/dev-status.svg
  61. [dev-deps-url]: https://david-dm.org/casesandberg/reactcss#info=devDependencies
  62. [npm-badge-png]: https://nodei.co/npm/reactcss.png?downloads=true&stars=true
  63. [license-image]: http://img.shields.io/npm/l/reactcss.svg
  64. [license-url]: LICENSE
  65. [downloads-image]: http://img.shields.io/npm/dm/reactcss.svg
  66. [downloads-url]: http://npm-stat.com/charts.html?package=reactcss