Editor 2.08 - change background color on active row

Editor 2.08 - change background color on active row

asleasle Posts: 96Questions: 28Answers: 0

I have read through many posts about this but I am not able to change background color on active <tr>. I think there must be something from my own CSS since I can do this in the Editor-> demo files. I tried this:

table.dataTable tbody>tr.selected, table.dataTable tbody>tr>.selected {
    background-color: #acbad5 !important;
}

I see that the "sorting_1" <td> also needs to be styled and the <tr> is ODD or EVEN for stripe layout. I am confused. When I inspect the active <tr> in Chrome I can not see any background-color CSS, only a bunch of box-shadow rules. Where can I change the background color and font color of active row? In my page the active font color is white so I see nothing when inline editing the cell.

This seems to be the code in Editor 2 for the blue backgrounds and this is present so many places that I do not know where to override it. I also need the active cell that I am editing inline to be black.

box-shadow: inset 0 0 0 9999px rgb(13 110 253 / 92%);

Answers

  • allanallan Posts: 64,029Questions: 1Answers: 10,555 Site admin

    As of DataTables 1.12 we use box-shadow for row colour tinting and also row selection highlighting. That allows colours to be assigned to cells and rows without worrying about their side effects on the tinting / selection. See this blog announcement for more details.

    box-shadow is indeed the one to change if you want to change the select row colour.

    Allan

  • asleasle Posts: 96Questions: 28Answers: 0

    Hi I am looking at the Editor examples and there it uses "background-color" on the selected cell anbd not box-shadow. This is from the select.dataTables.min.css

    table.dataTable tbody>tr.selected, table.dataTable tbody>tr>.selected {
        background-color: #b0bed9;
    }
    

    It seems this rule is overridden because I get a blue background and white text with inline editing.

  • allanallan Posts: 64,029Questions: 1Answers: 10,555 Site admin

    You are right - the example on the home page is using an old version of Select. I'll get that updated.

    These examples all use the latest software.

    Allan

This discussion has been closed.