Shiloh/lasthourcloud
Shiloh/lasthourcloud
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases 4 Wiki Activity

fix: explainer component

Browse Source
This commit is contained in:
Andras Bacsai 2022-09-02 09:00:35 +02:00
parent 46268f0dcf
commit b427573e19
23 changed files with 70 additions and 141 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
apps/api/src/jobs/infrastructure.ts
View File

@ -3,9 +3,6 @@ import axios from 'axios';
import { compareVersions } from 'compare-versions';
import { asyncExecShell, cleanupDockerStorage, executeDockerCmd, isDev, prisma, startTraefikTCPProxy, generateDatabaseConfiguration, startTraefikProxy, listSettings, version } from '../lib/common';
async function disconnect() {
await prisma.$disconnect();
}
async function autoUpdater() {
try {
const currentVersion = version;

6
apps/ui/src/lib/components/SimpleExplainer.svelte Normal file
View File

@ -0,0 +1,6 @@
<script lang="ts">
export let text: string;
export let customClass = 'max-w-[24rem]';
</script>
<div class="p-2 text-xs text-stone-400 {customClass}">{@html text}</div>

72
apps/ui/src/routes/applications/[id]/_Setting.svelte
View File

@ -1,72 +0,0 @@
<script lang="ts">
import Explainer from '$lib/components/Explainer.svelte';
export let setting: any;
export let title: any;
export let description: any;
export let isCenter = true;
export let disabled = false;
export let dataTooltip: any = null;
export let loading = false;
</script>
<div class="flex items-center py-4 pr-8">
<div class="flex w-96 flex-col">
<div class="text-xs font-bold text-stone-100 md:text-base">{title}</div>
<Explainer text={description} />
</div>
</div>
<div
class:tooltip={dataTooltip}
class:text-center={isCenter}
data-tip={dataTooltip}
class="flex justify-center"
>
<div
on:click
aria-pressed="false"
class="relative mx-20 inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out"
class:opacity-50={disabled || loading}
class:bg-green-600={!loading && setting}
class:bg-stone-700={!loading && !setting}
class:bg-yellow-500={loading}
>
<span class="sr-only">Use setting</span>
<span
class="pointer-events-none relative inline-block h-5 w-5 transform rounded-full bg-white shadow transition duration-200 ease-in-out"
class:translate-x-5={setting}
class:translate-x-0={!setting}
>
<span
class=" absolute inset-0 flex h-full w-full items-center justify-center transition-opacity duration-200 ease-in"
class:opacity-0={setting}
class:opacity-100={!setting}
class:animate-spin={loading}
aria-hidden="true"
>
<svg class="h-3 w-3 bg-white text-red-600" fill="none" viewBox="0 0 12 12">
<path
d="M4 8l2-2m0 0l2-2M6 6L4 4m2 2l2 2"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</span>
<span
class="absolute inset-0 flex h-full w-full items-center justify-center transition-opacity duration-100 ease-out"
aria-hidden="true"
class:opacity-100={setting}
class:opacity-0={!setting}
class:animate-spin={loading}
>
<svg class="h-3 w-3 bg-white text-green-600" fill="currentColor" viewBox="0 0 12 12">
<path
d="M3.707 5.293a1 1 0 00-1.414 1.414l1.414-1.414zM5 8l-.707.707a1 1 0 001.414 0L5 8zm4.707-3.293a1 1 0 00-1.414-1.414l1.414 1.414zm-7.414 2l2 2 1.414-1.414-2-2-1.414 1.414zm3.414 2l4-4-1.414-1.414-4 4 1.414 1.414z"
/>
</svg>
</span>
</span>
</div>
</div>

1
apps/ui/src/routes/applications/[id]/configuration/source.svelte
View File

@ -32,7 +32,6 @@
import { errorNotification } from '$lib/common';
import { appSession } from '$lib/store';
import PublicRepository from './_PublicRepository.svelte';
import Explaner from '$lib/components/Explainer.svelte';
import DocLink from '$lib/components/DocLink.svelte';
const { id } = $page.params;

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

@ -32,16 +32,15 @@
import { onDestroy, onMount } from 'svelte';
import Select from 'svelte-select';
import Explainer from '$lib/components/Explainer.svelte';
import { get, post } from '$lib/api';
import cuid from 'cuid';
import { browser } from '$app/env';
import { addToast, appSession, disabledButton, setLocation, status } from '$lib/store';
import { t } from '$lib/translations';
import { errorNotification, getDomain, notNodeDeployments, staticDeployments } from '$lib/common';
import Setting from '$lib/components/Setting.svelte';
import Tooltip from '$lib/components/Tooltip.svelte';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
const { id } = $page.params;
$: isDisabled =
@ -447,7 +446,7 @@
<div class="grid grid-cols-2 items-center">
<label for="baseBuildImage" class="text-base font-bold text-stone-100"
>{$t('application.base_build_image')}
<Explaner
<Explainer
explanation={application.buildPack === 'laravel'
? 'For building frontend assets with webpack.'
: 'Image that will be used during the build process.'}
@ -472,7 +471,7 @@
<div class="grid grid-cols-2 items-center">
<label for="baseImage" class="text-base font-bold text-stone-100"
>{$t('application.base_image')}
<Explaner explanation={'Image that will be used for the deployment.'} /></label
<Explainer explanation={'Image that will be used for the deployment.'} /></label
>
<div class="custom-select-wrapper">
<Select
@ -492,7 +491,7 @@
<div class="grid grid-cols-2 items-center pb-8">
<label for="deploymentType" class="text-base font-bold text-stone-100"
>Deployment Type
<Explaner
<Explainer
explanation={"Defines how to deploy your application. <br><br><span class='text-green-500 font-bold'>Static</span> is for static websites, <span class='text-green-500 font-bold'>node</span> is for server-side applications."}
/></label
>
@ -542,7 +541,7 @@
<div class="grid grid-cols-2 items-center">
<label for="fqdn" class="text-base font-bold text-stone-100"
>{$t('application.url_fqdn')}
<Explaner
<Explainer
explanation={"If you specify <span class='text-settings font-bold'>https</span>, the application will be accessible only over https.<br>SSL certificate will be generated automatically.<br><br>If you specify <span class='text-settings font-bold'>www</span>, the application will be redirected (302) from non-www and vice versa.<br><br>To modify the domain, you must first stop the application.<br><br><span class='text-settings font-bold'>You must set your DNS to point to the server IP in advance.</span>"}
/>
</label>
@ -550,7 +549,6 @@
<input
readonly={isDisabled}
disabled={isDisabled}
bind:this={domainEl}
name="fqdn"
id="fqdn"
required
@ -648,7 +646,7 @@
<div class="grid grid-cols-2 items-center">
<label for="port" class="text-base font-bold text-stone-100"
>{$t('forms.port')}
<Explaner explanation={'The port your application listens on.'} /></label
<Explainer explanation={'The port your application listens on.'} /></label
>
<input
disabled={isDisabled}
@ -662,7 +660,7 @@
{/if}
<div class="grid grid-cols-2 items-center">
<label for="exposePort" class="text-base font-bold text-stone-100"
>Exposed Port <Explaner
>Exposed Port <Explainer
explanation={'You can expose your application to a port on the host system.<br><br>Useful if you would like to use your own reverse proxy or tunnel and also in development mode. Otherwise leave empty.'}
/></label
>
@ -719,7 +717,7 @@
{#if application.buildPack === 'docker'}
<div class="grid grid-cols-2 items-center pt-4">
<label for="dockerFileLocation" class="text-base font-bold text-stone-100"
>Dockerfile Location <Explaner
>Dockerfile Location <Explainer
explanation={"Should be absolute path, like <span class='text-settings font-bold'>/data/Dockerfile</span> or <span class='text-settings font-bold'>/Dockerfile.</span>"}
/></label
>
@ -747,7 +745,7 @@
</div>
<div class="grid grid-cols-2 items-center">
<label for="denoOptions" class="text-base font-bold text-stone-100"
>Arguments <Explaner
>Arguments <Explainer
explanation={"List of arguments to pass to <span class='text-settings font-bold'>deno run</span> command. Could include permissions, configurations files, etc."}
/></label
>
@ -766,7 +764,7 @@
<div class="flex-col">
<label for="baseDirectory" class="pt-2 text-base font-bold text-stone-100"
>{$t('forms.base_directory')}
<Explaner
<Explainer
explanation={"Directory to use as the base for all commands.<br>Could be useful with <span class='text-settings font-bold'>monorepos</span>."}
/></label
>
@ -786,7 +784,7 @@
<div class="flex-col">
<label for="publishDirectory" class="pt-2 text-base font-bold text-stone-100"
>{$t('forms.publish_directory')}
<Explaner
<Explainer
explanation={"Directory containing all the assets for deployment. <br> For example: <span class='text-settings font-bold'>dist</span>,<span class='text-settings font-bold'>_site</span> or <span class='text-settings font-bold'>public</span>."}
/></label
>

9
apps/ui/src/routes/applications/[id]/previews.svelte
View File

@ -21,13 +21,13 @@
import Secret from './_Secret.svelte';
import { get, post } from '$lib/api';
import { page } from '$app/stores';
import Explainer from '$lib/components/Explainer.svelte';
import { t } from '$lib/translations';
import { goto } from '$app/navigation';
import { errorNotification, getDomain } from '$lib/common';
import { onMount } from 'svelte';
import Loading from '$lib/components/Loading.svelte';
import { addToast } from '$lib/store';
import SimpleExplainer from '$lib/components/SimpleExplainer.svelte';
const { id } = $page.params;
@ -145,7 +145,7 @@
{:else}
<div class="mx-auto max-w-6xl px-6 pt-4">
<div class="flex justify-center py-4 text-center">
<Explainer
<SimpleExplainer
customClass="w-full"
text={applicationSecrets.length === 0
? "You can add secrets to PR/MR deployments. Please add secrets to the application first. <br>Useful for creating <span class='text-green-500 font-bold'>staging</span> environments."
@ -194,8 +194,9 @@
</div>
</a>
<div class="flex items-center justify-center">
<button class="btn btn-sm bg-coollabs hover:bg-coollabs-100" on:click={() => redeploy(container)}
>{$t('application.preview.redeploy')}</button
<button
class="btn btn-sm bg-coollabs hover:bg-coollabs-100"
on:click={() => redeploy(container)}>{$t('application.preview.redeploy')}</button
>
</div>
<div class="flex items-center justify-center">

4
apps/ui/src/routes/applications/[id]/storages.svelte
View File

@ -24,7 +24,7 @@
import { page } from '$app/stores';
import Storage from './_Storage.svelte';
import { get } from '$lib/api';
import Explainer from '$lib/components/Explainer.svelte';
import SimpleExplainer from '$lib/components/SimpleExplainer.svelte';
import { t } from '$lib/translations';
const { id } = $page.params;
@ -88,7 +88,7 @@
<div class="mx-auto max-w-6xl rounded-xl px-6 pt-4">
<div class="flex justify-center py-4 text-center">
<Explainer customClass="w-full" text={$t('application.storage.persistent_storage_explainer')} />
<SimpleExplainer customClass="w-full" text={$t('application.storage.persistent_storage_explainer')} />
</div>
<table class="mx-auto border-separate text-left">
<thead>

4
apps/ui/src/routes/databases/[id]/_Databases/_Databases.svelte
View File

@ -16,7 +16,7 @@
import { t } from '$lib/translations';
import { errorNotification } from '$lib/common';
import { addToast, appSession, status } from '$lib/store';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
const { id } = $page.params;
@ -211,7 +211,7 @@
<label for="url" class="text-base font-bold text-stone-100"
>{$t('database.connection_string')}
{#if !isPublic && database.destinationDocker.remoteEngine}
<Explaner
<Explainer
explanation="You can only access the database with this URL if your application is deployed to the same Destination."
/>
{/if}</label

6
apps/ui/src/routes/databases/[id]/_Databases/_MariaDB.svelte
View File

@ -3,7 +3,7 @@
import { status } from '$lib/store';
import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
import { t } from '$lib/translations';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
</script>
<div class="flex space-x-1 py-5 font-bold">
@ -38,7 +38,7 @@
<div class="grid grid-cols-2 items-center">
<label for="dbUserPassword" class="text-base font-bold text-stone-100"
>{$t('forms.password')}
<Explaner explanation="Could be changed while the database is running." /></label
<Explainer explanation="Could be changed while the database is running." /></label
>
<CopyPasswordField
disabled={!$status.database.isRunning}
@ -63,7 +63,7 @@
</div>
<div class="grid grid-cols-2 items-center">
<label for="rootUserPassword" class="text-base font-bold text-stone-100"
>{$t('forms.roots_password')} <Explaner explanation="Could be changed while the database is running." /></label
>{$t('forms.roots_password')} <Explainer explanation="Could be changed while the database is running." /></label
>
<CopyPasswordField
disabled={!$status.database.isRunning}

4
apps/ui/src/routes/databases/[id]/_Databases/_MongoDB.svelte
View File

@ -3,7 +3,7 @@
import { status } from '$lib/store';
import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
import { t } from '$lib/translations';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
</script>
<div class="flex space-x-1 py-5 font-bold">
@ -24,7 +24,7 @@
<div class="grid grid-cols-2 items-center">
<label for="rootUserPassword" class="text-base font-bold text-stone-100"
>{$t('forms.roots_password')}
<Explaner explanation="Could be changed while the database is running." /></label
<Explainer explanation="Could be changed while the database is running." /></label
>
<CopyPasswordField
disabled={!$status.database.isRunning}

9
apps/ui/src/routes/databases/[id]/_Databases/_MySQL.svelte
View File

@ -2,9 +2,8 @@
export let database: any;
import { status } from '$lib/store';
import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
import Explainer from '$lib/components/Explainer.svelte';
import { t } from '$lib/translations';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
</script>
<div class="flex space-x-1 py-5 font-bold">
@ -38,7 +37,8 @@ import Explaner from '$lib/components/Explainer.svelte';
</div>
<div class="grid grid-cols-2 items-center">
<label for="dbUserPassword" class="text-base font-bold text-stone-100"
>{$t('forms.password')} <Explaner explanation="Could be changed while the database is running." /></label
>{$t('forms.password')}
<Explainer explanation="Could be changed while the database is running." /></label
>
<CopyPasswordField
disabled={!$status.database.isRunning}
@ -63,7 +63,8 @@ import Explaner from '$lib/components/Explainer.svelte';
</div>
<div class="grid grid-cols-2 items-center">
<label for="rootUserPassword" class="text-base font-bold text-stone-100"
>{$t('forms.roots_password')} <Explaner explanation="Could be changed while the database is running." /></label
>{$t('forms.roots_password')}
<Explainer explanation="Could be changed while the database is running." /></label
>
<CopyPasswordField
disabled={!$status.database.isRunning}

6
apps/ui/src/routes/databases/[id]/_Databases/_PostgreSQL.svelte
View File

@ -3,7 +3,7 @@
import { status } from '$lib/store';
import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
import { t } from '$lib/translations';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
</script>
<div class="flex space-x-1 py-5 font-bold">
@ -26,7 +26,7 @@
</div>
<div class="grid grid-cols-2 items-center">
<label for="rootUser" class="text-base font-bold text-stone-100"
>Postgres User Password <Explaner
>Postgres User Password <Explainer
explanation="Could be changed while the database is running."
/></label
>
@ -54,7 +54,7 @@
<div class="grid grid-cols-2 items-center">
<label for="dbUserPassword" class="text-base font-bold text-stone-100"
>{$t('forms.password')}
<Explaner explanation="Could be changed while the database is running." /></label
<Explainer explanation="Could be changed while the database is running." /></label
>
<CopyPasswordField
disabled={!$status.database.isRunning}

4
apps/ui/src/routes/databases/[id]/_Databases/_Redis.svelte
View File

@ -3,7 +3,7 @@
import { status } from '$lib/store';
import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
import { t } from '$lib/translations';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
</script>
<div class="flex space-x-1 py-5 font-bold">
@ -13,7 +13,7 @@
<div class="grid grid-cols-2 items-center">
<label for="dbUserPassword" class="text-base font-bold text-stone-100"
>{$t('forms.password')}
<Explaner explanation="Could be changed while the database is running." /></label
<Explainer explanation="Could be changed while the database is running." /></label
>
<CopyPasswordField
disabled={!$status.database.isRunning}

4
apps/ui/src/routes/destinations/[id]/_NewRemoteDocker.svelte
View File

@ -5,7 +5,7 @@
import { post } from '$lib/api';
import { errorNotification } from '$lib/common';
import Explainer from '$lib/components/Explainer.svelte';
import SimpleExplainer from '$lib/components/SimpleExplainer.svelte';
import Setting from '$lib/components/Setting.svelte';
import { t } from '$lib/translations';
@ -29,7 +29,7 @@
</script>
<div class="text-center flex justify-center">
<Explainer
<SimpleExplainer
customClass="max-w-[32rem]"
text="Remote Docker Engines are using <span class='text-white font-bold'>SSH</span> to communicate with the remote docker engine.
You need to setup an <span class='text-white font-bold'>SSH key</span> in advance on the server and install Docker.

6
apps/ui/src/routes/iam/team/[id]/index.svelte
View File

@ -12,7 +12,7 @@
export let team: any;
export let invitations: any[];
import { page } from '$app/stores';
import Explainer from '$lib/components/Explainer.svelte';
import SimpleExplainer from '$lib/components/SimpleExplainer.svelte';
import { post } from '$lib/api';
import { t } from '$lib/translations';
import { errorNotification } from '$lib/common';
@ -98,7 +98,7 @@
<div class="flex-col">
<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
{#if team.id === '0'}
<Explainer customClass="w-full" text={$t('team.root_team_explainer')} />
<SimpleExplainer customClass="w-full" text={$t('team.root_team_explainer')} />
{/if}
</div>
<input id="name" name="name" placeholder="name" bind:value={team.name} />
@ -179,7 +179,7 @@
>
</div>
</div>
<Explainer text={$t('team.invite_only_register_explainer')} />
<SimpleExplainer text={$t('team.invite_only_register_explainer')} />
<div class="flex-col space-y-2 px-4 pt-5 sm:px-6">
<div class="flex space-x-0">
<input

4
apps/ui/src/routes/services/[id]/_Services/_Ghost.svelte
View File

@ -1,6 +1,6 @@
<script lang="ts">
import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
import { t } from '$lib/translations';
export let readOnly: any;
export let service: any;
@ -8,7 +8,7 @@
<div class="flex space-x-1 py-5">
<div class="title">
Ghost <Explaner explanation="You can change these values in the Ghost admin panel." />
Ghost <Explainer explanation="You can change these values in the Ghost admin panel." />
</div>
</div>
<div class="grid grid-cols-2 items-center px-10">

4
apps/ui/src/routes/services/[id]/_Services/_PlausibleAnalytics.svelte
View File

@ -1,6 +1,6 @@
<script lang="ts">
import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
import { appSession, status } from '$lib/store';
import { t } from '$lib/translations';
export let service: any;
@ -12,7 +12,7 @@
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="scriptName"
>Script Name <Explaner
>Script Name <Explainer
explanation="Useful if you would like to rename the collector script to prevent it blocked by AdBlockers."
/></label
>

8
apps/ui/src/routes/services/[id]/_Services/_Services.svelte
View File

@ -30,7 +30,7 @@
import Moodle from './_Moodle.svelte';
import Searxng from './_Searxng.svelte';
import Weblate from './_Weblate.svelte';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
const { id } = $page.params;
$: isDisabled =
@ -284,7 +284,7 @@
<div class="grid grid-cols-2 px-10">
<div class="flex-col ">
<label for="apiFqdn" class="pt-2 text-base font-bold text-stone-100"
>API URL <Explaner explanation={$t('application.https_explainer')} /></label
>API URL <Explainer explanation={$t('application.https_explainer')} /></label
>
</div>
@ -304,7 +304,7 @@
<div class="flex-col ">
<label for="fqdn" class="pt-2 text-base font-bold text-stone-100"
>{$t('application.url_fqdn')}
<Explaner explanation={$t('application.https_explainer')} />
<Explainer explanation={$t('application.https_explainer')} />
</label>
</div>
@ -367,7 +367,7 @@
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="exposePort" class="text-base font-bold text-stone-100"
>Exposed Port <Explaner
>Exposed Port <Explainer
explanation={'You can expose your application to a port on the host system.<br><br>Useful if you would like to use your own reverse proxy or tunnel and also in development mode. Otherwise leave empty.'}
/></label
>

4
apps/ui/src/routes/services/[id]/_Services/_Umami.svelte
View File

@ -1,6 +1,6 @@
<script lang="ts">
import CopyPasswordField from '$lib/components/CopyPasswordField.svelte';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
export let service: any;
</script>
@ -13,7 +13,7 @@
</div>
<div class="grid grid-cols-2 items-center px-10">
<label for="umamiAdminPassword"
>Initial Admin Password <Explaner
>Initial Admin Password <Explainer
explanation="It could be changed in Umami. <br>This is just the password set initially after the first start."
/></label
>

4
apps/ui/src/routes/services/[id]/storages.svelte
View File

@ -25,7 +25,7 @@
import { page } from '$app/stores';
import Storage from './_Storage.svelte';
import { get } from '$lib/api';
import Explainer from '$lib/components/Explainer.svelte';
import SimpleExplainer from '$lib/components/SimpleExplainer.svelte';
import ServiceLinks from './_ServiceLinks.svelte';
const { id } = $page.params;
@ -74,7 +74,7 @@
<div class="mx-auto max-w-6xl rounded-xl px-6 pt-4">
<div class="flex justify-center py-4 text-center">
<Explainer
<SimpleExplainer
customClass="w-full"
text={'You can specify any folder that you want to be persistent across restarts. <br>This is useful for storing data for VSCode server or WordPress.'}
/>

9
apps/ui/src/routes/settings/global.svelte
View File

@ -19,14 +19,13 @@
<script lang="ts">
export let settings: any;
import Setting from '$lib/components/Setting.svelte';
import Explainer from '$lib/components/Explainer.svelte';
import { del, get, post } from '$lib/api';
import { browser } from '$app/env';
import { t } from '$lib/translations';
import { addToast, appSession, features } from '$lib/store';
import { errorNotification, getDomain } from '$lib/common';
import Menu from './_Menu.svelte';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
let isRegistrationEnabled = settings.isRegistrationEnabled;
let dualCerts = settings.dualCerts;
@ -196,7 +195,7 @@
<div class="flex-col">
<div class="pt-2 text-base font-bold text-stone-100">
{$t('application.url_fqdn')}
<Explaner explanation={$t('setting.ssl_explainer')} />
<Explainer explanation={$t('setting.ssl_explainer')} />
</div>
</div>
<div class="justify-start text-left">
@ -251,7 +250,7 @@
<div class="flex-col">
<div class="pt-2 text-base font-bold text-stone-100">
{$t('forms.public_port_range')}
<Explaner explanation={$t('forms.public_port_range_explainer')} />
<Explainer explanation={$t('forms.public_port_range_explainer')} />
</div>
</div>
<div class="mx-auto flex-row items-center justify-center space-y-2">
@ -283,7 +282,7 @@
</div>
<div class="grid grid-cols-2 items-center">
<div class="text-base font-bold text-stone-100">
Custom DNS servers <Explaner
Custom DNS servers <Explainer
explanation="You can specify a custom DNS server to verify your domains all over Coolify.<br><br>By default, the OS defined DNS servers are used."
/>
</div>

8
apps/ui/src/routes/sources/[id]/_Github.svelte
View File

@ -7,7 +7,7 @@
import { dashify, errorNotification, getDomain } from '$lib/common';
import { addToast, appSession } from '$lib/store';
import { dev } from '$app/env';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
const { id } = $page.params;
@ -116,7 +116,7 @@
</div>
<div class="grid lg:grid-cols-2 items-center">
<label for="customPort" class="text-base font-bold text-stone-100"
>Custom SSH Port <Explaner
>Custom SSH Port <Explainer
explanation={'If you use a self-hosted version of Git, you can provide custom port for all the Git related actions.'}
/></label
>
@ -133,7 +133,7 @@
<div class="flex flex-col">
<label for="organization" class="pt-2 text-base font-bold text-stone-100"
>Organization
<Explaner
<Explainer
explanation={"Fill it if you would like to use an organization's as your Git Source. Otherwise your user will be used."}
/></label
>
@ -197,7 +197,7 @@
{#if selfHosted}
<div class="grid lg:grid-cols-2 items-center">
<label for="customPort" class="text-base font-bold text-stone-100"
>Custom SSH Port <Explaner
>Custom SSH Port <Explainer
explanation="If you use a self-hosted version of Git, you can provide custom port for all the Git related actions."
/></label
>

6
apps/ui/src/routes/sources/[id]/_Gitlab.svelte
View File

@ -11,7 +11,7 @@
import { t } from '$lib/translations';
import { errorNotification } from '$lib/common';
import { addToast, appSession } from '$lib/store';
import Explaner from '$lib/components/Explainer.svelte';
import Explainer from '$lib/components/Explainer.svelte';
const { id } = $page.params;
let url = settings.fqdn ? settings.fqdn : window.location.origin;
@ -241,7 +241,7 @@
{#if selfHosted}
<div class="grid grid-cols-2 items-center">
<label for="customPort" class="text-base font-bold text-stone-100"
>Custom SSH Port <Explaner
>Custom SSH Port <Explainer
explanation={'If you use a self-hosted version of Git, you can provide custom port for all the Git related actions.'}
/></label
>
@ -260,7 +260,7 @@
<label for="oauthId" class="pt-2 text-base font-bold text-stone-100"
>{$t('source.oauth_id')}
{#if !source.gitlabAppId}
<Explaner explanation={$t('source.oauth_id_explainer')} />
<Explainer explanation={$t('source.oauth_id_explainer')} />
{/if}</label
>
</div>