Accordion Table

<table class="table">
    <caption class="sr-only"></caption>
    <thead>
        <tr>
            <th scope="col" width="1"></th>
            <th scope="col">Aanvraag/melding</th>
            <th scope="col">Status</th>
            <th scope="col">Ingediend</th>
            <th scope="col">Type</th>
            <th scope="col" width="50"></th>
            <th scope="col" width="250"></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th scope="row">
                <button type="button" title="Open" class="btn btn-link">
                    <span class="sr-only">Open</span><svg class="di di-chevron-down">
                        <use href="../../dso-icons.svg#chevron-down" />
                    </svg>
                </button>
            </th>
            <td>Vergunning kappen</td>
            <td>Verzonden</td>
            <td>21/11/2017</td>
            <td>Aanvraag</td>
            <td class="text-center">2 <svg class="di di-paperclip">
                    <use href="../../dso-icons.svg#paperclip" />
                </svg></td>
            <td class="text-right">
                <button type="button" title="Bewerk" class="btn btn-link">
                    <span class="sr-only">Bewerk</span><svg class="di di-pencil">
                        <use href="../../dso-icons.svg#pencil" />
                    </svg>
                </button>
                <button type="button" title="Opnieuw" class="btn btn-link">
                    <span class="sr-only">Opnieuw</span><svg class="di di-redo">
                        <use href="../../dso-icons.svg#redo" />
                    </svg>
                </button>
                <button type="button" title="Kopieer" class="btn btn-link">
                    <span class="sr-only">Kopieer</span><svg class="di di-copy">
                        <use href="../../dso-icons.svg#copy" />
                    </svg>
                </button>
                <button type="button" title="Verwijder" class="btn btn-link">
                    <span class="sr-only">Verwijder</span><svg class="di di-trash">
                        <use href="../../dso-icons.svg#trash" />
                    </svg>
                </button>
            </td>
        </tr>
        <tr>
            <th scope="row">
                <button type="button" title="Open" class="btn btn-link active">
                    <span class="sr-only">Open</span><svg class="di di-chevron-up">
                        <use href="../../dso-icons.svg#chevron-up" />
                    </svg>
                </button>
            </th>
            <td>Boom 23 kappen</td>
            <td>
                <button type="button" class="btn btn-link">
                    <svg class="di di-angle-right">
                        <use href="../../dso-icons.svg#angle-right" />
                    </svg><span>Openen</span>
                </button>
            </td>
            <td>15/10/2017</td>
            <td>Verzoek</td>
            <td class="text-center">7 <svg class="di di-paperclip">
                    <use href="../../dso-icons.svg#paperclip" />
                </svg></span></td>
            <td class="text-right">
                <button type="button" title="Bewerk" class="btn btn-link">
                    <span class="sr-only">Bewerk</span><svg class="di di-pencil">
                        <use href="../../dso-icons.svg#pencil" />
                    </svg>
                </button>
                <button type="button" title="Opnieuw" class="btn btn-link">
                    <span class="sr-only">Opnieuw</span><svg class="di di-redo">
                        <use href="../../dso-icons.svg#redo" />
                    </svg>
                </button>
                <button type="button" title="Kopieer" class="btn btn-link">
                    <span class="sr-only">Kopieer</span><svg class="di di-copy">
                        <use href="../../dso-icons.svg#copy" />
                    </svg>
                </button>
                <button type="button" title="Verwijder" class="btn btn-link">
                    <span class="sr-only">Verwijder</span><svg class="di di-trash">
                        <use href="../../dso-icons.svg#trash" />
                    </svg>
                </button>
            </td>
        </tr>
        <tr>
            <td colspan="7" class="text-center" style="line-height: 300px;">
                Container cel
            </td>
        </tr>
        <tr>
            <th scope="row">
                <button type="button" title="Open" class="btn btn-link">
                    <span class="sr-only">Open</span><svg class="di di-chevron-down">
                        <use href="../../dso-icons.svg#chevron-down" />
                    </svg>
                </button>
            </th>
            <td>Pand 24 slopen</td>
            <td>Aangevuld</td>
            <td>13/09/2017</td>
            <td>Melding</td>
            <td class="text-center">6 <svg class="di di-paperclip">
                    <use href="../../dso-icons.svg#paperclip" />
                </svg></span></td>
            <td class="text-right">
                <button type="button" title="Kopieer" class="btn btn-link">
                    <span class="sr-only">Kopieer</span><svg class="di di-copy">
                        <use href="../../dso-icons.svg#copy" />
                    </svg>
                </button>
                <button type="button" title="Verwijder" class="btn btn-link">
                    <span class="sr-only">Verwijder</span><svg class="di di-trash">
                        <use href="../../dso-icons.svg#trash" />
                    </svg>
                </button>
            </td>
        </tr>
        <tr>
            <th scope="row">
                <button type="button" title="Open" class="btn btn-link">
                    <span class="sr-only">Open</span><svg class="di di-chevron-down">
                        <use href="../../dso-icons.svg#chevron-down" />
                    </svg>
                </button>
            </th>
            <td>Kerkstraat 10 tuin uitgraven</td>
            <td>Ingetrokken</td>
            <td>11/07/2017</td>
            <td>Aanvraag</td>
            <td></td>
            <td class="text-right">
                <button type="button" title="Verwijder" class="btn btn-link">
                    <span class="sr-only">Verwijder</span><svg class="di di-trash">
                        <use href="../../dso-icons.svg#trash" />
                    </svg>
                </button>
            </td>
        </tr>
        <tr>
            <th scope="row">
                <button type="button" title="Open" class="btn btn-link">
                    <span class="sr-only">Open</span><svg class="di di-chevron-down">
                        <use href="../../dso-icons.svg#chevron-down" />
                    </svg>
                </button>
            </th>
            <td>Grote Markt 31 kabels leggen</td>
            <td>Concept</td>
            <td>28/06/2017</td>
            <td>Aanvraag</td>
            <td></td>
            <td class="text-right">
                <button type="button" title="Verwijder" class="btn btn-link">
                    <span class="sr-only">Verwijder</span><svg class="di di-trash">
                        <use href="../../dso-icons.svg#trash" />
                    </svg>
                </button>
            </td>
        </tr>
    </tbody>
</table>