Sub-cell scrolling

[texodus]

Implements sub-cell scrolling and makes this the default for material.css theme. This is done via CSS and 4 new custom CSS properties which are applied to the root <table> element via a shadow DOM ::slotted rule. These new properties export the sub-cell offset values, which can then be used by the theme.

This can be implemented outside of the material.css theme with the new sub-cell-scrolling.css theme, which implement just the CSS offset and clipping:

/* Scroll the headers left */
tbody td,
thead th:not(.rt-group-corner) {
    transform: translate(var(--regular-table--transform-x, 0px), 0);
}

/* Scroll the body content and row-headers up */
tbody {
    transform: translate(0, var(--regular-table--transform-y, 0px));
}

/* Clip the first row */
tbody tr:first-child {
    td, th {
        clip-path: polygon(
            0 var(--regular-table--clip-y, 0),
            0 100%,
            100% 100%,
            100% var(--regular-table--clip-y, 0)
        );
    }
}

/* Clip the first column */
tbody tr td:first-of-type {
    clip-path: polygon(
        var(--regular-table--clip-x, 0) 0,
        var(--regular-table--clip-x, 0) 100%,
        100% 100%,
        100% 0
    );
}

/* Clip the upper left corner on both sides */
tbody tr:first-child td:first-of-type {
    clip-path: polygon(
        var(--regular-table--clip-x, 0) var(--regular-table--clip-y, 0),
        var(--regular-table--clip-x, 0) 100%,
        100% 100%,
        100% var(--regular-table--clip-y, 0)
    );
}