extjs - 如何使用 Compass/Saas 在 Extjs 中自定义工具栏按钮？

Question

我想使用 Compass/Sass 在 Extjs 中自定义工具栏按钮主题，以消除渐变效果。

@include extjs-button-ui(
        'my_button',

        $background-gradient:null,
        $background-gradient-over:null,
        $background-gradient-focus:null,
        $background-gradient-pressed:null,
        $background-gradient-disabled: null 
);

但它返回指南针编译错误：

WARNING: @theme-background-image: Theme image not found: ../images/btn/btn-topbar_button-corners.gif
         on line 18 of /Users/user/Documents/workspace/sihalon/war/extjs/resources/themes/stylesheets/ext4/default/mixins/_theme-background-image.scss

WARNING: @theme-background-image: Theme image not found: ../images/btn/btn-topbar_button-sides.gif
         on line 18 of /Users/user/Documents/workspace/sihalon/war/extjs/resources/themes/stylesheets/ext4/default/mixins/_theme-background-image.scss

    error my-ext-theme.scss (Line 693 of _button.scss: Invalid null operation: "null plus 4px".)
overwrite ../css/my-ext-theme.css 

Answer 1

Shuold 使用 none 表示没有渐变；

例如：

@include extjs-button-ui(
        'my_button',

        $background-gradient:none,
        $background-gradient-over:none,
        $background-gradient-focus:none,
        $background-gradient-pressed:none,
        $background-gradient-disabled: none
);

Answer 2

你必须把

$icon-size:16px,

例如：

@include extjs-button-ui(
'yellow',
$background-color:yellow,
$icon-size:16px,
$font-size:18px
);