Sencha Theming with Compass and Sass not working

Question

I am trying to build a custom theme. I added the $base-color and $base_gradient properties to my resources/sass/app.scss and compiled it by issuing compass compile from the folder. The compilation worked and replaced the css/app.csss. However I am not seeing the changes reflected in my application. How do I change the theme with sass and compass?

Answer 1

Base gradient takes a - not a _

Then check that your var are defined after the line (should not matter for base-color but better to put them after)

@import 'sencha-touch/default/all';

Your vars should be defined like this :

$base-color: #7A1E08;  
$base-gradient: 'glossy';

Check that you are in the [app-folder]/resources/sass/app.css and not in the sdk folder

When compiling you should see the following line

overwrite ../css/app.css

Empty your browser cache then reload your app.