Add space between buttons

This commit is contained in:
Christopher Cookman 2025-12-20 20:08:37 -07:00
parent 31800360d2
commit 717c4499ba

View file

@ -40,52 +40,52 @@
<div class="container-fluid d-flex justify-content-center align-items-center min-vh-100">
<div>
<table class="table table-borderless table-sm">
<thead>
<tr>
<% for (let c = 0; c < numCols; c++) { %>
<th class="text-left">
<h3><%= cols[c] || '' %></h3>
</th>
<% } %>
</tr>
</thead>
<tbody>
<% chunks.forEach((row) => { %>
<tr>
<% for (let c = 0; c < numCols; c++) {
const cell = row[c] || {};
const isBlank = Object.keys(cell).length === 0;
%>
<td class="text-left">
<% if (isBlank) { %>
<!-- blank space -->
<% } else {
const ctx = cell.context || {};
<table class="table table-borderless table-sm">
<thead>
<tr>
<% for (let c = 0; c < numCols; c++) { %>
<th class="text-left p-2">
<h3><%= cols[c] || '' %></h3>
</th>
<% } %>
</tr>
</thead>
<tbody>
<% chunks.forEach((row) => { %>
<tr>
<% for (let c = 0; c < numCols; c++) {
const cell = row[c] || {};
const isBlank = Object.keys(cell).length === 0;
%>
<td class="text-left p-2">
<% if (isBlank) { %>
<!-- blank space -->
<% } else {
const ctx = cell.context || {};
%>
<button
class="btn <%= cell.btnClass || 'btn-secondary' %> mb-1 w-100 <%= cell.doubleHeight ? 'btn-tall' : 'btn-short' %> fw-bold fs-4 <%= cell.faIcon ? 'd-flex justify-content-center align-items-center' : '' %>"
name="<%= cell.name || '' %>"
onclick="triggerAnnouncement(this)"
<% if (ctx.context) { %> data-context="<%= ctx.context %>" <% } %>
<% if (ctx.timeout) { %> data-timeout="<%= ctx.timeout %>" <% } %>
<% if (ctx.cid) { %> data-cid="<%= ctx.cid %>" <% } %>
<% if (ctx.dial) { %> data-dial="<%= ctx.dial %>" <% } %>
>
<% if (cell.faIcon) { %>
<i class="<%= cell.faIcon %> me-2" <% if (cell.faStyle) { %> style="<%= cell.faStyle %>" <% } %>></i>
<span><%= cell.text || '' %></span>
<% } else { %>
<%= cell.text || '' %>
<% } %>
</button>
<% } %>
</td>
<% } %>
</tr>
<% }); %>
</tbody>
</table>
<button
class="btn <%= cell.btnClass || 'btn-secondary' %> mb-1 w-100 <%= cell.doubleHeight ? 'btn-tall' : 'btn-short' %> fw-bold fs-4 <%= cell.faIcon ? 'd-flex justify-content-center align-items-center' : '' %>"
name="<%= cell.name || '' %>"
onclick="triggerAnnouncement(this)"
<% if (ctx.context) { %> data-context="<%= ctx.context %>" <% } %>
<% if (ctx.timeout) { %> data-timeout="<%= ctx.timeout %>" <% } %>
<% if (ctx.cid) { %> data-cid="<%= ctx.cid %>" <% } %>
<% if (ctx.dial) { %> data-dial="<%= ctx.dial %>" <% } %>
>
<% if (cell.faIcon) { %>
<i class="<%= cell.faIcon %> me-2" <% if (cell.faStyle) { %> style="<%= cell.faStyle %>" <% } %>></i>
<span><%= cell.text || '' %></span>
<% } else { %>
<%= cell.text || '' %>
<% } %>
</button>
<% } %>
</td>
<% } %>
</tr>
<% }); %>
</tbody>
</table>
</div>
</div>