From b9076714cf717d14946e952ab86caffb336f7745 Mon Sep 17 00:00:00 2001
From: Andras Bacsai <andras.bacsai@protonmail.com>
Date: Thu, 18 Aug 2022 18:53:02 +0000
Subject: [PATCH] ui: fixes here and there

---
 .../configuration/_PublicRepository.svelte    | 23 ++++++++-----------
 .../[id]/configuration/buildpack.svelte       |  8 +++----
 .../[id]/configuration/source.svelte          |  6 ++---
 .../applications/[id]/logs/_BuildLog.svelte   |  2 +-
 .../applications/[id]/logs/index.svelte       |  2 +-
 5 files changed, 18 insertions(+), 23 deletions(-)

diff --git a/apps/ui/src/routes/applications/[id]/configuration/_PublicRepository.svelte b/apps/ui/src/routes/applications/[id]/configuration/_PublicRepository.svelte
index efad2263d..851b04587 100644
--- a/apps/ui/src/routes/applications/[id]/configuration/_PublicRepository.svelte
+++ b/apps/ui/src/routes/applications/[id]/configuration/_PublicRepository.svelte
@@ -157,22 +157,16 @@
 	}
 </script>
 
-<div class="mx-auto max-w-7xl">
+<div class="mx-auto max-w-5xl">
 	<div class="grid grid-flow-row gap-2 px-10">
 		<div class="flex">
 			<form class="flex" on:submit|preventDefault={loadBranches}>
-				<div class="flex-col">
-					<label for="fqdn" class="pt-2 w-40 text-base font-bold text-stone-100"
-						>Public Git HTTP Url</label
-					>
-
-					<Explainer
-					customClass="w-[32rem]"
-						text="Only works with Github.com and Gitlab.com.<br><br>Examples:<br>https://github.com/coollabsio/nodejs-example<br>https://github.com/coollabsio/nodejs-example/tree/main<br>https://gitlab.com/aleveha/fastify-example<br>https://gitlab.com/aleveha/fastify-example/-/tree/master"
-					/>
-				</div>
 				<div class="space-y-4">
-					<input placeholder="eg: https://github.com/coollabsio/nodejs-example/tree/main" class="w-[32rem]" bind:value={publicRepositoryLink} />
+					<input
+						placeholder="eg: https://github.com/coollabsio/nodejs-example/tree/main"
+						class="text-xs"
+						bind:value={publicRepositoryLink}
+					/>
 					{#if branchSelectOptions.length > 0}
 						<div class="custom-select-wrapper">
 							<Select
@@ -193,10 +187,13 @@
 					{/if}
 				</div>
 
-				<button class="btn mx-4 bg-green-600" class:loading={loading.branches} type="submit"
+				<button class="btn mx-4 bg-orange-600" class:loading={loading.branches} type="submit"
 					>Load Repository</button
 				>
 			</form>
 		</div>
 	</div>
+	<Explainer
+		text="Examples:<br><br>https://github.com/coollabsio/nodejs-example<br>https://github.com/coollabsio/nodejs-example/tree/main<br>https://gitlab.com/aleveha/fastify-example<br>https://gitlab.com/aleveha/fastify-example/-/tree/master<br><br>Only works with Github.com and Gitlab.com."
+	/>
 </div>
diff --git a/apps/ui/src/routes/applications/[id]/configuration/buildpack.svelte b/apps/ui/src/routes/applications/[id]/configuration/buildpack.svelte
index 7a2ad11b4..fc83fe6a6 100644
--- a/apps/ui/src/routes/applications/[id]/configuration/buildpack.svelte
+++ b/apps/ui/src/routes/applications/[id]/configuration/buildpack.svelte
@@ -267,8 +267,8 @@
 		</div>
 	</div>
 {:else}
-	<div class="max-w-7xl mx-auto ">
-		<div class="title pb-2">Coolify Buildpacks</div>
+	<div class="max-w-5xl mx-auto ">
+		<div class="title pb-2">Coolify</div>
 		<div class="flex flex-wrap justify-center">
 			{#each buildPacks.filter((bp) => bp.isCoolifyBuildPack === true) as buildPack}
 				<div class="p-2">
@@ -278,8 +278,8 @@
 		</div>
 	</div>
 
-	<div class="max-w-7xl mx-auto ">
-		<div class="title pb-2">Heroku</div>
+	<div class="max-w-5xl mx-auto ">
+		<div class="title pb-2">Other</div>
 		<div class="flex flex-wrap justify-center">
 			{#each buildPacks.filter((bp) => bp.isHerokuBuildPack === true) as buildPack}
 				<div class="p-2">
diff --git a/apps/ui/src/routes/applications/[id]/configuration/source.svelte b/apps/ui/src/routes/applications/[id]/configuration/source.svelte
index 92718a1db..6c02f35e1 100644
--- a/apps/ui/src/routes/applications/[id]/configuration/source.svelte
+++ b/apps/ui/src/routes/applications/[id]/configuration/source.svelte
@@ -73,7 +73,7 @@ import Explainer from '$lib/components/Explainer.svelte';
 		{$t('application.configuration.select_a_git_source')}
 	</div>
 </div>
-<div class="max-w-7xl mx-auto ">
+<div class="max-w-5xl mx-auto ">
 	<div class="title pb-8">Git App</div>
 	<div class="flex flex-wrap justify-center">
 		{#if !filteredSources || ownSources.length === 0}
@@ -192,9 +192,7 @@ import Explainer from '$lib/components/Explainer.svelte';
 			</div>
 		{/if}
 	</div>
-	<div class="title">Public Repository</div>
+	<div class="title py-4">Public Repository</div>
 
-	<div class="flex flex-wrap justify-center items-center pt-4">
 		<PublicRepository />
-	</div>
 </div>
diff --git a/apps/ui/src/routes/applications/[id]/logs/_BuildLog.svelte b/apps/ui/src/routes/applications/[id]/logs/_BuildLog.svelte
index 70ab93b2d..206cdfc5a 100644
--- a/apps/ui/src/routes/applications/[id]/logs/_BuildLog.svelte
+++ b/apps/ui/src/routes/applications/[id]/logs/_BuildLog.svelte
@@ -109,7 +109,7 @@
 			<div class="flex justify-end sticky top-0 p-2 mx-1">
 				<button
 					on:click={followBuild}
-					class="bg-transparent btn btn-sm tooltip tooltip-primary tooltip-bottom hover:text-green-500 hover:bg-coolgray-500"
+					class="bg-transparent btn btn-sm btn-link tooltip tooltip-primary tooltip-bottom hover:text-green-500 hover:bg-coolgray-500"
 					data-tip="Follow logs"
 					class:text-green-500={followingBuild}
 				>
diff --git a/apps/ui/src/routes/applications/[id]/logs/index.svelte b/apps/ui/src/routes/applications/[id]/logs/index.svelte
index 73e159880..75a650bfa 100644
--- a/apps/ui/src/routes/applications/[id]/logs/index.svelte
+++ b/apps/ui/src/routes/applications/[id]/logs/index.svelte
@@ -147,7 +147,7 @@
 			<div class="flex justify-end sticky top-0 p-1 mx-1">
 				<button
 					on:click={followBuild}
-					class="bg-transparent btn btn-sm tooltip tooltip-primary tooltip-bottom"
+					class="bg-transparent btn btn-sm btn-link tooltip tooltip-primary tooltip-bottom"
 					data-tip="Follow logs"
 					class:text-green-500={followingLogs}
 				>