1. #1
    Ext JS Premium Member Asken's Avatar
    Join Date
    Feb 2010
    Location
    sweden
    Posts
    117
    Answers
    2
    Vote Rating
    0
    Asken is an unknown quantity at this point

      0  

    Default Answered: Theming a tree node

    Answered: Theming a tree node


    Hi,

    I want to make the tree node bold (or different color or something) if selected rather than showing the whole row in the tree panel.

    I'm using the theming stuff to do everything but I can't find a "selected-node"-variable to change.

    Anyone knows how to change?

    (And it's also really annoying that the forum changes to Japanese all the time. Any way to make the English (US) stick?)

    Regards,
    Kristian

  2. Adding the cls is only necessary to isolate the styling to a single tree. If you want to style all trees that way (as you might in a theme) then just don't include the cls and adjust the CSS selector accordingly.

  3. #2
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,581
    Answers
    540
    Vote Rating
    319
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      0  

    Default


    Here's an example of doing it with normal CSS:

    Code:
    Ext.create('Ext.tree.Panel', { 
        cls: 'custom-select', 
        ...
    });
    Code:
    .custom-select .x-grid-row-selected .x-grid-cell {
        color: #900;
    }
    The entry in the theming stuff seems to be this section from _grid.scss:

    Code:
    .#{$prefix}grid-row-selected .#{$prefix}grid-cell,
    .#{$prefix}grid-row-selected .#{$prefix}grid-rowwrap-div {
        border-style: $grid-row-cell-selected-border-style;
        border-color: $grid-row-cell-selected-border-color;
    
        background-color: $grid-row-cell-selected-background-color !important;
    }
    Doesn't look like there's a variable for the color but there's no reason you can't add one to your custom theme.

  4. #3
    Ext JS Premium Member Asken's Avatar
    Join Date
    Feb 2010
    Location
    sweden
    Posts
    117
    Answers
    2
    Vote Rating
    0
    Asken is an unknown quantity at this point

      0  

    Default


    Code:
    Ext.create('Ext.tree.Panel', { 
        cls: 'custom-select', 
        ...
    });
    That's what I don't want to do... Seems there is no way of doing this vanilla-style.

  5. #4
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,581
    Answers
    540
    Vote Rating
    319
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      0  

    Default


    Adding the cls is only necessary to isolate the styling to a single tree. If you want to style all trees that way (as you might in a theme) then just don't include the cls and adjust the CSS selector accordingly.

Thread Participants: 1

Tags for this Thread

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi