ershisan99/coolify
1
0
Fork 0
mirror of https://github.com/ershisan99/coolify.git synced 2026-02-03 05:12:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(routes): improve design of application page

Browse Source
This commit is contained in:
Kaname
2022-09-06 18:51:19 +00:00
parent 95c942f477
commit 5a95cc236c
3 changed files with 435 additions and 381 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
apps/ui/src/routes/applications/[id]/index.svelte
View File

@@ -293,7 +293,7 @@
}
</script>
<div class="flex items-center space-x-2 p-5 px-6 font-bold">
<div class="flex items-center space-x-2 p-5 px-6 font-bold lg:hidden">
<div class="-mb-5 flex-col">
<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
Configuration
@@ -347,7 +347,7 @@
{/if}
</div>
<div class="mx-auto max-w-4xl px-6 py-4">
<div class="mx-auto max-w-4xl px-6 pt-4 lg:pt-32">
<div class="text-2xl font-bold">Application Usage</div>
<div class="text-center">
<div class="stat w-64">
@@ -369,7 +369,7 @@
<div class="mx-auto max-w-4xl px-6">
<!-- svelte-ignore missing-declaration -->
<form on:submit|preventDefault={handleSubmit} class="py-4">
<div class="flex space-x-1 pb-5">
<div class="flex space-x-1 pb-5 justify-between items-center">
<div class="title">{$t('general')}</div>
{#if $appSession.isAdmin}
<button
@@ -383,7 +383,7 @@
>
{/if}
</div>
<div class="grid grid-flow-row gap-2 px-10">
<div class="grid grid-flow-row gap-2 lg:px-10">
<div class="mt-2 grid grid-cols-2 items-center">
<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
<input name="name" id="name" bind:value={application.name} required />
@@ -472,19 +472,16 @@
: 'Image that will be used during the build process.'}
/>
</label>
<div class="custom-select-wrapper">
<Select
{isDisabled}
containerClasses={isDisabled && containerClass()}
id="baseBuildImages"
showIndicator={!$status.application.isRunning}
items={application.baseBuildImages}
on:select={selectBaseBuildImage}
value={application.baseBuildImage}
isClearable={false}
/>
</div>
<Select
{isDisabled}
containerClasses={isDisabled && containerClass() || 'bg-neutral border-0'}
id="baseBuildImages"
showIndicator={!$status.application.isRunning}
items={application.baseBuildImages}
on:select={selectBaseBuildImage}
value={application.baseBuildImage}
isClearable={false}
/>
</div>
{/if}
{#if application.buildPack !== 'docker'}
@@ -493,10 +490,9 @@
>{$t('application.base_image')}
<Explainer explanation={'Image that will be used for the deployment.'} /></label
>
<div class="custom-select-wrapper">
<Select
<Select
{isDisabled}
containerClasses={isDisabled && containerClass()}
containerClasses={isDisabled && containerClass() || 'bg-neutral border-0'}
id="baseImages"
showIndicator={!$status.application.isRunning}
items={application.baseImages}
@@ -504,7 +500,6 @@
value={application.baseImage}
isClearable={false}
/>
</div>
</div>
{/if}
{#if application.buildPack !== 'docker' && (application.buildPack === 'nextjs' || application.buildPack === 'nuxtjs')}
@@ -573,7 +568,7 @@
<div class="flex space-x-1 py-5 font-bold">
<div class="title">{$t('application.application')}</div>
</div>
<div class="grid grid-flow-row gap-2 px-10">
<div class="grid grid-flow-row gap-2 lg:px-10">
<div class="grid grid-cols-2 items-center">
<Setting
id="isBot"
@@ -865,7 +860,7 @@
<div class="flex space-x-1 pb-5 font-bold">
<div class="title">{$t('application.features')}</div>
</div>
<div class="px-10 pb-10">
<div class="lg:px-10 lg:pb-10 pb-6">
{#if !application.settings.isPublicRepository}
<div class="grid grid-cols-2 items-center">
<Setting
@@ -890,7 +885,7 @@
/>
</div>
{/if}
<div class="grid grid-cols-2 items-center">
<div class="grid grid-cols-2 items-center w-full">
<Setting
id="debug"
isCenter={false}