无法创建ExtJS5面板UI

我正在尝试创建一个与常规面板标题颜色不同的面板。由于将有不同标题颜色的面板，我决定为每个面板创建不同的UI。以下是其中一个的示例代码：

@包含extjs面板ui $ui:'暗绿色'， $ui边框颜色：$panel灯光边框颜色， $ui主体边框颜色：$panel light主体边框颜色， $ui标题边框颜色：$panel light标题边框颜色， $ui页眉字体系列：$panel light页眉字体系列， $ui页眉字体大小：$panel light页眉字体大小， $ui页眉字体重量：$panel轻型页眉字体重量， $ui标题颜色：$panel light标题颜色， $ui标题背景色：666， $ui标题文本转换：$panel light标题文本转换， $ui工具背景图像：$panel light工具背景图像 ;

在创建它并构建我的应用程序之后，我包括了一个带有ui的面板：“暗绿色”，但没有效果。相反，面板没有应用css。有人能指出问题出在哪里吗

当您的组件有框架时：true，这是面板的情况，您应该按框架创建UI。 请尝试以下代码： *请注意，您应该更改UI的名称，但在面板中声明UI:“暗绿色”

我做过这件事，它对我起了作用

---

正是我想要的。谢谢

@include extjs-panel-ui(
    $ui:"darkgreen-framed",
    $ui-border-color: $panel-frame-border-color,
    $ui-border-radius: $panel-frame-border-radius,
    $ui-border-width: $panel-frame-border-width,
    $ui-padding: $panel-frame-padding,
    $ui-header-color: #FFF,
    $ui-header-font-family: $panel-header-font-family,
    $ui-header-font-size: $panel-header-font-size,
    $ui-header-font-weight: $panel-header-font-weight,
    $ui-header-line-height: $panel-header-line-height,
    $ui-header-border-color: $panel-frame-border-color,
    $ui-header-border-width: $panel-frame-header-border-width,
    $ui-header-border-style: $panel-header-border-style,
    $ui-header-background-color: #666,
    $ui-header-background-gradient: $panel-header-background-gradient,
    $ui-header-inner-border-color: $panel-frame-header-inner-border-color,
    $ui-header-inner-border-width: $panel-frame-header-inner-border-width,
    $ui-header-text-padding: $panel-header-text-padding,
    $ui-header-text-margin: $panel-header-text-margin,
    $ui-header-text-transform: $panel-header-text-transform,
    $ui-header-padding: $panel-frame-header-padding,
    $ui-header-icon-width: $panel-header-icon-width,
    $ui-header-icon-height: $panel-header-icon-height,
    $ui-header-icon-spacing: $panel-header-icon-spacing,
    $ui-header-icon-background-position: $panel-header-icon-background-position,
    $ui-header-glyph-color: $panel-header-glyph-color,
    $ui-header-glyph-opacity: $panel-header-glyph-opacity,
    $ui-header-noborder-adjust: $panel-header-noborder-adjust,
    $ui-tool-spacing: $panel-tool-spacing,
    $ui-tool-background-image: $panel-tool-background-image,
    $ui-body-color: $panel-body-color,
    $ui-body-border-color: $panel-body-border-color,
    $ui-body-border-width: $panel-frame-body-border-width,
    $ui-body-border-style: $panel-body-border-style,
    $ui-body-background-color: $panel-frame-background-color,
    $ui-body-font-size: $panel-body-font-size,
    $ui-body-font-weight: $panel-body-font-weight,
    $ui-body-font-family: $panel-body-font-family,
    $ui-background-stretch-top: $panel-background-stretch-top,
    $ui-background-stretch-bottom: $panel-background-stretch-bottom,
    $ui-background-stretch-right: $panel-background-stretch-right,
    $ui-background-stretch-left: $panel-background-stretch-left,
    $ui-include-border-management-rules: $panel-include-border-management-rules,
    $ui-wrap-border-color: null,
    $ui-wrap-border-width: null,
    $ui-ignore-frame-padding: $panel-ignore-frame-padding
);