How to change the background colour of a toolbar in ExtJS4

Question

I am trying to change the background color of a toolbar. Right now, I am having ext-classic theme. I want toolbar background color to be dark blue, but this color change should NOT be applicable for all the toolbar's being created. Can someone guide me on how I can do this particular thing?

Thanks in advance..

Answer 1

You also can try using "style" config option.

Ext.define 'App.your_package.CustomToolbar',
    extend: 'Ext.toolbar.Toolbar'
    xtype: 'my-custom-toolbar'
    style: 'background-color: #112D41;'

Cheers!

Answer 2

use cls config

Ext.create('Ext.toolbar.Toolbar', {
    ...,
    cls: 'myBgCls',
    ...

and then css to change background:

.myBgCls{
    background: blue;
}