Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Don't load your styles from code #13

Open
luisrudge opened this issue Jun 6, 2015 · 7 comments
Open

Don't load your styles from code #13

luisrudge opened this issue Jun 6, 2015 · 7 comments

Comments

@luisrudge
Copy link
Contributor

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
Copy link
Owner

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
Copy link
Contributor Author

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
Copy link

👍 @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
Copy link
Owner

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

@LongLiveCHIEF
Copy link

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
Copy link
Owner

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 notifications@github.com
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
#13 (comment)
.

@LongLiveCHIEF
Copy link

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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants