<h6>Responsive Table</h6>
<table class="responsive-table">
            <th>Anim pariatur cliche reprehenderit, enim eiusmod high life</th>
            <td>Chief Sandwich Eater</td>
            <td>Lettuce Green</td>
            <td>Crimefighter Sorta</td>
            <td>Giving Exploding Presents</td>
            <td>Sales Representative</td>
            <td>Under the couch</td>

Responsive table

This is a custom component, based on this demo.

Using responsive tables in HTML

To use the responsive tables we need a little bit of js to make it work properly on mobile.

    $('.responsive-table').each(function() {
        var headings = $(this).find('thead th').map(function() {
            return this.textContent;

        if (headings.length > 0) {
            $(this).find('tbody td').each(function(tdIdx) {
                this.setAttribute('data-title', headings[tdIdx % headings.length]);