feat(routes): improve ui for apps, databases and services logs

This commit is contained in:
Kaname
2022-09-10 17:45:47 +00:00
parent 6381ba8478
commit 3a562bb714
5 changed files with 21 additions and 33 deletions

View File

@@ -154,18 +154,13 @@
{/if} {/if}
</div> </div>
{#if logs.length > 0} {#if logs.length > 0}
<div <div class="font-mono w-full rounder bg-coolgray-200 p-5 overflow-x-auto overflox-y-auto max-h-[80vh] rounded-md mb-20 flex flex-col whitespace-nowrap -mt-12 scrollbar-thumb-coollabs scrollbar-track-coolgray-200 scrollbar-w-1">
class="font-mono leading-6 text-left text-md tracking-tighter rounded bg-coolgray-200 py-5 px-6 whitespace-pre-wrap break-words overflow-auto max-h-[80vh] -mt-12 overflow-y-scroll scrollbar-w-1 scrollbar-thumb-coollabs scrollbar-track-coolgray-200"
bind:this={logsEl}
>
{#each logs as log} {#each logs as log}
<div>{log.line + '\n'}</div> <p>{log.line + '\n'}</p>
{/each} {/each}
</div> </div>
{:else} {:else}
<div <div class="font-mono w-full rounder bg-coolgray-200 p-5 overflow-x-auto overflox-y-auto max-h-[80vh] rounded-md mb-20 flex flex-col whitespace-nowrap -mt-12 scrollbar-thumb-coollabs scrollbar-track-coolgray-200 scrollbar-w-1">
class="font-mono leading-6 text-left text-md tracking-tighter rounded bg-coolgray-200 py-5 px-6 whitespace-pre-wrap break-words overflow-auto max-h-[80vh] -mt-12 overflow-y-scroll scrollbar-w-1 scrollbar-thumb-coollabs scrollbar-track-coolgray-200"
>
No logs found. No logs found.
</div> </div>
{/if} {/if}

View File

@@ -177,17 +177,11 @@
</button> </button>
<Tooltip triggeredBy="#follow">Follow Logs</Tooltip> <Tooltip triggeredBy="#follow">Follow Logs</Tooltip>
</div> </div>
<div <div class="font-mono w-full rounder bg-coolgray-200 p-5 overflow-x-auto overflox-y-auto max-h-[80vh] rounded-md mb-20 flex flex-col whitespace-nowrap -mt-12 scrollbar-thumb-coollabs scrollbar-track-coolgray-200 scrollbar-w-1">
class="font-mono w-full leading-6 text-left text-md tracking-tighter rounded bg-coolgray-200 py-5 px-6 whitespace-pre-wrap break-words overflow-auto max-h-[80vh] -mt-12 overflow-y-scroll scrollbar-w-1 scrollbar-thumb-coollabs scrollbar-track-coolgray-200"
bind:this={logsEl}
on:scroll={detect}
>
<div class="px-2 pr-14">
{#each logs as log} {#each logs as log}
{log + '\n'} <p>{log + '\n'}</p>
{/each} {/each}
</div> </div>
</div> </div>
</div>
{/if} {/if}
</div> </div>

View File

@@ -114,7 +114,7 @@
{#if $appSession.isAdmin} {#if $appSession.isAdmin}
<button <button
type="submit" type="submit"
class="btn btn-sm w-full lg:fit-content" class="btn btn-sm w-full lg:w-auto"
class:loading class:loading
class:bg-databases={!loading} class:bg-databases={!loading}
disabled={loading}>{$t('forms.save')}</button disabled={loading}>{$t('forms.save')}</button

View File

@@ -134,7 +134,12 @@
</button> </button>
<Tooltip triggeredBy="#follow">Follow Logs</Tooltip> <Tooltip triggeredBy="#follow">Follow Logs</Tooltip>
</div> </div>
<div <div class="font-mono w-full rounder bg-coolgray-200 p-5 overflow-x-auto overflox-y-auto max-h-[80vh] rounded-md mb-20 flex flex-col whitespace-nowrap -mt-12 scrollbar-thumb-coollabs scrollbar-track-coolgray-200 scrollbar-w-1">
{#each logs as log}
<p>{log + '\n'}</p>
{/each}
</div>
<!-- <div
class="font-mono w-full leading-6 text-left text-md tracking-tighter rounded bg-coolgray-200 py-5 px-6 whitespace-pre-wrap break-words overflow-auto max-h-[80vh] -mt-12 overflow-y-scroll scrollbar-w-1 scrollbar-thumb-coollabs scrollbar-track-coolgray-200" class="font-mono w-full leading-6 text-left text-md tracking-tighter rounded bg-coolgray-200 py-5 px-6 whitespace-pre-wrap break-words overflow-auto max-h-[80vh] -mt-12 overflow-y-scroll scrollbar-w-1 scrollbar-thumb-coollabs scrollbar-track-coolgray-200"
bind:this={logsEl} bind:this={logsEl}
on:scroll={detect} on:scroll={detect}
@@ -144,7 +149,7 @@
{log + '\n'} {log + '\n'}
{/each} {/each}
</div> </div>
</div> </div> -->
</div> </div>
{/if} {/if}
</div> </div>

View File

@@ -150,17 +150,11 @@
</button> </button>
<Tooltip triggeredBy="#follow">Follow Logs</Tooltip> <Tooltip triggeredBy="#follow">Follow Logs</Tooltip>
</div> </div>
<div <div class="font-mono w-full rounder bg-coolgray-200 p-5 overflow-x-auto overflox-y-auto max-h-[80vh] rounded-md mb-20 flex flex-col whitespace-nowrap -mt-12 scrollbar-thumb-coollabs scrollbar-track-coolgray-200 scrollbar-w-1">
class="font-mono w-full leading-6 text-left text-md tracking-tighter rounded bg-coolgray-200 py-5 px-6 whitespace-pre-wrap break-words overflow-auto max-h-[80vh] -mt-12 overflow-y-scroll scrollbar-w-1 scrollbar-thumb-coollabs scrollbar-track-coolgray-200"
bind:this={logsEl}
on:scroll={detect}
>
<div class="px-2 pr-14">
{#each logs as log} {#each logs as log}
{log + '\n'} <p>{log.line + '\n'}</p>
{/each} {/each}
</div> </div>
</div> </div>
</div>
{/if} {/if}
</div> </div>