mirror of
https://github.com/cjfranko/NTP-Timeturner.git
synced 2025-11-08 18:32:02 +00:00
style: Resize status icons to 60x60px and adjust layout
Co-authored-by: aider (gemini/gemini-2.5-pro) <aider@aider.chat>
This commit is contained in:
parent
26dca4fd18
commit
fe9ac76942
2 changed files with 13 additions and 8 deletions
|
|
@ -77,7 +77,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||
function updateStatus(data) {
|
||||
const ltcStatus = data.ltc_status || 'UNKNOWN';
|
||||
const ltcIconSrc = iconMap.ltcStatus[ltcStatus] || iconMap.ltcStatus.default;
|
||||
statusElements.ltcStatus.innerHTML = `<img src="${ltcIconSrc}" class="status-icon" alt=""> ${ltcStatus}`;
|
||||
statusElements.ltcStatus.innerHTML = `<img src="${ltcIconSrc}" class="status-icon" alt=""><span>${ltcStatus}</span>`;
|
||||
statusElements.ltcStatus.className = ltcStatus.toLowerCase();
|
||||
statusElements.ltcTimecode.textContent = data.ltc_timecode;
|
||||
statusElements.frameRate.textContent = data.frame_rate;
|
||||
|
|
@ -87,16 +87,16 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||
|
||||
const ntpIconSrc = iconMap.ntpActive[data.ntp_active];
|
||||
if (data.ntp_active) {
|
||||
statusElements.ntpActive.innerHTML = `<img src="${ntpIconSrc}" class="status-icon" alt=""> Active`;
|
||||
statusElements.ntpActive.innerHTML = `<img src="${ntpIconSrc}" class="status-icon" alt=""><span>Active</span>`;
|
||||
statusElements.ntpActive.className = 'active';
|
||||
} else {
|
||||
statusElements.ntpActive.innerHTML = `<img src="${ntpIconSrc}" class="status-icon" alt=""> Inactive`;
|
||||
statusElements.ntpActive.innerHTML = `<img src="${ntpIconSrc}" class="status-icon" alt=""><span>Inactive</span>`;
|
||||
statusElements.ntpActive.className = 'inactive';
|
||||
}
|
||||
|
||||
const syncStatus = data.sync_status || 'UNKNOWN';
|
||||
const syncIconSrc = iconMap.syncStatus[syncStatus] || iconMap.syncStatus.default;
|
||||
statusElements.syncStatus.innerHTML = `<img src="${syncIconSrc}" class="status-icon" alt=""> ${syncStatus}`;
|
||||
statusElements.syncStatus.innerHTML = `<img src="${syncIconSrc}" class="status-icon" alt=""><span>${syncStatus}</span>`;
|
||||
statusElements.syncStatus.className = syncStatus.replace(/\s+/g, '-').toLowerCase();
|
||||
|
||||
statusElements.deltaMs.textContent = data.timecode_delta_ms;
|
||||
|
|
@ -104,7 +104,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||
|
||||
const jitterStatus = data.jitter_status || 'UNKNOWN';
|
||||
const jitterIconSrc = iconMap.jitterStatus[jitterStatus] || iconMap.jitterStatus.default;
|
||||
statusElements.jitterStatus.innerHTML = `<img src="${jitterIconSrc}" class="status-icon" alt=""> ${jitterStatus}`;
|
||||
statusElements.jitterStatus.innerHTML = `<img src="${jitterIconSrc}" class="status-icon" alt=""><span>${jitterStatus}</span>`;
|
||||
statusElements.jitterStatus.className = jitterStatus.toLowerCase();
|
||||
|
||||
statusElements.interfaces.innerHTML = '';
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue