How do you change the color of the second grouped item header in a list view

Question

I have a list that is grouped by Building and then by Room.I can use json to change the color of the headers as follows:&nbsp;&nbsp;"groupProps": {
        "hideFooter":true,
      "headerFormatter": {
        "elmType": "div",
        "style": {
           "background-color": "blue"
        },&nbsp;&nbsp;This makes Building header and Room header both blue. I would like to make the Room header a lighter colour of blue. Is this possible?&nbsp;&nbsp;

thomasakalowski · Accepted Answer

jellybeancooper&nbsp;&nbsp;You can use a condition on the field name for this.&nbsp;  "groupProps": {
    "hideFooter": true,
    "headerFormatter": {
      "elmType": "div",
      "attributes": {
        "class": "sp-row-card"
      },
      "style": {
        "background-color": "=if(@group.columnDisplayName == 'Building','blue','lightblue')",
        "color": "white"
      }
    }
  }&nbsp;&nbsp;

Forum Discussion

How do you change the color of the second grouped item header in a list view

1 Reply

Resources