From e6035d5479ce980794d4601e33e9b5256ff69423 Mon Sep 17 00:00:00 2001
From: LL <limalucas454@gmail.com>
Date: Wed, 31 Aug 2022 01:05:44 -0300
Subject: [PATCH] improving localdocker responsiveness

---
 apps/ui/src/lib/components/Setting.svelte              |  2 +-
 .../src/routes/destinations/[id]/_LocalDocker.svelte   | 10 +++++-----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/apps/ui/src/lib/components/Setting.svelte b/apps/ui/src/lib/components/Setting.svelte
index 30f45755b..04e5f1eac 100644
--- a/apps/ui/src/lib/components/Setting.svelte
+++ b/apps/ui/src/lib/components/Setting.svelte
@@ -10,7 +10,7 @@
 	export let loading = false;
 </script>
 
-<div class="flex items-center py-4 pr-8">
+<div class="flex items-center py-4 pr-8 max-w-xs">
 	<div class="flex w-96 flex-col">
 		<div class="text-xs font-bold text-stone-100 md:text-base">{title}</div>
 		<Explainer text={description} />
diff --git a/apps/ui/src/routes/destinations/[id]/_LocalDocker.svelte b/apps/ui/src/routes/destinations/[id]/_LocalDocker.svelte
index 71e4c06ab..6a177d309 100644
--- a/apps/ui/src/routes/destinations/[id]/_LocalDocker.svelte
+++ b/apps/ui/src/routes/destinations/[id]/_LocalDocker.svelte
@@ -142,7 +142,7 @@
 </script>
 
 <form on:submit|preventDefault={handleSubmit} class="grid grid-flow-row gap-2 py-4">
-	<div class="flex space-x-1 pb-5">
+	<div class="grid gap-1 lg:grid-flow-col lg:w-96 w-64">
 		<div class="title font-bold">{$t('forms.configuration')}</div>
 		{#if $appSession.isAdmin}
 			<button
@@ -162,7 +162,7 @@
 			>
 		{/if}
 	</div>
-	<div class="grid grid-cols-2 items-center px-10 ">
+	<div class="grid lg:grid-cols-2 items-center px-10 ">
 		<label for="name" class="text-base font-bold text-stone-100">{$t('forms.name')}</label>
 		<input
 			name="name"
@@ -173,7 +173,7 @@
 		/>
 	</div>
 
-	<div class="grid grid-cols-2 items-center px-10">
+	<div class="grid lg:grid-cols-2 items-center px-10">
 		<label for="engine" class="text-base font-bold text-stone-100">{$t('forms.engine')}</label>
 		<CopyPasswordField
 			id="engine"
@@ -184,7 +184,7 @@
 			value={destination.engine}
 		/>
 	</div>
-	<div class="grid grid-cols-2 items-center px-10">
+	<div class="grid lg:grid-cols-2 items-center px-10">
 		<label for="network" class="text-base font-bold text-stone-100">{$t('forms.network')}</label>
 		<CopyPasswordField
 			id="network"
@@ -196,7 +196,7 @@
 		/>
 	</div>
 	{#if $appSession.teamId === '0'}
-		<div class="grid grid-cols-2 items-center">
+		<div class="grid lg:grid-cols-2 items-center">
 			<Setting
 				loading={loading.proxy}
 				disabled={cannotDisable}