search

dowjones / react-picture-show

Slideshow Component
MIT License
55 stars 12 forks source link

Moved styles inline #2

Closed ph101pp closed 6 months ago

ph101pp commented 9 years ago

I haven't touched the build process. Could be simplified now without scss.

ph101pp commented 9 years ago

it also might need new tests.. if so you could show me how to write them :)

Dangoo commented 9 years ago

@greenish: I see this one critical because it fuses you to one method of styling.

ph101pp commented 9 years ago

@Dangoo Thanks for the input! The reason for this is mainly to not depend on an external css files that you have to look for in node_modules/ which is very tedious and not intuitive.. The goal is to only ship the bare minimum of css with the picture-show so the inline parts are actually required for it to run correctly and should not be overwritten. That said, it's not there yet which is one of the reasons why this PR is not merged. The other reason for this being on hold is that there are plans for a major rewrite of the picture-show in the (nearer) future to introduce a new/better/different solution for this problem (and others).

What was your experience with using the component? Anything you missed? Now would be a good time to tell us!

Dangoo commented 9 years ago

@greenish In our current project we're using webpacks cssnext-loader in module mode to implement styling with an external stylesheet.

So we copied the styles in an external CSS file (every component has its own CSS file) which will get merged to the final app.css by webpack. In this way you are more flexible in terms of using pseudo / child selectors etc. and the way one is used to write CSS. We also tried the way of only using inline CSS before and had some issues with shorthand properties, missing selectors, mediaquerries, animations and global basic styles. The "right" way of styling in React yet has to be found, but thats the main reason why I'd suppose to leave the styling completely to the user (except for the aspect ratio maybe).

We added a very basic dot navigation to the picture-show and after working out the way onTransition works, it was quite simple. What would be really nice is a little bit better touch support and the ability to add physics for the transitions would be great.

ph101pp commented 9 years ago

@Dangoo thanks for this! I'll see what we can do.