dave/coolify
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Design day!

Browse Source
This commit is contained in:
Andras Bacsai
2022-02-22 12:56:58 +01:00
parent 0c2e028b38
commit df18b93809
24 changed files with 418 additions and 482 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
src/routes/new/destination/_Docker.svelte
View File

@@ -5,7 +5,7 @@
import { post } from '$lib/api';
import Setting from '$lib/components/Setting.svelte';
import { enhance, errorNotification } from '$lib/form';
import { errorNotification } from '$lib/form';
let loading = false;
@@ -24,8 +24,8 @@
<div class="flex justify-center px-6 pb-8">
<form on:submit|preventDefault={handleSubmit} class="grid grid-flow-row gap-2 py-4">
<div class="flex h-8 items-center space-x-2">
<div class="text-xl font-bold text-white">Configuration</div>
<div class="flex items-center space-x-2 pb-5">
<div class="title font-bold">Configuration</div>
<button
type="submit"
class:bg-sky-600={!loading}
@@ -38,24 +38,20 @@
: 'Save'}</button
>
</div>
<div class="grid grid-cols-3 items-center">
<label for="name">Name</label>
<div class="col-span-2">
<input required name="name" placeholder="name" bind:value={payload.name} />
</div>
<div class="mt-2 grid grid-cols-2 items-center px-10">
<label for="name" class="text-base font-bold text-stone-100">Name</label>
<input required name="name" placeholder="name" bind:value={payload.name} />
</div>
<div class="grid grid-cols-3 items-center">
<label for="engine">Engine</label>
<div class="col-span-2">
<input
required
name="engine"
placeholder="eg: /var/run/docker.sock"
bind:value={payload.engine}
/>
<!-- <Explainer text="You can use remote Docker Engine with over SSH." /> -->
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="engine" class="text-base font-bold text-stone-100">Engine</label>
<input
required
name="engine"
placeholder="eg: /var/run/docker.sock"
bind:value={payload.engine}
/>
<!-- <Explainer text="You can use remote Docker Engine with over SSH." /> -->
</div>
<!-- <div class="flex items-center">
<label for="remoteEngine">Remote Docker Engine?</label>
@@ -75,27 +71,17 @@
</div>
</div>
{/if} -->
<div class="grid grid-cols-3 items-center">
<label for="network">Network</label>
<div class="col-span-2">
<input
required
name="network"
placeholder="default: coolify"
bind:value={payload.network}
/>
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="network" class="text-base font-bold text-stone-100">Network</label>
<input required name="network" placeholder="default: coolify" bind:value={payload.network} />
</div>
<div class="flex justify-start">
<ul class="mt-2 divide-y divide-stone-800">
<Setting
bind:setting={payload.isCoolifyProxyUsed}
on:click={() => (payload.isCoolifyProxyUsed = !payload.isCoolifyProxyUsed)}
isPadding={false}
title="Use Coolify Proxy?"
description="This will install a proxy on the destination to allow you to access your applications and services without any manual configuration (recommended for Docker). Databases will have their own proxy."
/>
</ul>
<div class="grid grid-cols-2 items-center">
<Setting
bind:setting={payload.isCoolifyProxyUsed}
on:click={() => (payload.isCoolifyProxyUsed = !payload.isCoolifyProxyUsed)}
title="Use Coolify Proxy?"
description="This will install a proxy on the destination to allow you to access your applications and services without any manual configuration (recommended for Docker).<br><br>Databases will have their own proxy."
/>
</div>
</form>
</div>

57
src/routes/new/source/_Github.svelte
View File

@@ -24,26 +24,24 @@
}
</script>
<div class="flex justify-center pb-8">
<form on:submit|preventDefault={handleSubmit} class="grid grid-flow-row gap-2 py-4">
<div class="flex h-8 items-center space-x-2">
<div class="text-xl font-bold text-white">Configuration</div>
<button type="submit" class="bg-orange-600 hover:bg-orange-500">Save</button>
</div>
<div class="grid grid-cols-3 items-center">
<label for="type">Type</label>
<div class="mx-auto max-w-4xl px-6">
<div class="flex justify-center pb-8">
<form on:submit|preventDefault={handleSubmit} class="grid grid-flow-row gap-2 py-4">
<div class="flex h-8 items-center space-x-2">
<div class="text-xl font-bold text-white">Configuration</div>
<button type="submit" class="bg-orange-600 hover:bg-orange-500">Save</button>
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="type" class="text-base font-bold text-stone-100">Type</label>
<div class="col-span-2">
<select name="type" id="type" class="w-96" bind:value={gitSource.type}>
<option value="github">GitHub</option>
<option value="gitlab">GitLab</option>
<option value="bitbucket">BitBucket</option>
</select>
</div>
</div>
<div class="grid grid-cols-3 items-center">
<label for="name">Name</label>
<div class="col-span-2">
<div class="grid grid-cols-2 items-center px-10">
<label for="name" class="text-base font-bold text-stone-100">Name</label>
<input
name="name"
id="name"
@@ -53,11 +51,9 @@
bind:value={gitSource.name}
/>
</div>
</div>
<div class="grid grid-cols-3 items-center">
<label for="htmlUrl">HTML URL</label>
<div class="col-span-2">
<div class="grid grid-cols-2 items-center px-10">
<label for="htmlUrl" class="text-base font-bold text-stone-100">HTML URL</label>
<input
type="url"
name="htmlUrl"
@@ -67,10 +63,8 @@
bind:value={gitSource.htmlUrl}
/>
</div>
</div>
<div class="grid grid-cols-3 items-center">
<label for="apiUrl">API URL</label>
<div class="col-span-2">
<div class="grid grid-cols-2 items-center px-10">
<label for="apiUrl" class="text-base font-bold text-stone-100">API URL</label>
<input
name="apiUrl"
type="url"
@@ -80,10 +74,15 @@
bind:value={gitSource.apiUrl}
/>
</div>
</div>
<div class="grid grid-cols-3">
<label for="organization" class="pt-2">Organization</label>
<div class="col-span-2">
<div class="grid grid-cols-2 px-10">
<div class="flex flex-col">
<label for="organization" class="pt-2 text-base font-bold text-stone-100"
>Organization</label
>
<Explainer
text="Fill it if you would like to use an organization's as your Git Source. Otherwise your user will be used."
/>
</div>
<input
name="organization"
id="organization"
@@ -91,11 +90,7 @@
bind:value={gitSource.organization}
bind:this={organizationEl}
/>
<Explainer
text="Fill it if you would like to use an organization's as your Git Source. Otherwise your
user will be used."
/>
</div>
</div>
</form>
</form>
</div>
</div>

83
src/routes/new/source/_Gitlab.svelte
View File

@@ -27,56 +27,47 @@
<div class="text-xl font-bold text-white">Configuration</div>
<button type="submit" class="bg-orange-600 hover:bg-orange-500">Save</button>
</div>
<div class="grid grid-cols-3 items-center">
<label for="type">Type</label>
<div class="col-span-2">
<select name="type" id="type" class="w-96" bind:value={gitSource.type}>
<option value="github">GitHub</option>
<option value="gitlab">GitLab</option>
<option value="bitbucket">BitBucket</option>
</select>
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="type" class="text-base font-bold text-stone-100">Type</label>
<select name="type" id="type" class="w-96" bind:value={gitSource.type}>
<option value="github">GitHub</option>
<option value="gitlab">GitLab</option>
<option value="bitbucket">BitBucket</option>
</select>
</div>
<div class="grid grid-cols-3 items-center">
<label for="name">Name</label>
<div class="col-span-2">
<input
name="name"
id="name"
placeholder="GitHub.com"
required
bind:this={nameEl}
bind:value={gitSource.name}
/>
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="name" class="text-base font-bold text-stone-100">Name</label>
<input
name="name"
id="name"
placeholder="GitHub.com"
required
bind:this={nameEl}
bind:value={gitSource.name}
/>
</div>
<div class="grid grid-cols-3 items-center">
<label for="htmlUrl">HTML URL</label>
<div class="col-span-2">
<input
type="url"
name="htmlUrl"
id="htmlUrl"
placeholder="eg: https://github.com"
required
bind:value={gitSource.htmlUrl}
/>
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="htmlUrl" class="text-base font-bold text-stone-100">HTML URL</label>
<input
type="url"
name="htmlUrl"
id="htmlUrl"
placeholder="eg: https://github.com"
required
bind:value={gitSource.htmlUrl}
/>
</div>
<div class="grid grid-cols-3 items-center">
<label for="apiUrl">API URL</label>
<div class="col-span-2">
<input
name="apiUrl"
type="url"
id="apiUrl"
placeholder="eg: https://api.github.com"
required
bind:value={gitSource.apiUrl}
/>
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="apiUrl" class="text-base font-bold text-stone-100">API URL</label>
<input
name="apiUrl"
type="url"
id="apiUrl"
placeholder="eg: https://api.github.com"
required
bind:value={gitSource.apiUrl}
/>
</div>
</form>
</div>