cssClassPrefix overrides resource tree backColor

It looks like a style definition problem. The style from the theme seems to get a higher priority in this case.

What CSS do you use for the green background for the grid cells? You may want to add !important or use a more specific selector.

The green background is coming from the resources array backColor setting.

dp.resources = [
    { name: "Example", id: "Example", expanded: true, 'backColor' => "#5CB673", children:[
        { name : "Tool 1", id : "Tool1" },
        { name : "Tool 2", id : "Tool2" }
      ] 
    }
]

I'm using a custom css that i created from the theme designer...which when I enable, it overrides the backColor from resources array...

Can you tell me the css class i would have to set z-index lower for the css sheet or vice versa for resources backColor ?

The resources[].backColor property only affects the row header (on the left side). The background of the grid cells needs to be set using onBeforeCellRender event handler - how does your implementation look like?

Well... it did make all cells at the top green if i don't use a custom theme... maybe it's because it's the parent resource that backColor fills in all the cells on the same row?

dp.onBeforeCellRender = function(args) {
  var cellDate = moment(args.cell.start.value).format("YYYY-MM-DD");
  
  if (jQuery.inArray(cellDate, holidayArr) !== -1) {
    
    args.cell.backColor = "#FF9595";
    args.cell.html = "<div style='text-align: center; font-weight: bold; color: #7A7A7A;'>** HOLIDAY **</div>";
  }
};

You can extend your onBeforeCellRender like this to apply the green background color:

dp.onBeforeCellRender = function(args) {

   var row = dp.rows.find(args.cell.resource);
   if (row.data.backColor) {
     args.cell.backColor = row.data.backColor;
   }

  var cellDate = moment(args.cell.start.value).format("YYYY-MM-DD");
  
  if (jQuery.inArray(cellDate, holidayArr) !== -1) {
    
    args.cell.backColor = "#FF9595";
    args.cell.html = "<div style='text-align: center; font-weight: bold; color: #7A7A7A;'>** HOLIDAY **</div>";
  }
};

The parent rows are marked with "scheduler_default_cellparent" class. Maybe you have added the green background this way? When you apply a theme this class changes to "yourtheme_cellparent".

Yep that works. Thanks!!

Great, thanks for the update!