Column formatting with a condition

%3CLINGO-SUB%20id%3D%22lingo-sub-275284%22%20slang%3D%22en-US%22%3EColumn%20formatting%20with%20a%20condition%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-275284%22%20slang%3D%22en-US%22%3E%3CP%3EI%20have%20a%20custom%20list%20in%20SharePoint%20online%20for%20a%20project%20dashboard%20that%20I'm%20creating.%26nbsp%3B%20I%20have%20some%20conditional%20formatting%20that%20changes%20the%20background%20colours%20based%20on%20Status%20(red%20for%20not%20started%2C%20orange%20for%20in%20progress%2C%20and%20green%20for%20completed).%26nbsp%3B%20I%20would%20also%20like%20the%20Project%20title%20to%20be%20in%20bold%20and%20sub%20tasks%20not%20to%20be%20in%20bold.%26nbsp%3B%20I%20have%20another%20field%20called%20Task%20Rank.%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EWhat%20I%20would%20like%20to%20do%20is%20have%20the%20following%3A%3C%2FP%3E%3CP%3Eif%20task%20rank%20%3D%201%2C%20make%20the%20task%20name%20show%20up%20as%20bold%2C%20otherwise%20don't%20do%20anything%2C%3C%2FP%3E%3CP%3Ethen%3C%2FP%3E%3CP%3Eif%20the%20status%20is%20completed%20make%20the%20background%20green%2C%20not%20started%20it%20is%20red%2C%20and%20in%20progress%20orange.%20%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EHere%20is%20the%20json%20for%20bold%3A%20%26nbsp%3B%3CBR%20%2F%3E%7B%3CBR%20%2F%3E%26nbsp%3B%20%22%24schema%22%3A%20%22%3CA%20href%3D%22http%3A%2F%2Fcolumnformatting.sharepointpnp.com%2FcolumnFormattingSchema.json%22%20target%3D%22_blank%22%20rel%3D%22nofollow%20noopener%20noreferrer%22%3Ehttp%3A%2F%2Fcolumnformatting.sharepointpnp.com%2FcolumnFormattingSchema.json%3C%2FA%3E%22%2C%3CBR%20%2F%3E%26nbsp%3B%20%22elmType%22%3A%20%22div%22%2C%3CBR%20%2F%3E%26nbsp%3B%20%22style%22%3A%20%7B%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22font-weight%22%3A%20%22bold%22%3CBR%20%2F%3E%26nbsp%3B%20%7D%2C%3CBR%20%2F%3E%26nbsp%3B%20%22txtContent%22%3A%20%22%40currentField%22%3CBR%20%2F%3E%7D%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EHere%20is%20the%20json%20for%20the%20background%20colour%3A%3CBR%20%2F%3E%7B%3CBR%20%2F%3E%26nbsp%3B%20%22%24schema%22%3A%20%22%3CSPAN%3E%3CA%20href%3D%22http%3A%2F%2Fcolumnformatting.sharepointpnp.com%2FcolumnFormattingSchema.json%22%20target%3D%22_blank%22%20rel%3D%22nofollow%20noopener%20noreferrer%22%3Ehttp%3A%2F%2Fcolumnformatting.sharepointpnp.com%2FcolumnFormattingSchema.json%3C%2FA%3E%3C%2FSPAN%3E%22%2C%3CBR%20%2F%3E%26nbsp%3B%20%22debugMode%22%3A%20true%2C%3CBR%20%2F%3E%26nbsp%3B%20%22elmType%22%3A%20%22div%22%2C%3CBR%20%2F%3E%26nbsp%3B%20%22txtContent%22%3A%20%22%40currentField%22%2C%3CBR%20%2F%3E%26nbsp%3B%20%22style%22%3A%20%7B%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22background-color%22%3A%20%7B%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22operator%22%3A%20%22%3F%22%2C%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22operands%22%3A%20%5B%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%7B%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22operator%22%3A%20%22%26lt%3B%22%2C%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22operands%22%3A%20%5B%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22%5B%24_x0025__x0020_Complete%5D%22%2C%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%220.5%22%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%5D%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%7D%2C%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22red%22%2C%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%7B%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22operator%22%3A%20%22%3F%22%2C%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22operands%22%3A%20%5B%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%7B%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22operator%22%3A%20%22%26lt%3B%22%2C%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22operands%22%3A%20%5B%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22%5B%24_x0025__x0020_Complete%5D%22%2C%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%221%22%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%5D%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%7D%2C%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22orange%22%2C%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22green%22%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%5D%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%7D%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%5D%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%7D%2C%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22color%22%3A%20%22white%22%2C%3CBR%20%2F%3E%26nbsp%3B%26nbsp%3B%26nbsp%3B%20%22padding-left%22%3A%20%2210px%22%3CBR%20%2F%3E%26nbsp%3B%20%7D%3CBR%20%2F%3E%7D%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EFinally%2C%20a%20screen%20shot%20of%20the%20current%20list%3A%20%26nbsp%3B%3CBR%20%2F%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20style%3D%22width%3A%20895px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Fgxcuf89792.i.lithium.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F57738iB6A80A7CD19AF9B4%2Fimage-size%2Flarge%3Fv%3D1.0%26amp%3Bpx%3D999%22%20alt%3D%22json.jpg%22%20title%3D%22json.jpg%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%3C%2FLINGO-BODY%3E
Occasional Contributor

I have a custom list in SharePoint online for a project dashboard that I'm creating.  I have some conditional formatting that changes the background colours based on Status (red for not started, orange for in progress, and green for completed).  I would also like the Project title to be in bold and sub tasks not to be in bold.  I have another field called Task Rank. 

 

What I would like to do is have the following:

if task rank = 1, make the task name show up as bold, otherwise don't do anything,

then

if the status is completed make the background green, not started it is red, and in progress orange.  

 

Here is the json for bold:  
{
  "$schema": "http://columnformatting.sharepointpnp.com/columnFormattingSchema.json",
  "elmType": "div",
  "style": {
    "font-weight": "bold"
  },
  "txtContent": "@currentField"
}

 

Here is the json for the background colour:
{
  "$schema": "http://columnformatting.sharepointpnp.com/columnFormattingSchema.json",
  "debugMode": true,
  "elmType": "div",
  "txtContent": "@currentField",
  "style": {
    "background-color": {
      "operator": "?",
      "operands": [
        {
          "operator": "<",
          "operands": [
            "[$_x0025__x0020_Complete]",
            "0.5"
          ]
        },
        "red",
        {
          "operator": "?",
          "operands": [
            {
              "operator": "<",
              "operands": [
                "[$_x0025__x0020_Complete]",
                "1"
              ]
            },
            "orange",
            "green"
          ]
        }
      ]
    },
    "color": "white",
    "padding-left": "10px"
  }
}

 

Finally, a screen shot of the current list:  
json.jpg

0 Replies