I'm trying to change the background color of a Treepanel in extjs 4. So far I've created a custom css class with the desired color and applied it to the panel and its view
{
baseCls: "mycustomclass",
viewConfig: {baseCls: "mycustomclass"}
(...)
}
And this code sets the background of the panel area everywhere but for the tree nodes. Tree nodes are still white. So my question is how to set the background color of the entire tree panel, including nodes.
here's a screenshot of how it looks like - the greenish color is my treepanel area. The nodes also belong to treepanel but are white
I have found a solution and here it is:
.navpanel
{
background-color: #c0c0c0;
}
.navpanel .x-grid-cell
{
background-color:#c0c0c0;
}
.navpanel .x-grid-row-selected .x-grid-cell, .x-grid-row-selected .x-grid-rowwrap-div
{
background-color:#f0f0f0 !important;
font-weight: bold;
}
The 'navpanel' class is applied to my treepanel's view (via viewConfig). All other classes are overrides to standard extjs css so they need to be loaded after extjs css. Google Chrome's 'inspect element' function was very helpful here.