将默认蓝色主题更改为绿色

Question

我想将我的Sencha Touch应用程序的默认蓝色更改为绿色。我遵循的步骤如下：

1. gem update --system

2. gem install compass

3. compass create myfile

4. 复制一个.scss文件和目录touch-2.2.1/resources/sqss/粘贴它。

5. 粘贴在该文件下面的代码并将其命名为happy.css：

   $base-color: #709e3f; 
   @import 'sencha-touch/default/all'; 
   @include sencha-panel; 
   @include sencha-buttons; 
   @include sencha-sheet; 
   @include sencha-tabs; 
   @include sencha-toolbar; 
   @include sencha-list; 
   @include sencha-layout; 
   @include sencha-loading-spinner; 
   

6. compass compile happy.scss

7. 在app.html页面替换名称happy.scss。

8. 运行应用程序，我得到了以下错误：

   Syntax error: Undefined variable: "$font-family".\a on line 2 of /Applications/XAMPP/xamppfiles/htdocs/touch-2.2.1/resources/themes/stylesheets/sencha-touch/default/src/_Class.scss\a from line 1 of /Applications/XAMPP/xamppfiles/htdocs/touch-2.2.1/resources/themes/stylesheets/sencha-touch/default/src/_all.scss\a from line 1 of /Applications/XAMPP/xamppfiles/htdocs/touch-2.2.1/resources/themes/stylesheets/sencha-touch/default/_all.scss\a from line 3 of /Applications/XAMPP/xamppfiles/htdocs/touch-2.2.1/resources/sass/happy.scss\a\a 1: /Applications/XAMPP/xamppfiles/htdocs/touch-2.2.1/resources/sass/happy.scss

我该如何解决这个问题？

Answer 1

添加以下行

@import 'sencha-touch/default'; 

这条线之前

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

而且按照文件

There are a lot of changes from Sencha Touch 2.1 to 2.2, 

The most important change to be aware of is the move away from using mixins 
for each component 

We found that using mixins for each component was quite slow when compiling your Sass, 
so we decided to simply move to using @import to just include each component. 

在触摸2.1，样式表是这样的：

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

@include sencha-panel; 
@include sencha-buttons; 
// and other components… 

在触摸2.2，它看起来像这样：

@import 'sencha-touch/default'; 

@import 'sencha-touch/default/Panel'; 
@import 'sencha-touch/default/Button'; 
// and other components