2011-12-09 43 views
0

我是Sankar.I試圖給一個特定的Extjs按鈕使用SASS.But顏色,但IAM無法找到解決方案。請幫我關於this.I給出以下代碼。Extjs 4按鈕顏色使用SASS問題?

$base-color: #5291C5; 

@import 'compass'; 
@import 'ext4/default/all'; 

@include extjs-button-ui(
    'smallbtn', 
    $border-radius: 10px, 
    $border-color: #A52A2A, 
    $background-color: #A52A2A, 
    $color: #A52A2A 

    enter code here 
); 

額外信息

謝謝 'EXT4 /默認/全部' 給出@include @import您reply.I;然後它顯示出一些語法錯誤。我無法爲此獲得解決方案。對於我創建「tbar」的要求如下 { text:'Retrieve', id:' btnConsolidatedRetrieve」, UI:‘綠色’ } 我給出的.scss文件

$include-default: false; 


$base-color: #5291C5; 

@import 'compass'; 
@import 'ext4/default/all'; 

@include extjs-boundlist; 
@include extjs-button; 
@include extjs-btn-group; 
@include extjs-datepicker; 
@include extjs-colorpicker; 
@include extjs-menu; 
@include extjs-grid; 
@include extjs-form; 
@include extjs-form-field; 
@include extjs-form-fieldset; 
@include extjs-form-file; 
@include extjs-form-checkboxfield; 
@include extjs-form-checkboxgroup; 
@include extjs-form-triggerfield; 
@include extjs-form-htmleditor; 
@include extjs-panel; 
@include extjs-qtip; 
@include extjs-slider; 
@include extjs-progress; 
@include extjs-toolbar; 
@include extjs-window; 
@include extjs-messagebox; 
@include extjs-tabbar; 
@include extjs-tab; 
@include extjs-tree; 
@include extjs-drawcomponent; 
@include extjs-viewport; 


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

$border-color: #CC00FF 
); 

$relative-image-path-for-uis: true; 

給這個‘TBAR’後是不是changing.Please給我一個簡單的例子爲this.I我無法找到這個UI的工具欄按鈕。

回答

0

除非您確定@import 'ext4/default/all';這一行處於最底部,否則此代碼將不起作用。之後聲明的任何內容都不會對從_all.scss導入的變量生效,因爲_all.scss中的mixins在編譯之前需要訪問這些值。如果不需要處理小部件等,您可以在導入所有行後聲明自己的代碼。

另外,當您執行compass compile時,請檢查終端中的錯誤消息,因爲這通常會捕獲語法錯誤或不好的圖片網址。

以下兩篇文章應該爲您提供更多幫助。他們是無價的我,因爲我學會了如何使SASS用戶界面的ExtJS的:

http://existdissolve.com/2011/09/extjs-4-theming-getting-this-thing-to-go/

http://existdissolve.com/2011/09/extjs-4-theming-custom-uis/

+0

嗨史密斯, 感謝您reply.I編輯我code.Please看看就這個問題和給我一個答案。 – Sankar