Update lists styling

This commit is contained in:
Ninjdai 2023-12-12 14:34:57 +01:00
parent 3879f698d1
commit 364fc0aa19
4 changed files with 34 additions and 1 deletions

View File

@ -25,17 +25,28 @@ function genContactTable(contacts) {
<th>Téléphone</th> <th>Téléphone</th>
<th>Prénom</th> <th>Prénom</th>
<th>Nom</th> <th>Nom</th>
<th>Status</th>
<th>Action</th> <th>Action</th>
</tr>`; </tr>`;
for(const contact of contacts) { for(const contact of contacts) {
const [text, color] = statusText(contact.called, contact.vote);
res += ` res += `
<tr> <tr>
<td>${contact.phone}</td> <td>${contact.phone}</td>
<td>${contact.firstName}</td> <td>${contact.firstName}</td>
<td>${contact.firstName}</td> <td>${contact.lastName}</td>
<td class="${color}">${text}</td>
<td><button onclick="deleteContact('${contact.phone}');">Supprimer</button></td> <td><button onclick="deleteContact('${contact.phone}');">Supprimer</button></td>
</tr>`; </tr>`;
} }
res += `</table>`; res += `</table>`;
return res return res
} }
function statusText(called, vote) {
if(called == 0) return ["À appeler", "called_0"];
else if(called == 2) return ["Appel en cours", ""];
else if(vote==0) return ["Ne votera pas", "voted_0"];
else if(vote==1) return ["Votera", "voted_1"];
return "";
}

View File

@ -7,6 +7,18 @@
<style> <style>
table, th, td { table, th, td {
border:1px solid black; border:1px solid black;
/*border-collapse: collapse;*/
padding: 5px;
}
tr:hover {background-color: #D6EEEE;}
.called_0 {
background-color: grey;
}
.voted_1 {
background-color: green;
}
.voted_0 {
background-color: red;
} }
</style> </style>
</head> </head>

View File

@ -7,7 +7,10 @@
<style> <style>
table, th, td { table, th, td {
border:1px solid black; border:1px solid black;
/*border-collapse: collapse;*/
padding: 5px;
} }
tr:hover {background-color: #D6EEEE;}
</style> </style>
</head> </head>
<body> <body>

View File

@ -7,7 +7,14 @@
<style> <style>
table, th, td { table, th, td {
border:1px solid black; border:1px solid black;
/*border-collapse: collapse;*/
padding: 5px;
} }
table a {
display:block;
text-decoration:none;
}
tr:hover {background-color: #D6EEEE;}
</style> </style>
</head> </head>
<body> <body>