Using a custom jQuery Mobile theme created via Themeroller works fine with Rails for local development. However, running:
rake assets:precompile
on the production server results in this error:
Invalid CSS after "...gradient(linear": expected ")", was ",left top,left ..."
With that line of code in custom-theme.min.css being:
background-image:-webkit-gradient(linear,left top,left bottom,from( #333333 ),to( #333333 ));
The custom theme is included in application.css:
*= require_self
*= require_tree .
*= require jquery.mobile.structure-1.1.1.min
*= require custom-theme.min
*= require jquery-mobile-fluid960.min
I believe the generated Themeroller syntax is valid... Does it have something to do with the css/sass/scss combination?
Turns out the jQuery Mobile Themeroller can be a little buggy. If gradients and borders are not set—that is, omitting the hex color code—it still generates the # tag but no color code, or appends 'NaN' to the end of a gradient color. Setting all colors in Themeroller and then a simple search for border:1px solid # ;
and replace on the generated *.min.css file cleaned this up.