EXTJS 4.2 - 使用煎茶CMD

我想用煎茶cmd以創建漸變背景色菜單漸變背景EXTJS 4.2 - 使用煎茶CMD

這裏是我曾嘗試：

.#{$prefix}-menu-body{ 
@include background-image(linear-gradient(#47607E, #35475B)); 
}

我已經把它

下

青菜的\ src \菜單\ Menu.scss

和運行帕茨卡ge build。

我在菜單的背景中看不到任何變化。

我也想知道我是否可以使用CSS變量來做到這一點？

來源

2013-09-24 AMember

菜單是一個面板ui。 Ext.panel.Panel 查看源

extjs-panel-ui($ui-label, [$ui-border-color], [$ui-border-radius], [$ui-border-width], [$ui-padding], [$ui-header-color], [$ui-header-font-family], [$ui-header-font-size], [$ui-header-font-weight], [$ui-header-line-height], [$ui-header-border-color], [$ui-header-border-width], [$ui-header-border-style], [$ui-header-background-color], [$ui-header-background-gradient], [$ui-header-inner-border-color], [$ui-header-inner-border-width], [$ui-header-text-padding], [$ui-header-text-transform], [$ui-header-padding], [$ui-header-icon-width], [$ui-header-icon-height], [$ui-header-icon-spacing], [$ui-header-icon-background-position], [$ui-header-glyph-color], [$ui-header-glyph-opacity], [$ui-tool-spacing], [$ui-tool-background-image], [$ui-body-color], [$ui-body-border-color], [$ui-body-border-width], [$ui-body-border-style], [$ui-body-background-color], [$ui-body-font-size], [$ui-body-font-weight], [$ui-background-stretch-top], [$ui-background-stretch-bottom], [$ui-background-stretch-right], [$ui-background-stretch-left], [$ui-include-border-management-rules], [$ui-wrap-border-color], [$ui-wrap-border-width])

創建一個小組視覺主題，把這些在你menu.scss

@include extjs-panel-ui(
    $ui-label: 'your-ui-label-when-used-in 'ui' property', 
    $ui-body-background-gradient: color-stops(#F950AD, #E4007f), 
    $ui-border-color:#E4007f, 
    $ui-body-background-color:#E4007f, 
    $ui-body-border-width:0px, 
    $ui-border-radius:5px, 
    $ui-body-font-size:1.6em 
);

EXT-主題中性/上海社會科學院/板/面板.scss 添加

$ui-body-background-gradient: $panel-body-background-gradient,

// $板體背景梯度是在你的主題，VAR /板/ panel.scss // $ ui-body-background-gradient是你要使用的變種。編輯面板體SCSS

// body 
    .#{$prefix}panel-body-#{$ui-label} { 
     @if $ui-body-background-color != null { background: $ui-body-background-color; } 
     @if $ui-body-border-color != null {  border-color: $ui-body-border-color; } 
     @if $ui-body-color != null {   color: $ui-body-color; } 
     @if $ui-body-font-size != null {  font-size: $ui-body-font-size; } 
     @if $ui-body-font-weight != null {  font-size: $ui-body-font-weight; } 
     @if $ui-body-border-width != null { 
      border-width: $ui-body-border-width; 
      @if $ui-body-border-style != null { border-style: $ui-body-border-style; } 
     } 
     //$ui-body-background-gradient: $panel-body-background-gradient, 
     ////$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ add it !!! 
     @if $ui-body-background-gradient !=null { 
     @include background-gradient(
        $ui-body-background-color, 
        $ui-body-background-gradient, 
        top 
       ); 
     } 
    }

來源

2013-09-25 05:44:17 gloryBlade

我不想提起添加到每個菜單創建我希望我所有的菜單讓這個造型的用戶界面。 – AMember

你剛纔使用的菜單[code] Ext.create（'Ext.menu.Menu'，{ width：100, margin：'0 0 10 0'， floating：false，//通常你想要這個set爲True（默認） renderTo：Ext.getBody（），//通常由它呈現真實成分含有項目：[{ 文本： '經常項目1' }，{ 文本： '經常項目2' }， { text：'regular item 3' }] }）; [/ code] – gloryBlade

我已經用你的答案爲我的菜單創建了一個ui。只知道$ ui-body-background-gradient不存在。謝謝你的幫助。 – AMember

EXTJS 4.2 - 使用煎茶CMD

回答

相關問題