Move latency figure and stats line down in host row
This commit is contained in:
14
src/main.js
14
src/main.js
@@ -558,11 +558,11 @@ function hostRowHTML(host, index, showPin = true) {
|
||||
<div class="w-3 h-3 rounded-full flex-shrink-0" style="background-color: ${latencyHex(null)}"></div>
|
||||
<span class="font-medium text-white truncate">${host.name}</span>
|
||||
</div>
|
||||
<div class="latency-value text-4xl font-bold tabular-nums text-right mt-1" data-host="${index}">
|
||||
<div class="latency-value text-4xl font-bold tabular-nums text-right mt-3" data-host="${index}">
|
||||
<span class="text-gray-500">---</span>
|
||||
</div>
|
||||
<a href="${host.url}" target="_blank" rel="noopener" class="text-xs text-gray-500 truncate block col-span-2 -mt-2">${host.url}</a>
|
||||
<div class="status-text text-xs text-gray-500 whitespace-nowrap text-right col-span-2 mt-3" data-host="${index}">waiting...</div>
|
||||
<div class="status-text text-xs text-gray-500 whitespace-nowrap text-right col-span-2 mt-5" data-host="${index}">waiting...</div>
|
||||
</div>
|
||||
<div class="flex-grow sparkline-container rounded overflow-hidden border border-gray-700/30">
|
||||
<canvas class="sparkline-canvas w-full" data-host="${index}" height="${CONFIG.canvasHeight}"></canvas>
|
||||
@@ -721,19 +721,19 @@ function updateHostRow(host, index) {
|
||||
` <span class="text-gray-500">/</span> ` +
|
||||
`<span class="text-gray-400">max </span><span class="${latencyClass(max, "online")}">${max}ms</span>`;
|
||||
statusEl.className =
|
||||
"status-text text-xs whitespace-nowrap text-right col-span-2 mt-3";
|
||||
"status-text text-xs whitespace-nowrap text-right col-span-2 mt-5";
|
||||
} else if (host.status === "offline") {
|
||||
statusEl.textContent = "unreachable";
|
||||
statusEl.className =
|
||||
"status-text text-xs text-red-400 whitespace-nowrap text-right col-span-2 mt-3";
|
||||
"status-text text-xs text-red-400 whitespace-nowrap text-right col-span-2 mt-5";
|
||||
} else if (host.status === "error") {
|
||||
statusEl.textContent = "timeout";
|
||||
statusEl.className =
|
||||
"status-text text-xs text-orange-400 whitespace-nowrap text-right col-span-2 mt-3";
|
||||
"status-text text-xs text-orange-400 whitespace-nowrap text-right col-span-2 mt-5";
|
||||
} else {
|
||||
statusEl.textContent = "connecting...";
|
||||
statusEl.className =
|
||||
"status-text text-xs text-gray-500 whitespace-nowrap text-right col-span-2 mt-3";
|
||||
"status-text text-xs text-gray-500 whitespace-nowrap text-right col-span-2 mt-5";
|
||||
}
|
||||
|
||||
SparklineRenderer.draw(canvas, host.history);
|
||||
@@ -1045,7 +1045,7 @@ function greyOutUI(state) {
|
||||
if (statusEl) {
|
||||
statusEl.textContent = "paused";
|
||||
statusEl.className =
|
||||
"status-text text-xs text-gray-500 whitespace-nowrap text-right col-span-2 mt-3";
|
||||
"status-text text-xs text-gray-500 whitespace-nowrap text-right col-span-2 mt-5";
|
||||
}
|
||||
// Grey out the status dot
|
||||
const row = document.querySelector(`.host-row[data-index="${i}"]`);
|
||||
|
||||
Reference in New Issue
Block a user