Inline Styles? CSS preprocessors (Sass, Less...) and/or postprocessors (postcss, autoprefixer)?
- state
- "style" vs "CSS"
- reuse vs repurpose
- global/local namespace
Radium's comparison chart of CSS in JS libraries for React: https://github.com/FormidableLabs/radium/tree/master/docs/comparison
Inline Styles
Pros:
- state fully owned by component
- stateful classes removed from DOM & CSS
- Javascript variables/logic for global/local CSS variables and inline style values
Cons:
- no media queries
- no pseudo selectors, eg :hover (without Javascript shims)
- no pseudo elements
- write CSS in Javascript