{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/row-formatting.schema.json",
  "hideSelection": false,
  "formatter": {
    "elmType": "div",
    "attributes": {
      "class": "sp-card-container sp-card-container-noPadding"
    },
    "children": [
      {
        "elmType": "div",
        "attributes": {
          "class": "ms-bgColor-white sp-css-borderColor-neutralLight sp-card-borderHighlight sp-card-subContainer sp-card-subContainer-borderRadius"
        },
        "children": [
          {
            "elmType": "div",
            "style": {
              "padding": "10px"
            },
            "attributes": {
              "iconName": "DoubleChevronUp"
            },
            "txtContent": "Move to Top",
            "customRowAction": {
              "action": "setValue",
              "actionInput": {
                "Order0": "=Number(@now)"
              }
            }
          },
          {
            "elmType": "div",
            "children": [
              {
                "elmType": "p",
                "attributes": {
                  "class": "ms-fontColor-neutralSecondary sp-card-label sp-card-boldText"
                },
                "txtContent": "[!Title.DisplayName]"
              },
              {
                "elmType": "p",
                "attributes": {
                  "title": "[$Title]",
                  "class": "ms-fontColor-neutralPrimary sp-card-content sp-card-highlightedContent",
                  "role": "heading",
                  "aria-level": "3"
                },
                "txtContent": "=if ([$Title] == '', '–', [$Title])"
              }
            ],
            "attributes": {
              "class": "sp-card-displayColumnContainer"
            }
          },
          {
            "elmType": "div",
            "style": {
              "display": "=if ([$Image] == '', 'none', '')"
            },
            "children": [
              {
                "elmType": "p",
                "attributes": {
                  "class": "ms-fontColor-neutralSecondary sp-card-label sp-card-boldText"
                },
                "children": [
                  {
                    "elmType": "div",
                    "style": {
                      "display": "inline-block",
                      "font-size": "20px"
                    },
                    "attributes": {
                      "iconName": "=if([$Expand] == true, 'Blocked2','CirclePlus')"
                    },
                    "customRowAction": {
                      "action": "setValue",
                      "actionInput": {
                        "Expand": "=if([$Expand] == true, 0,1)"
                      }
                    }
                  },
                  {
                    "elmType": "div",
                    "style": {
                      "display": "inline-block",
                      "padding-left": "5px"
                    },
                    "attributes": {
                      "class": "ms-fontColor-neutralSecondary sp-card-label sp-card-boldText"
                    },
                    "txtContent": "[!Image.DisplayName]"
                  }
                ]
              },
              {
                "elmType": "img",
                "style": {
                  "display": "=if([$Expand] == true, '','none')",
                  "width": "80px"
                },
                "attributes": {
                  "src": "[$Image]",
                  "title": "[$Image]",
                  "class": "ms-fontColor-neutralPrimary"
                }
              }
            ],
            "attributes": {
              "class": "sp-card-displayColumnContainer"
            }
          },
          {
            "elmType": "div",
            "style": {
              "display": "none"
            },
            "children": [
              {
                "elmType": "p",
                "attributes": {
                  "class": "ms-fontColor-neutralSecondary sp-card-label sp-card-boldText"
                },
                "txtContent": "[!Category.DisplayName]"
              },
              {
                "elmType": "div",
                "attributes": {
                  "class": "sp-card-content sp-card-formatterRef"
                },
                "children": [
                  {
                    "columnFormatterReference": "[$Category]"
                  }
                ]
              }
            ],
            "attributes": {
              "class": "sp-card-displayColumnContainer"
            }
          },
          {
            "elmType": "div",
            "style": {
              "display": "none"
            },
            "children": [
              {
                "elmType": "p",
                "attributes": {
                  "class": "ms-fontColor-neutralSecondary sp-card-label sp-card-boldText"
                },
                "txtContent": "[!Order0.DisplayName]"
              },
              {
                "elmType": "p",
                "style": {
                  "display": "none"
                },
                "attributes": {
                  "title": "[$Order0]",
                  "class": "ms-fontColor-neutralPrimary sp-card-content"
                },
                "txtContent": "=if ([$Order0] == '', '–', [$Order0])"
              }
            ],
            "attributes": {
              "class": "sp-card-displayColumnContainer"
            }
          },
          {
            "elmType": "div",
            "style": {
              "display": "none"
            },
            "children": [
              {
                "elmType": "p",
                "attributes": {
                  "class": "ms-fontColor-neutralSecondary sp-card-label sp-card-boldText"
                },
                "txtContent": "[!Expand.DisplayName]"
              },
              {
                "elmType": "p",
                "attributes": {
                  "title": "=if ([$Expand.displayValue] == '', '–', [$Expand.displayValue])",
                  "class": "ms-fontColor-neutralPrimary sp-card-content"
                },
                "txtContent": "=if ([$Expand.displayValue] == '', '–', [$Expand.displayValue])"
              }
            ],
            "attributes": {
              "class": "sp-card-displayColumnContainer"
            }
          }
        ]
      }
    ]
  }
}