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

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

gem更新——系统

gem安装指南针

compass创建myfile

复制了

.scss

文件并将其粘贴到

touch-2.2.1/resources/sqss/

目录中

将以下代码粘贴到该文件中，并将其命名为

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;

compass.scss

替换了

app.html

页面中的名称

happy.scss

运行应用程序后，我发现以下错误：

语法错误：未定义的变量“$font family”。\a位于的第2行 /Applications/XAMPP/xamppfiles/htdocs/touch-2.2.1/resources/themes/stylesheets/sencha touch/default/src/_Class.scss\a 从第1行开始 /Applications/XAMPP/xamppfiles/htdocs/touch-2.2.1/resources/themes/stylesheets/sencha-touch/default/src/_-all.scss\a 从第1行开始 /Applications/XAMPP/xamppfiles/htdocs/touch-2.2.1/resources/themes/stylesheets/sencha-touch/default/_-all.scss\a 从第3行开始 /Applications/XAMPP/xamppfiles/htdocs/touch-2.2.1/resources/sass/happy.scss\a\a 1: /应用程序/XAMPP/xamppfiles/htdocs/touch-2.2.1/resources/sass/happy.scss

如何解决此问题？

添加以下行

@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.

在Touch2.1中，您的样式表如下所示：

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

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

@import 'sencha-touch/default';

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

在Touch2.2中，它看起来是这样的：

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

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

@import 'sencha-touch/default';

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