How can you customize list headers in a modern page? (View Formatting)

So, I found a kind of ugly way to do what I needed by adding titles to every record block and then hiding them if they're not the first display row. 

"display": "=if(@rowIndex == 0, 'flex', 'none')",

Here''s the raw list:

Formatted "pseudo-headers" and data.

Unfortunately, the headers aren't responsive, it's not inherited by QuickEdit and it's missing the sorts and filtering of the real headers. But you could conceivably add the code to do it if needed. They also aren't sticky/floating. But it's still functional for what I needed. 

The full json view formatting for the example is below. 

{
    "$schema": "<a href="<a href="https://developer.microsoft.com/json-schemas/sp/view-formatting.schema.json" target="_blank">https://developer.microsoft.com/json-schemas/sp/view-formatting.schema.json</a>" target="_blank"><a href="https://developer.microsoft.com/json-schemas/sp/view-formatting.schema.json</a" target="_blank">https://developer.microsoft.com/json-schemas/sp/view-formatting.schema.json</a</a>>",
    "hideSelection": true,
    "hideColumnHeader": true,
    "rowFormatter": {
        "elmType": "div",
        "_comment_": "div-RecBlock",
        "style": {
            "display": "flex",
            "flex-direction": "column",
            "flex-wrap": "nowrap",
            "flex-align": "flex-start",
            "text-align": "center",
            "width": "250px",
            "margin-bottom": "10px",
            "background-color": "lightgrey",
            "border-radius": "8px"
        },
        "children": [
            {
                "elmType": "div",
                "_comment_": "div-title-row",
                "style": {
                    "display": "=if(@rowIndex == 0, 'flex', 'none')",
                    "flex-direction": "row",
                    "flex-wrap": "nowrap",
                    "background-color": "blue",
                    "color" : "white",
                    "font-weight": "bold",
                    "border-radius": "4px"
                },
                "children": [
                    {
                        "elmType": "div",
                        "_comment_": "div-title-col1",
                        "txtContent": "Index",
                        "style": {
                            "width": "40px"
                        }
                    },
                    {
                        "elmType": "div",
                        "_comment_": "div-title-col2",
                        "txtContent": "Text",
                        "style": {
                            "width": "210px"
                        }
                    }
                ]
            },
            {
                "elmType": "div",
                "_comment_": "div-data-row1",
                "style": {
                    "display": "flex",
                    "flex-direction": "row",
                    "flex-wrap": "nowrap"
                 },
                "children": [
                    {
                        "elmType": "div",
                        "_comment_": "div-data-col1",
                        "txtContent": "=[$ID]",
                        "style": {
                            "width": "40px"
                        }
                    },
                    {
                        "elmType": "div",
                        "_comment_": "div-col-col2",
                        "txtContent": "=[$Title]",
                        "style": {
                            "width": "210px"
                        }
                    }
                ]
            },
            {
                "elmType": "div",
                "_comment_": "div-data-row2",
                "style": {
                    "display": "flex",
                    "flex-direction": "row",
                    "flex-wrap": "nowrap"
                 },
                "children": [
                    {
                        "elmType": "div",
                        "_comment_": "div-data-col1",
                        "txtContent": " ",
                        "style": {
                            "width": "40px"
                        }
                    },
                    {
                        "elmType": "div",
                        "_comment_": "div-col-col2",
                        "txtContent": "=[$Line2]",
                        "style": {
                            "width": "210px"
                        }
                    }
                ]
            },
            {
                "elmType": "div",
                "_comment_": "div-data-row3",
                "style": {
                    "display": "flex",
                    "flex-direction": "row",
                    "flex-wrap": "nowrap"
                 },
                "children": [
                    {
                        "elmType": "div",
                        "_comment_": "div-data-col1",
                        "txtContent": " ",
                        "style": {
                            "width": "40px"
                        }
                    },
                    {
                        "elmType": "div",
                        "_comment_": "div-col-col2",
                        "txtContent": "=[$line3]",
                        "style": {
                            "width": "210px"
                        }
                    }
                ]
            }

        ]
    }
}

In case you're wondering, this is what I was trying to produce:

It's not pretty, but I'm trying to get a team onto sharepoint and this what they're used to seeing in the old system. Baby steps. When they click on the "site name", it invokes EditProps which takes them to a more "SharePoint-esque" PowerApps form.