Changing TreePanel background color

  1. #1

    Changing TreePanel background color

    Hi there,

    I have a question regarding the background color of the TreePanel. As far as I understand, it is transparent by default, whereas the GridPanel has a white background. To have a consistent look, I'd like to change the background color of the tree to the same color. Easy so far (I think, didn't try though - I know how to use CSS in general). But the real question is: how to I change the color of the tree to be the same as the grid in the currently selected theme? I mean, if the use chooses "Access" as the color theme, I want the tree background to be the same dark blue (or whatever that is) as the grid is.

    Can this be done?
  2. #2
    Hi again,

    related to the above question: How does one make changes to the appearance of elements be *theme aware* in general? Right now, I need a tool button in my panel for sending email, but there's no default icon for that. Creating one isn't the problem as well. But again, how do I do it if I want to make it fit the currently selected theme?
  3. #3
    Quote Originally Posted by wexman View Post
    Hi there,

    I have a question regarding the background color of the TreePanel. As far as I understand, it is transparent by default, whereas the GridPanel has a white background. To have a consistent look, I'd like to change the background color of the tree to the same color. Easy so far (I think, didn't try though - I know how to use CSS in general). But the real question is: how to I change the color of the tree to be the same as the grid in the currently selected theme? I mean, if the use chooses "Access" as the color theme, I want the tree background to be the same dark blue (or whatever that is) as the grid is.

    Can this be done?
    Considering that your TreePanel has and ID of myTreePanel add the following css rule:

    #myTreePanel .x-panel-body
    {
       background-color: Yellow;//Replace with your color
    }
  4. #4
    Quote Originally Posted by wexman View Post
    Hi again,

    related to the above question: How does one make changes to the appearance of elements be *theme aware* in general? Right now, I need a tool button in my panel for sending email, but there's no default icon for that. Creating one isn't the problem as well. But again, how do I do it if I want to make it fit the currently selected theme?
    Add the property IconCls to the object that you want to use a custom icon, eg:

    <ext:MenuItem Text="Send Mail" IconCls="sendMailIcon">
    </ext:MenuItem>
    Add the CSS class:

    .sendMailIcon
    {
       background-image: url('Images/mail.gif');
       background-repeat: no-repeat;
    }

Similar Threads

  1. Replies: 7
    Last Post: Jul 11, 2012, 1:12 PM
  2. [CLOSED] GridPanel.Rows.Changing Background Color of Rows
    By supera in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Mar 01, 2012, 5:18 PM
  3. [CLOSED] Changing the background color of htmleditor
    By SymSure in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jan 18, 2012, 5:41 PM
  4. Replies: 1
    Last Post: Nov 24, 2011, 6:48 AM
  5. [CLOSED] Changing background color of TabPanel on the fly
    By rmelancon in forum 1.x Legacy Premium Help
    Replies: 6
    Last Post: Oct 07, 2010, 12:23 PM

Posting Permissions