ui: improvements
This commit is contained in:
parent
7949bbe66d
commit
18a95bf9ab
@ -121,7 +121,7 @@
|
||||
>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="grid gap-4 grid-cols-2 auto-rows-max lg:px-10 px-2">
|
||||
<div class="grid gap-2 grid-cols-2 auto-rows-max lg:px-10 px-2">
|
||||
<label for="name">{$t('forms.name')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
@ -225,7 +225,7 @@
|
||||
<div class="flex space-x-1 pb-5 font-bold">
|
||||
<h1 class="title">{$t('application.features')}</h1>
|
||||
</div>
|
||||
<div class="grid gap-4 grid-cols-2 auto-rows-max lg:px-10 px-2">
|
||||
<div class="grid gap-2 grid-cols-2 auto-rows-max lg:px-10 px-2">
|
||||
<Setting
|
||||
id="isPublic"
|
||||
loading={publicLoading}
|
||||
|
@ -1,25 +1,14 @@
|
||||
|
||||
<script lang="ts">
|
||||
export let destination: any;
|
||||
export let settings: any;
|
||||
export let state: any;
|
||||
import LocalDocker from './_LocalDocker.svelte';
|
||||
import RemoteDocker from './_RemoteDocker.svelte';
|
||||
</script>
|
||||
|
||||
<div class="flex h-20 items-center space-x-2 p-5 px-6 font-bold">
|
||||
<div class="-mb-5 flex-col">
|
||||
<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
|
||||
Configuration
|
||||
</div>
|
||||
<span class="text-xs">{destination.name}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mx-auto max-w-6xl px-6">
|
||||
{#if destination.remoteEngine}
|
||||
<RemoteDocker bind:destination {settings} {state} />
|
||||
<RemoteDocker bind:destination {settings} />
|
||||
{:else}
|
||||
<LocalDocker bind:destination {settings} {state} />
|
||||
<LocalDocker bind:destination {settings} />
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
@ -142,24 +142,24 @@
|
||||
</script>
|
||||
|
||||
<form on:submit|preventDefault={handleSubmit} class="py-4">
|
||||
<div class="grid gap-4 grid-cols-2 grid-rows-1">
|
||||
<div class="flex space-x-2">
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-sm w-full"
|
||||
class="btn btn-sm"
|
||||
class:bg-destinations={!loading.save}
|
||||
class:loading={loading.save}
|
||||
disabled={loading.save}
|
||||
>{$t('forms.save')}
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-sm w-full"
|
||||
class="btn btn-sm"
|
||||
class:loading={loading.restart}
|
||||
class:bg-error={!loading.restart}
|
||||
disabled={loading.restart}
|
||||
on:click|preventDefault={forceRestartProxy}>{$t('destination.force_restart_proxy')}</button
|
||||
>
|
||||
</div>
|
||||
<div class="grid gap-4 grid-cols-2 auto-rows-max mt-10 items-center">
|
||||
<div class="grid gap-2 grid-cols-2 auto-rows-max mt-10 items-center">
|
||||
<label for="name" class="text-base font-bold text-stone-100 w-full">{$t('forms.name')}</label>
|
||||
<input
|
||||
class="w-full"
|
||||
|
@ -166,7 +166,6 @@
|
||||
|
||||
<form on:submit|preventDefault={handleSubmit} class="grid grid-flow-row gap-2 py-4">
|
||||
<div class="flex space-x-1 pb-5">
|
||||
<div class="title font-bold">{$t('forms.configuration')}</div>
|
||||
{#if $appSession.isAdmin}
|
||||
<button
|
||||
type="submit"
|
||||
|
@ -88,17 +88,25 @@
|
||||
</script>
|
||||
|
||||
{#if $page.params.id !== 'new'}
|
||||
<nav class="nav-side">
|
||||
<button
|
||||
id="delete"
|
||||
on:click={() => deleteDestination(destination)}
|
||||
type="submit"
|
||||
disabled={!$appSession.isAdmin && isDestinationDeletable}
|
||||
class:hover:text-red-500={$appSession.isAdmin && isDestinationDeletable}
|
||||
class="icons bg-transparent text-sm"
|
||||
class:text-stone-600={!isDestinationDeletable}><DeleteIcon /></button
|
||||
>
|
||||
<nav class="header lg:flex-row flex-col-reverse">
|
||||
<div class="flex flex-row space-x-2 font-bold pt-10 lg:pt-0">
|
||||
<div class="flex flex-col items-center justify-center">
|
||||
<div class="title">Configurations</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="lg:block hidden flex-1" />
|
||||
<div class="flex flex-row flex-wrap space-x-3 justify-center lg:justify-start lg:py-0">
|
||||
<button
|
||||
id="delete"
|
||||
on:click={() => deleteDestination(destination)}
|
||||
type="submit"
|
||||
disabled={!$appSession.isAdmin && isDestinationDeletable}
|
||||
class:hover:text-red-500={$appSession.isAdmin && isDestinationDeletable}
|
||||
class="icons bg-transparent text-sm"
|
||||
class:text-stone-600={!isDestinationDeletable}><DeleteIcon /></button
|
||||
>
|
||||
<Tooltip triggeredBy="#delete">{deletable()}</Tooltip>
|
||||
</div>
|
||||
</nav>
|
||||
<Tooltip triggeredBy="#delete">{deletable()}</Tooltip>
|
||||
{/if}
|
||||
<slot />
|
||||
|
@ -260,7 +260,7 @@
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="grid gap-4 grid-cols-1 grid-rows-1 lg:px-10 px-2">
|
||||
<div class="grid gap-2 grid-cols-1 grid-rows-1 lg:px-10 px-2">
|
||||
<div class="mt-2 grid grid-cols-2 items-center">
|
||||
<label for="name">{$t('forms.name')}</label>
|
||||
<input name="name" id="name" class="w-full" bind:value={service.name} required />
|
||||
@ -383,7 +383,18 @@
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<div class="grid grid-flow-row gap-2 lg:px-10 px-2 pt-4">
|
||||
<div class="grid grid-flow-row gap-2 lg:px-10 px-2 pt-2">
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<Setting
|
||||
id="dualCerts"
|
||||
disabled={$status.service.isRunning}
|
||||
dataTooltip={$t('forms.must_be_stopped_to_modify')}
|
||||
bind:setting={dualCerts}
|
||||
title={$t('application.ssl_www_and_non_www')}
|
||||
description={$t('services.generate_www_non_www_ssl')}
|
||||
on:click={() => !$status.service.isRunning && changeSettings('dualCerts')}
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="exposePort"
|
||||
>Exposed Port <Explainer
|
||||
@ -402,17 +413,7 @@
|
||||
placeholder="12345"
|
||||
/>
|
||||
</div>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<Setting
|
||||
id="dualCerts"
|
||||
disabled={$status.service.isRunning}
|
||||
dataTooltip={$t('forms.must_be_stopped_to_modify')}
|
||||
bind:setting={dualCerts}
|
||||
title={$t('application.ssl_www_and_non_www')}
|
||||
description={$t('services.generate_www_non_www_ssl')}
|
||||
on:click={() => !$status.service.isRunning && changeSettings('dualCerts')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{#if service.type === 'plausibleanalytics'}
|
||||
<PlausibleAnalytics bind:service {readOnly} />
|
||||
|
@ -103,7 +103,7 @@
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="grid gap-4 grid-cols-2 auto-rows-max">
|
||||
<div class="grid gap-2 grid-cols-2 auto-rows-max">
|
||||
<label for="name" class="text-base font-bold text-stone-100">Name</label>
|
||||
<input class="w-full" name="name" id="name" required bind:value={source.name} />
|
||||
<label for="htmlUrl" class="text-base font-bold text-stone-100">HTML URL</label>
|
||||
@ -158,7 +158,7 @@
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="grid gap-4 grid-cols-2 auto-rows-max mt-4">
|
||||
<div class="grid gap-2 grid-cols-2 auto-rows-max mt-4">
|
||||
<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
|
||||
<input class="w-full" name="name" id="name" required bind:value={source.name} />
|
||||
<label for="htmlUrl" class="text-base font-bold text-stone-100">HTML URL</label>
|
||||
|
Loading…
Reference in New Issue
Block a user