daniele/ER-TPL
1
0
Fork 0
mirror of https://github.com/Daniongithub/ER-TPL.git synced 2025-10-02 22:50:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

Nuova grafica start monitor bus

Browse Source
This commit is contained in:
Leocraft1
2025-09-28 17:31:39 +02:00
parent 5d834093be
commit 6654addeaa
3 changed files with 59 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
index.html
View File

@@ -45,7 +45,8 @@
<div class="riga"> <div class="riga">
<h2 class="piccolospazio">Ravenna:</h2> <h2 class="piccolospazio">Ravenna:</h2>
<p class="piccolospazio"> <p class="piccolospazio">
Aggiunti: <a class="novita" href="/startravenna_bus/urbano/manlc12e.html">MAN Lion's City 12E</a>. Aggiunti: <a class="novita" href="/startravenna_bus/urbano/manlc12e.html">MAN Lion's City 12E</a>. <br> <br>
Nuova grafica per il <a class="novita" href="/start_menu/servizi/start-livebus/index.html">Monitor bus</a>.
</p> </p>
</div> </div>
<div class="riga"> <div class="riga">

60
start_menu/servizi/start-livebus/css/style.css
View File

@@ -22,15 +22,8 @@ p {
} }
#data-container { #data-container {
margin-top: 20px; min-width: 80%;
max-width: 1000px; max-width: 100%;
margin-left: auto;
margin-right: auto;
background-color: #333;
padding: 20px;
border-radius: 12px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
overflow-x: scroll;
} }
.filter-container { .filter-container {
@@ -69,52 +62,46 @@ p {
} }
table { table {
width: 100%; border-collapse: separate;
border-collapse: collapse; border-spacing: 0;
margin-top: 20px; border: 1px solid #444;
font-size: 15px; border-radius: 16px;
border-radius: 8px;
overflow: hidden; overflow: hidden;
min-width: 85%;
max-width: 100%;
margin: 18px auto;
} }
table th:nth-child(6), /*Linee verticali*/
td:nth-child(6){ th:not(:last-child),
display: none; td:not(:last-child) {
border-right: 1px solid #444;
} }
table, /*Linee orizzontali*/
th, tr:not(:last-child) > th,
td { tr:not(:last-child) > td {
border: 1px solid #e0e0e0; border-bottom: 1px solid #444;
} }
th { th {
background-color: slategray; background-color: slategray;
color: white; color: white;
padding: 12px; text-align: center;
text-align: left; padding: .7vw;
} }
td { td {
padding: 10px; padding: .7vw;
background-color: dimgray; background-color: #282828;
color: white; color: white;
} }
tr:nth-child(even) td { tr:nth-child(even) td {
background-color: gray; background-color: rgb(60, 60, 60);
}
tr:hover td {
background-color: darkgray;
} }
@media (max-width: 768px) { @media (max-width: 768px) {
table th:nth-child(4),
td:nth-child(4){
display: none;
}
.filter-container input{ .filter-container input{
margin-top: 5px; margin-top: 5px;
} }
@@ -122,6 +109,9 @@ tr:hover td {
.filter-container button{ .filter-container button{
margin-top: 75%; margin-top: 75%;
} }
#data-container {
overflow-x: scroll;
}
} }
button { button {

40
start_menu/servizi/start-livebus/js/script.js
View File

@@ -42,24 +42,38 @@ function applyFilter() {
const table = document.createElement('table'); const table = document.createElement('table');
// Aggiungi l'intestazione della tabella // Aggiungi l'intestazione della tabella
const header = table.createTHead(); var th = document.createElement('th');
const headerRow = header.insertRow(); var tr = document.createElement('tr');
headerRow.insertCell().textContent = 'Zona'; th.innerHTML='Zona';
headerRow.insertCell().textContent = 'Linea'; tr.appendChild(th);
headerRow.insertCell().textContent = 'Fermata'; th = document.createElement('th');
headerRow.insertCell().textContent = 'Codice Fermata'; th.innerHTML='Linea';
headerRow.insertCell().textContent = 'Veicolo'; tr.appendChild(th);
headerRow.insertCell().textContent = ' '; th = document.createElement('th');
headerRow.insertCell().textContent = 'Ultimo Aggiornamento'; th.innerHTML='Fermata';
tr.appendChild(th);
th = document.createElement('th');
th.innerHTML='Codice fermata';
tr.appendChild(th);
th = document.createElement('th');
th.innerHTML='Veicolo';
tr.appendChild(th);
th = document.createElement('th');
th.innerHTML='Ultimo aggiornamento';
tr.appendChild(th);
table.appendChild(tr);
// Aggiungi i dati alla tabella // Aggiungi i dati alla tabella
const tbody = table.createTBody();
data.forEach(row => { data.forEach(row => {
const rowElement = tbody.insertRow(); const rowt = document.createElement('tr');
row.forEach(cellData => { row.forEach(cellData => {
const cell = rowElement.insertCell(); if(cellData!=""){
cell.textContent = cellData; const cell = document.createElement('td');
cell.innerHTML = cellData;
rowt.appendChild(cell);
}
}); });
table.appendChild(rowt);
}); });
// Aggiungi la tabella alla pagina // Aggiungi la tabella alla pagina