From bc15c6140e8c5786d318544bef92d0781344a2f7 Mon Sep 17 00:00:00 2001
From: George Tsiolis <tsiolis.g@gmail.com>
Date: Thu, 19 May 2022 19:18:09 +0000
Subject: [PATCH] Update dotfiles layout

---
 .../dashboard/src/settings/Preferences.tsx    | 29 ++++++++++---------
 1 file changed, 16 insertions(+), 13 deletions(-)

diff --git a/components/dashboard/src/settings/Preferences.tsx b/components/dashboard/src/settings/Preferences.tsx
index 8ffc089691d7ca..5e43c2dd7d82ad 100644
--- a/components/dashboard/src/settings/Preferences.tsx
+++ b/components/dashboard/src/settings/Preferences.tsx
@@ -123,24 +123,27 @@ export default function Preferences() {
                     </PillLabel>
                 </h3>
                 <p className="text-base text-gray-500 dark:text-gray-400">Customize workspaces using dotfiles.</p>
-                <div className="mt-4 max-w-md">
+                <div className="mt-4 max-w-xl">
                     <h4>Repository URL</h4>
-                    <input
-                        type="text"
-                        value={dotfileRepo}
-                        className="w-full"
-                        placeholder="e.g. https://github.com/username/dotfiles"
-                        onChange={(e) => setDotfileRepo(e.target.value)}
-                    />
+                    <span className="flex">
+                        <input
+                            type="text"
+                            value={dotfileRepo}
+                            className="w-96 h-9"
+                            placeholder="e.g. https://github.com/username/dotfiles"
+                            onChange={(e) => setDotfileRepo(e.target.value)}
+                        />
+                        <button className="secondary ml-2" onClick={() => actuallySetDotfileRepo(dotfileRepo)}>
+                            Save Changes
+                        </button>
+                    </span>
                     <div className="mt-1">
                         <p className="text-gray-500 dark:text-gray-400">
-                            Add a repository URL that includes dotfiles. Gitpod will clone and install your dotfiles for
-                            every new workspace.
+                            Add a repository URL that includes dotfiles. Gitpod will
+                            <br />
+                            clone and install your dotfiles for every new workspace.
                         </p>
                     </div>
-                    <div className="mt-4 max-w-md">
-                        <button onClick={() => actuallySetDotfileRepo(dotfileRepo)}>Save Changes</button>
-                    </div>
                 </div>
             </PageWithSubMenu>
         </div>