diff --git a/static/app.js b/static/app.js index c9eba3a..80e2f34 100644 --- a/static/app.js +++ b/static/app.js @@ -26,15 +26,18 @@ function renderTable() { data.players.forEach((name, i) => { const th = document.createElement('th'); th.innerText = name; + th.classList.add('name-col'); headRow.appendChild(th); }); // Guest column const guestTh = document.createElement('th'); guestTh.innerText = data.guest || 'Guest'; + guestTh.classList.add('name-col'); headRow.appendChild(guestTh); // Guest Name column (per date) const guestNameTh = document.createElement('th'); guestNameTh.innerText = 'Guest Name'; + guestNameTh.classList.add('name-col'); headRow.appendChild(guestNameTh); thead.appendChild(headRow); table.appendChild(thead); @@ -50,7 +53,7 @@ function renderTable() { // Player attendance [...data.players, data.guest].forEach((player, colIdx) => { const td = document.createElement('td'); - td.className = 'clickable'; + td.className = 'clickable name-col'; const key = `${date}|${colIdx}`; if (data.attendance[key]) { td.innerText = 'Yes'; @@ -71,6 +74,7 @@ function renderTable() { }); // Guest Name column (input per date) const guestNameTd = document.createElement('td'); + guestNameTd.classList.add('name-col'); const guestNameInput = document.createElement('input'); guestNameInput.type = 'text'; guestNameInput.value = data.guestNames[date] || ''; diff --git a/templates/index.html b/templates/index.html index 550750e..0b29b3a 100644 --- a/templates/index.html +++ b/templates/index.html @@ -12,6 +12,7 @@ .yes { background: #b6e7b6; font-weight: bold; } input[type="text"] { width: 90%; } #add-date { margin-top: 1em; } + .name-col { width: 140px; min-width: 140px; max-width: 140px; }