Don't load your styles from code

[luisrudge]

This is related to #12. Because of this line, webpack loads your css even if defaultStyles: false. That forces me to override your default styles with important:

.reactPivot {
  box-shadow: none !important;
  background: transparent !important;
}
.reactPivot-pageNumber {
  cursor: pointer !important;
  font-size: 20px;
}

I think you shouldn't include your styles by default. Just let the "consumer" import the css from their code.

[davidguttman]

I think it's better to include them, handles the 95% use-case / "just-works" / don't have to make users style it themselves. For the power-users, I'm not sure why defaultStyles: false wouldn't work, but if it doesn't you can just have a more specific selector than the defaults to override (just include a parent class in the definition).

[luisrudge]

It doesn't work because it requires me to include your css file into my build process. I agree you should have the default styling, but maybe you should work with inline styles and not a css file.

[LongLiveCHIEF]

:+1: @luisrudge

I think the 95% use-case is / "functionality just works" / && / "matches the style of my app" /.

That's why I like inline styles for react... easy to include them, easy to override them. I build a lot of enterprise level apps, and sometimes this is the only thing that keeps us from adopting, contributing to ($ even), and promoting an open source module or component.

[davidguttman]

Happy to take a PR or see an example of how to get the same effect with inline styles.

[LongLiveCHIEF]

From the Facebook react docs: https://facebook.github.io/react/tips/inline-styles.html

Also, check out Radium. The makers of Radium also have a good article and code intro on the concept.

[davidguttman]

Right, I get the concept of inline styles in react, but what I'd like to see is how to use them instead of the current approach.

On Tue, Jun 9, 2015 at 4:16 PM Brian Vanderbusch [email protected] wrote:

From the Facebook react docs: https://facebook.github.io/react/tips/inline-styles.html

Also, check out Radium https://github.com/formidablelabs/radium. The makers of Radium also have a good article and code intro http://formidablelabs.com/blog/2015/03/01/launching-radium/ on the concept.

— Reply to this email directly or view it on GitHub https://github.com/davidguttman/react-pivot/issues/13#issuecomment-110530068 .

[LongLiveCHIEF]

gotcha. I have a fairly large project I'm working on at the moment that might require me to actually do this. If we get around to it, (at the moment we had to go with fixed-data-tables), I'll send a PR.