fix(routes): improve design of git sources page
This commit is contained in:
parent
5a95cc236c
commit
ac6970ad40
@ -14,7 +14,7 @@
|
||||
export let name: string;
|
||||
export let placeholder = '';
|
||||
|
||||
let disabledClass = 'bg-coolback disabled:bg-coolblack';
|
||||
let disabledClass = 'bg-coolback disabled:bg-coolblack w-full';
|
||||
let isHttps = browser && window.location.protocol === 'https:';
|
||||
|
||||
function copyToClipboard() {
|
||||
|
@ -96,23 +96,25 @@
|
||||
<div class="grid gap-1 lg:grid-flow-col pb-7">
|
||||
<div class="title">General</div>
|
||||
{#if !source.githubAppId}
|
||||
<button class="btn btn-sm bg-sources" type="submit">Save & Redirect to GitHub</button>
|
||||
<div class="w-full flex flex-rpw justify-end">
|
||||
<button class="btn btn-sm bg-sources mt-5 w-full lg:w-fit" type="submit">Save & Redirect to GitHub</button>
|
||||
</div>
|
||||
{/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="grid grid-flow-row gap-2">
|
||||
<div class="mt-2 grid lg:grid-cols-2 items-center">
|
||||
<label for="name" class="text-base font-bold text-stone-100">Name</label>
|
||||
<input name="name" id="name" required bind:value={source.name} />
|
||||
<input class="w-full" name="name" id="name" required bind:value={source.name} />
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid lg:grid-cols-2 items-center">
|
||||
<label for="htmlUrl" class="text-base font-bold text-stone-100">HTML URL</label>
|
||||
<input name="htmlUrl" id="htmlUrl" required bind:value={source.htmlUrl} />
|
||||
<input class="w-full" name="htmlUrl" id="htmlUrl" required bind:value={source.htmlUrl} />
|
||||
</div>
|
||||
<div class="grid lg:grid-cols-2 items-center">
|
||||
<label for="apiUrl" class="text-base font-bold text-stone-100">API URL</label>
|
||||
<input name="apiUrl" id="apiUrl" required bind:value={source.apiUrl} />
|
||||
<input class="w-full" name="apiUrl" id="apiUrl" required bind:value={source.apiUrl} />
|
||||
</div>
|
||||
<div class="grid lg:grid-cols-2 items-center">
|
||||
<label for="customPort" class="text-base font-bold text-stone-100"
|
||||
@ -121,6 +123,7 @@
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
class="w-full"
|
||||
name="customPort"
|
||||
id="customPort"
|
||||
disabled={!selfHosted || source.githubAppId}
|
||||
@ -139,6 +142,7 @@
|
||||
>
|
||||
</div>
|
||||
<input
|
||||
class="w-full"
|
||||
name="organization"
|
||||
id="organization"
|
||||
placeholder="eg: coollabsio"
|
||||
|
@ -145,24 +145,26 @@
|
||||
|
||||
<div class="mx-auto max-w-4xl px-6">
|
||||
<form on:submit|preventDefault={handleSubmit} class="py-4">
|
||||
<div class="flex space-x-1 pb-7">
|
||||
<div class="flex space-x-1 pb-7 flex-col lg:items-center lg:flex-row">
|
||||
<div class="title">General</div>
|
||||
{#if $appSession.isAdmin}
|
||||
<button type="submit" class="btn btn-sm bg-sources" disabled={loading}
|
||||
>{loading ? $t('forms.saving') : $t('forms.save')}</button
|
||||
>
|
||||
{#if source.gitlabAppId}
|
||||
<button class="btn btn-sm" on:click|preventDefault={changeSettings}
|
||||
>{$t('source.change_app_settings', { name: 'GitLab' })}</button
|
||||
>
|
||||
{:else}
|
||||
<button class="btn btn-sm" on:click|preventDefault|stopPropagation={newApp}
|
||||
>Create new GitLab App manually</button
|
||||
<div class="w-full flex flex-rpw lg:justify-end space-x-2 mt-5 lg:mt-0">
|
||||
{#if $appSession.isAdmin}
|
||||
<button type="submit" class="btn btn-sm bg-sources" disabled={loading}
|
||||
>{loading ? $t('forms.saving') : $t('forms.save')}</button
|
||||
>
|
||||
{#if source.gitlabAppId}
|
||||
<button class="btn btn-sm" on:click|preventDefault={changeSettings}
|
||||
>{$t('source.change_app_settings', { name: 'GitLab' })}</button
|
||||
>
|
||||
{:else}
|
||||
<button class="btn btn-sm" on:click|preventDefault|stopPropagation={newApp}
|
||||
>Create new GitLab App manually</button
|
||||
>
|
||||
{/if}
|
||||
{/if}
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid grid-flow-row gap-2 px-10">
|
||||
<div class="grid grid-flow-row gap-2 lg:px-10">
|
||||
{#if !source.gitlabAppId}
|
||||
<a
|
||||
href="https://docs.coollabs.io/coolify/sources#how-to-integrate-with-gitlab"
|
||||
@ -172,7 +174,7 @@
|
||||
>
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="type" class="text-base font-bold text-stone-100">Application Type</label>
|
||||
<select name="type" id="type" class="w-96" bind:value={applicationType}>
|
||||
<select name="type" id="type" class="lg:w-96 w-full" bind:value={applicationType}>
|
||||
<option value="user">{$t('source.gitlab.user_owned')}</option>
|
||||
<option value="group">{$t('source.gitlab.group_owned')}</option>
|
||||
{#if source.htmlUrl !== 'https://gitlab.com'}
|
||||
@ -185,6 +187,7 @@
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="groupName" class="text-base font-bold text-stone-100">Group Name</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="groupName"
|
||||
id="groupName"
|
||||
required
|
||||
@ -197,7 +200,7 @@
|
||||
<div class="grid grid-flow-row gap-2">
|
||||
<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" required bind:value={source.name} />
|
||||
<input class="w-full" name="name" id="name" required bind:value={source.name} />
|
||||
</div>
|
||||
</div>
|
||||
{#if source.gitlabApp.groupName}
|
||||
@ -206,6 +209,7 @@
|
||||
>{$t('source.group_name')}</label
|
||||
>
|
||||
<input
|
||||
class="w-full"
|
||||
name="groupName"
|
||||
id="groupName"
|
||||
disabled={source.gitlabAppId}
|
||||
@ -218,6 +222,7 @@
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="htmlUrl" class="text-base font-bold text-stone-100">HTML URL</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="htmlUrl"
|
||||
id="htmlUrl"
|
||||
required
|
||||
@ -229,6 +234,7 @@
|
||||
<div class="grid grid-cols-2 items-center">
|
||||
<label for="apiUrl" class="text-base font-bold text-stone-100">API URL</label>
|
||||
<input
|
||||
class="w-full"
|
||||
name="apiUrl"
|
||||
id="apiUrl"
|
||||
disabled={source.gitlabAppId}
|
||||
@ -245,6 +251,7 @@
|
||||
/></label
|
||||
>
|
||||
<input
|
||||
class="w-full"
|
||||
name="customPort"
|
||||
id="customPort"
|
||||
disabled={!selfHosted}
|
||||
@ -264,6 +271,7 @@
|
||||
>
|
||||
</div>
|
||||
<input
|
||||
class="w-full"
|
||||
disabled={source.gitlabAppId}
|
||||
readonly={source.gitlabAppId}
|
||||
on:change={checkOauthId}
|
||||
@ -281,6 +289,7 @@
|
||||
>{$t('source.application_id')}</label
|
||||
>
|
||||
<input
|
||||
class="w-full"
|
||||
name="appId"
|
||||
id="appId"
|
||||
disabled={source.gitlabAppId}
|
||||
|
Loading…
x
Reference in New Issue
Block a user