Tweak table layout

main
sudoer777 2021-11-22 17:13:29 -07:00
parent 54bef98312
commit 4d5669dab7
2 changed files with 51 additions and 1 deletions

View File

@ -35,12 +35,19 @@ CATEGORIES.push(new Category(
headerRow.appendChild(yearsHeader);
const spacerHeader = document.createElement('th');
spacerHeader.classList.add('spacer-column');
headerRow.appendChild(spacerHeader);
itemsListTable.appendChild(headerRow);
},
function listSeason(season, row) {
const yearCell = document.createElement('td');
yearCell.textContent = (season.year - 1) + "-" + season.year;
row.appendChild(yearCell);
const spacerCell = document.createElement('td');
row.appendChild(spacerCell);
},
async function addSeason() {
//
@ -65,12 +72,19 @@ CATEGORIES.push(new Category(
nameHeader.textContent = "Name";
headerRow.appendChild(nameHeader);
const spacerHeader = document.createElement('th');
spacerHeader.classList.add('spacer-column');
headerRow.appendChild(spacerHeader);
itemsListTable.appendChild(headerRow);
},
function listSport(sport, row) {
const nameCell = document.createElement('td');
nameCell.textContent = sport.name;
row.appendChild(nameCell);
const spacerCell = document.createElement('td');
row.appendChild(spacerCell);
},
async function addSport() {
//
@ -98,6 +112,10 @@ CATEGORIES.push(new Category(
const genderHeader = document.createElement('th');
headerRow.appendChild(genderHeader);
const spacerHeader = document.createElement('th');
spacerHeader.classList.add('spacer-column');
headerRow.appendChild(spacerHeader);
const sportHeader = document.createElement('th');
sportHeader.textContent = "Sport";
headerRow.appendChild(sportHeader);
@ -114,6 +132,9 @@ CATEGORIES.push(new Category(
genderCell.textContent = gender;
row.appendChild(genderCell);
const spacerCell = document.createElement('td');
row.appendChild(spacerCell);
const sportCell = document.createElement('td');
Data.getSportName(division.sportID)
.then(data => sportCell.textContent = data);
@ -142,6 +163,10 @@ CATEGORIES.push(new Category(
nameHeader.textContent = "Name";
headerRow.appendChild(nameHeader);
const spacerHeader = document.createElement('th');
spacerHeader.classList.add('spacer-column');
headerRow.appendChild(spacerHeader);
const sportHeader = document.createElement('th');
sportHeader.textContent = "Sport";
headerRow.appendChild(sportHeader);
@ -153,6 +178,9 @@ CATEGORIES.push(new Category(
nameCell.textContent = team.name;
row.appendChild(nameCell);
const spacerCell = document.createElement('td');
row.appendChild(spacerCell);
const sportCell = document.createElement('td');
Data.getSportName(team.sportID)
.then(data => sportCell.textContent = data);
@ -184,6 +212,10 @@ CATEGORIES.push(new Category(
const scoreHeader = document.createElement('th');
headerRow.appendChild(scoreHeader);
const spacerHeader = document.createElement('th');
spacerHeader.classList.add('spacer-column');
headerRow.appendChild(spacerHeader);
const sportNameHeader = document.createElement('th');
sportNameHeader.textContent = "Sport";
headerRow.appendChild(sportNameHeader);
@ -215,10 +247,13 @@ CATEGORIES.push(new Category(
scoresCell.appendChild(team2ScoreSpan);
row.appendChild(scoresCell);
const spacerCell = document.createElement('td');
row.appendChild(spacerCell);
const sportCell = document.createElement('td');
const sportSpan = document.createElement('span');
const divisionSpan = document.createElement('span');
divisionSpan.classList.add('division-span');
divisionSpan.classList.add('flat-content');
const divisionNameSpan = document.createElement('span');
const divisionGenderSpan = document.createElement('span');
divisionSpan.appendChild(divisionNameSpan);

View File

@ -0,0 +1,15 @@
.flat-content {
flex-direction: row;
}
th {
text-align: left;
}
td {
white-space: nowrap;
}
.spacer-column {
width: 100%;
}