{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/row-formatting.schema.json",
  "hideColumnHeader": true,
  "rowFormatter": {
    "elmType": "div",
    "style": {
      "text-align": "left",
      "font-family": "Segoe UI",
      "padding": "12px 0px 10px 3px",
      "display": "flex",
      "width": "=if(@window.innerWidth > 480, '750px', '310px')"
    },
    "children": [
      {
        "elmType": "div",
        "style": {
          "flex": "1"
        },
        "children": [
          {
            "elmType": "a",
            "style": {
              "display": "=if(@window.innerWidth > 480, 'none', 'block')",
              "flex": "1",
              "font-size": "14px",
              "color": "#444444",
              "line-height": "19px",
              "font-weight": "600"
            },
            "attributes": {
              "href": "=@currentWeb+'/Lists/Milestone/AllItems.aspx?FilterField1=Project&FilterValue1='+[$Project_x0020_Title]"
            },
            "txtContent": "[$Project_x0020_Title]"
          },
          {
            "elmType": "div",
            "style": {
              "display": "=if(@window.innerWidth > 480, 'block', 'none')",
              "flex": "1",
              "font-size": "14px",
              "color": "#444444",
              "line-height": "19px",
              "font-weight": "600"
            },
            "txtContent": "[$Project_x0020_Title]"
          },
          {
            "elmType": "div",
            "style": {
              "display": "=if(@window.innerWidth > 480, 'none', 'block')",
              "font-size": "16px",
              "line-height": "21px",
              "font-weight": "600",
              "color": "#605e5c"
            },
            "children": [
              {
                "elmType": "div",
                "txtContent": "='$'+[$Total]"
              }
            ]
          },
          {
            "elmType": "div",
            "style": {
              "font-size": "12px",
              "color": "#605e5c",
              "font-weight": "normal",
              "line-height": "16px"
            },
            "children": [
              {
                "elmType": "span",
                "style": {
                  "font-weight": "600"
                },
                "txtContent": "Status: "
              },
              {
                "elmType": "span",
                "style": {
                  "color": {
                    "operator": "?",
                    "operands": [
                      {
                        "operator": "==",
                        "operands": [
                          "Completed",
                          "[$Project_x0020_Status]"
                        ]
                      },
                      "#107c10",
                      {
                        "operator": "?",
                        "operands": [
                          {
                            "operator": "==",
                            "operands": [
                              "Not Started",
                              "[$Project_x0020_Status]"
                            ]
                          },
                          "#a80000",
                          "#737373"
                        ]
                      }
                    ]
                  }
                },
                "txtContent": "[$Project_x0020_Status]"
              }
            ]
          }
        ]
      },
      {
        "elmType": "div",
        "attributes": {
          "iconName": "=if([$Project_x0020_Status] == 'Completed', 'Completed', if([$Project_x0020_Status] == 'Not Started', 'Warning', ''))"
        },
        "style": {
          "display": "flex",
          "text-align": "center",
          "align-items": "center",
          "padding-right": "14px",
          "font-size": "16px",
          "color": {
            "operator": "?",
            "operands": [
              {
                "operator": "==",
                "operands": [
                  "Completed",
                  "[$Project_x0020_Status]"
                ]
              },
              "#107c10",
              {
                "operator": "?",
                "operands": [
                  {
                    "operator": "==",
                    "operands": [
                      "Not Started",
                      "[$Project_x0020_Status]"
                    ]
                  },
                  "#a80000",
                  "transparent"
                ]
              }
            ]
          }
        }
      },
      {
        "elmType": "div",
        "style": {
          "display": "=if(@window.innerWidth > 480, 'flex', 'none')",
          "align-items": "center",
          "font-size": "16px",
          "line-height": "21px",
          "font-weight": "600",
          "color": "#605e5c",
          "width": "80px"
        },
        "children": [
          {
            "elmType": "div",
            "txtContent": "='$'+[$Total]"
          }
        ]
      }
    ]
  }
}