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

Css background values with vendor prefixes #33

Open
joshuaboshi opened this issue Dec 11, 2014 · 2 comments
Open

Css background values with vendor prefixes #33

joshuaboshi opened this issue Dec 11, 2014 · 2 comments

Comments

@joshuaboshi
Copy link

Hello,

I wanted to use JSS to generate CSS rule like this:

body.mystyle {
    background-image: -moz-linear-gradient(top, rgba(0,0,0,0) 75%, rgba(0,0,0,0.65));
    background-image: -webkit-linear-gradient(top, rgba(0,0,0,0) 75%, rgba(0,0,0,0.65));
    background-image: -o-linear-gradient(top, rgba(0,0,0,0) 75%, rgba(0,0,0,0.65));
    background-image: -ms-linear-gradient(top, rgba(0,0,0,0) 75%, rgba(0,0,0,0.65));
    background-image: linear-gradient(top, rgba(0,0,0,0) 75%, rgba(0,0,0,0.65));
}

The API of JSS is great. But usage of Objects for css properties will not work in case like above.
Maybe there could be a new set method which will accept strings directly?

I would like to avoid browser detection and setting just the correct rule.

Thanks!

@barneycarroll
Copy link

@joshuaboshi the reason you need to do things like that in static CSS is because it's impossible to know ahead of time which property the receiving browser will need: with JSS you have the advantage of executing in the browser, so you can determine which syntax is necessary and avoid specifying the unnecessary ones each time. You might want to use something like Modernizr to parse unprefixed CSS and return code compliant with the host browser.

@joshuaboshi
Copy link
Author

@barneycarroll hello and thanks for your prompt response! And sorry for my late response :)
I know, I could do both of the suggested solutions. It would be much cleaner. But I wanted to avoid browser detection, or adding more libraries to the project at that point.

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

2 participants