diff --git a/blocks/table/table.css b/blocks/table/table.css index 0ffee851..e5c30214 100644 --- a/blocks/table/table.css +++ b/blocks/table/table.css @@ -41,6 +41,11 @@ text-align: left; } +/* no header variant */ +.table.no-header table tbody tr { + border-top: 1px solid; +} + /* striped variant */ .table.striped tbody tr:nth-child(odd) { background-color: var(--overlay-background-color); diff --git a/blocks/table/table.js b/blocks/table/table.js index a93b8956..f545f382 100644 --- a/blocks/table/table.js +++ b/blocks/table/table.js @@ -14,13 +14,19 @@ export default async function decorate(block) { const table = document.createElement('table'); const thead = document.createElement('thead'); const tbody = document.createElement('tbody'); - table.append(thead, tbody); + + const header = !block.classList.contains('no-header'); + if (header) { + table.append(thead); + } + table.append(tbody); + [...block.children].forEach((child, i) => { const row = document.createElement('tr'); - if (i) tbody.append(row); - else thead.append(row); + if (header && i === 0) thead.append(row); + else tbody.append(row); [...child.children].forEach((col) => { - const cell = buildCell(i); + const cell = buildCell(header ? i : i + 1); cell.innerHTML = col.innerHTML; row.append(cell); });