Treegrid - modify text style for some rows

[david.ln]

Hello,

I'm trying to change row style in a treegrid only for some rows.
Based on some logic, I want to gray the text and/or make it italic.
I found some posts for background colors but not for text.

I first tried to override render in TreeGridCellRenderer:

@Override
    public Object render(final ModelData model, String property, final ColumnData config,
            final int rowIndex, final int colIndex, ListStore<ModelData> store, final Grid<ModelData> grid) {
        
Scheduler.get().scheduleDeferred(new ScheduledCommand() {
            
            @Override
            public void execute() {
                if(model != null) {
                    
                    Object myBoolean = model.get("myboolean");
                    if(myBoolean != null && ((Boolean)myBoolean)) {
                        grid.getView().getRow(rowIndex).getStyle().setColor("gray");
                        //here I cannot find any way to set the text as italic for the row
                        // I also trid with config.style=".." but it seems to work cell only  for backgroud color           
                    } 

                }
                
            }
        });

        return super.render(model, property, config, rowIndex, colIndex, store, grid);
    }

This works for the "color" attribute. (note that I had to remove color:black from gxt css for x-tree3-node-text)
but using the deferred command create a tiny - but visible - latency in style update.

Then I tried to use a GridViewConfig

tree.getView().setViewConfig(new GridViewConfig(){

StringBuilder sb = new StringBuilder();
        
        if(model != null) {
            
            Object myBoolean = model.get("myboolean");
            if(myBoolean != null && ((Boolean)myBoolean)) {
                sb.append(" inactive"); // css : .inactive {    color:gray; }
            }
            
            Object myBoolean2 = model.get("myboolean2");
             if(myBoolean2 != null && ((Boolean)myBoolean2)) {
                sb.append(" noSelectable"); // .noSelectable {   font-style:italic; }
            }
        }
});

        return super.render(model, property, config, rowIndex, colIndex, store, grid);
}

This works better (no latency) for the gray color but still not for italic.
The style applies on <tr> (in firebug) but seems to be overriden by text style of the cells (?). The computed style is italic for text from row start <div> to the first <td> in which it is normal.

For this <td> in firebug, if i remove (even just the 11px)

.x-grid3-hd-row .x-grid3-hd, .x-grid3-row .x-grid3-cell, .x-grid3-summary-row .x-grid3-cell {
    font: 11px arial,tahoma,helvetica,sans-serif;
}

I got italic on all columns of the required row but not for the tree cell. And the text lose its size ...
I cannot find any css to remove or add to have the tree cell in italic ...

I think I saw something about using a widget renderer for the tree cell styling but it makes too much code for a so simple use case. So I didn't try.

What should I do ? I really miss CSS skill and I guess I'm not so far of the solution ...
Should I remove the text style for cells (how ?)

Hope someone will have an idea !

Regards

David

[david.ln]

Hello,

I finally managed to change the font style of the row with GridViewConfig but I had to modify the css

.x-grid3-hd-row .x-grid3-hd,.x-grid3-row .x-grid3-cell,.x-grid3-summary-row .x-grid3-cell {
  /*font: normal 11px arial, tahoma, helvetica, sans-serif;*/
  font-size:11px;
}

.x-tree3-node-text {
    /*font: normal 11px arial, tahoma, helvetica, sans-serif;*/
    /*color: black;*/
}

Is there a cleaner way to achieve that ?
Can I override these styles differently or somewhere else ?