Shiloh/lasthourcloud
Shiloh/lasthourcloud
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases 4 Wiki Activity

fix: UI

Browse Source
This commit is contained in:
Andras Bacsai 2022-05-10 10:34:50 +02:00
parent d6b6938555
commit 8b3113bd92
2 changed files with 12 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/routes/_Trend.svelte
View File

@ -3,7 +3,7 @@
</script> </script>
{#if trend === 'up'} {#if trend === 'up'}
<span class="px-2 text-green-500"> <span class="-mt-1 inline-flex px-2 text-green-500">
<svg <svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
class="h-8 w-8" class="h-8 w-8"
@ -20,7 +20,7 @@
</svg></span </svg></span
> >
{:else if trend === 'down'} {:else if trend === 'down'}
<span class="text-red-500 px-2"> <span class="text-red-500 px-2 inline-flex -mt-1">
<svg <svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
class="w-8 h-8" class="w-8 h-8"

20
src/routes/index.svelte
View File

@ -144,21 +144,21 @@
<div class="overflow-hidden rounded px-4 py-5 sm:p-6"> <div class="overflow-hidden rounded px-4 py-5 sm:p-6">
<dt class="truncate text-sm font-medium text-white">Total Memory</dt> <dt class="truncate text-sm font-medium text-white">Total Memory</dt>
<dd class="mt-1 text-3xl font-semibold text-white"> <dd class="mt-1 text-3xl font-semibold text-white">
{(usage?.memory.totalMemMb).toFixed(0)} {(usage?.memory.totalMemMb).toFixed(0)}<span class="text-sm">MB</span>
</dd> </dd>
</div> </div>
<div class="overflow-hidden rounded px-4 py-5 sm:p-6"> <div class="overflow-hidden rounded px-4 py-5 sm:p-6">
<dt class="truncate text-sm font-medium text-white">Used Memory</dt> <dt class="truncate text-sm font-medium text-white">Used Memory</dt>
<dd class="mt-1 text-3xl font-semibold text-white "> <dd class="mt-1 text-3xl font-semibold text-white ">
{(usage?.memory.usedMemMb).toFixed(0)} {(usage?.memory.usedMemMb).toFixed(0)}<span class="text-sm">MB</span>
</dd> </dd>
</div> </div>
<div class="overflow-hidden rounded px-4 py-5 sm:p-6" class:bg-red-500={memoryWarning}> <div class="overflow-hidden rounded px-4 py-5 sm:p-6" class:bg-red-500={memoryWarning}>
<dt class="truncate text-sm font-medium text-white">Free Memory</dt> <dt class="truncate text-sm font-medium text-white">Free Memory</dt>
<dd class="mt-1 flex items-center text-3xl font-semibold text-white"> <dd class="mt-1 text-3xl font-semibold text-white">
{usage?.memory.freeMemPercentage}% {usage?.memory.freeMemPercentage}<span class="text-sm">%</span>
{#if !memoryWarning} {#if !memoryWarning}
<Trend trend={trends.memory} /> <Trend trend={trends.memory} />
{/if} {/if}
@ -180,8 +180,8 @@
</div> </div>
<div class="overflow-hidden rounded px-4 py-5 sm:p-6" class:bg-red-500={cpuWarning}> <div class="overflow-hidden rounded px-4 py-5 sm:p-6" class:bg-red-500={cpuWarning}>
<dt class="truncate text-sm font-medium text-white">CPU Usage</dt> <dt class="truncate text-sm font-medium text-white">CPU Usage</dt>
<dd class="mt-1 flex items-center text-3xl font-semibold text-white"> <dd class="mt-1 text-3xl font-semibold text-white">
{usage?.cpu.usage}% {usage?.cpu.usage}<span class="text-sm">%</span>
{#if !cpuWarning} {#if !cpuWarning}
<Trend trend={trends.cpu} /> <Trend trend={trends.cpu} />
{/if} {/if}
@ -192,19 +192,19 @@
<div class="overflow-hidden rounded px-4 py-5 sm:p-6"> <div class="overflow-hidden rounded px-4 py-5 sm:p-6">
<dt class="truncate text-sm font-medium text-white">Total Disk</dt> <dt class="truncate text-sm font-medium text-white">Total Disk</dt>
<dd class="mt-1 text-3xl font-semibold text-white"> <dd class="mt-1 text-3xl font-semibold text-white">
{usage?.disk.totalGb}GB {usage?.disk.totalGb}<span class="text-sm">GB</span>
</dd> </dd>
</div> </div>
<div class="overflow-hidden rounded px-4 py-5 sm:p-6"> <div class="overflow-hidden rounded px-4 py-5 sm:p-6">
<dt class="truncate text-sm font-medium text-white">Used Disk</dt> <dt class="truncate text-sm font-medium text-white">Used Disk</dt>
<dd class="mt-1 text-3xl font-semibold text-white"> <dd class="mt-1 text-3xl font-semibold text-white">
{usage?.disk.usedGb}GB {usage?.disk.usedGb}<span class="text-sm">GB</span>
</dd> </dd>
</div> </div>
<div class="overflow-hidden rounded px-4 py-5 sm:p-6" class:bg-red-500={diskWarning}> <div class="overflow-hidden rounded px-4 py-5 sm:p-6" class:bg-red-500={diskWarning}>
<dt class="truncate text-sm font-medium text-white">Free Disk</dt> <dt class="truncate text-sm font-medium text-white">Free Disk</dt>
<dd class="mt-1 flex items-center text-3xl font-semibold text-white"> <dd class="mt-1 text-3xl font-semibold text-white">
{usage?.disk.freePercentage}% {usage?.disk.freePercentage}<span class="text-sm">%</span>
{#if !diskWarning} {#if !diskWarning}
<Trend trend={trends.disk} /> <Trend trend={trends.disk} />
{/if} {/if}