// 20230303120054
// https://raw.githubusercontent.com/pnp/List-Formatting/master/view-samples/custom-header/custom-header.json

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/row-formatting.schema.json",
  "hideColumnHeader": true,
  "hideSelection": true,
  "rowFormatter": {
    "elmType": "div",
    "style": {
      "display": "flex",
      "flex-direction": "column",
      "align-items": "flex-start"
    },
    "children": [
      {
        "elmType": "div",
        "attributes": {
          "class": "ms-bgColor-themePrimary ms-fontColor-white"
        },
        "style": {
          "display": "=if(@rowIndex == 0, 'flex', 'none')",
          "font-weight": "bold",
          "font-size": "18px",
          "width": "100%",
          "padding": "4px"
        },
        "children": [
          {
            "elmType": "div",
            "txtContent": "Title",
            "style": {
              "flex-grow": "1"
            }
          },
          {
            "elmType": "div",
            "txtContent": "Deployed",
            "style": {
              "width": "100px"
            }
          }
        ]
      },
      {
        "elmType": "div",
        "attributes": {
          "class": "ms-borderColor-neutralQuaternary"
        },
        "style": {
          "display": "flex",
          "font-size": "16px",
          "width": "100%",
          "padding": "0 4px",
          "border-bottom-width": "1px",
          "border-bottom-style": "solid"
        },
        "children": [
          {
            "elmType": "div",
            "txtContent": "[$Title]",
            "style": {
              "flex-grow": "1"
            }
          },
          {
            "elmType": "div",
            "txtContent": "=toLocaleDateString([$Deployed])",
            "attributes": {
              "class": "=if([$Active], '', 'ms-fontColor-redDark')"
            },
            "style": {
              "width": "100px"
            }
          }
        ]
      }
    ]
  }
}