Question

我在我的* .scss主题文件中定义的SASS中找到了几个变量，这些变量在使用“sencha app build”在Sencha Cmd中构建应用程序时，不会根据其名称编译正确的CSS。我想要做的就是有一个默认颜色，一个默认的背景颜色，以及一些事件发生时的一些其他变化，如覆盖，聚焦，按下和禁用。然后确保它们适用于所有组件（表单字段，组合，网格单元，树节点等）。我在下面找到了一些例子，这些SASS变量中只有一小部分对我有用。

对于在Sencha Cmd中被破坏的SASS变量，使用标准Sencha功能为所有组件应用主题的最简单方法是什么？你能举几个例子吗？

我找到一些SASS变量的示例网页：

https://github.com/mkalafior/extjs4-zend-json-server/tree/master/public/packages/ext-theme-neutral/sass/src

click any of the *.scss files to see the SASS variables

http://zachowen.wordpress.com/2012/09/10/custom-theming-for-extjs-4-part-1-buttons/

$border-radius: 0px,
$border-width: 3px,

$border-color: #900 #500 #500 #900,
$border-color-over: #A00 #700 #700 #A00,
$border-color-focus: #A00 #700 #700 #A00,
$border-color-pressed: #500 #900 #900 #500,
$border-color-disabled: #F6D600 #A66600 #A66600 #F6D600,

$padding: 3px 0,
$text-padding: null,

$background-color: #a00,
$background-color-over: #c00,
$background-color-focus: #c00,
$background-color-pressed: #700,
$background-color-disabled: #FEBF00,

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

$color: #F6D600,
$color-over: null,
$color-focus: null,
$color-pressed: #100,
$color-disabled: #500,

$font-size: 11px,
$font-size-over: 11px,
$font-size-focus: 11px,
$font-size-pressed: 11px,
$font-size-disabled: 11px,

$font-weight: bold,
$font-weight-over: bold,
$font-weight-focus: bold,
$font-weight-pressed: bold,
$font-weight-disabled: bold,

$font-family: sans-serif,
$font-family-over: sans-serif,
$font-family-focus: sans-serif,
$font-family-pressed: sans-serif,
$font-family-disabled: sans-serif,

$icon-size: null

Answer 1

看起来你正在发明一些不存在的全局SASS变量。我建议先阅读Theming guide，然后查看组件的文档，看看它们支持哪些SASS变量，并在新主题或应用程序SASS中更改这些变量以满足您的需求。 / p>

当SASS变量无法编译正确的CSS时，Sencha ExtJS 4标准主题变通方法

1 个答案: