From 8430e828e9b53f291c7d6a3e1a9405d20c78ca4e Mon Sep 17 00:00:00 2001
From: Adam Townsend <adam@desnudopenguino.com>
Date: Thu, 5 Oct 2023 08:44:41 -0700
Subject: [PATCH] adjusted UI more + set input and button to be wider + set min
 height on the main to be longer to look better between views + bumped
 shortened url down some to fill the gap more

---
 views/create.erb |  2 +-
 views/home.erb   | 18 +++++++++++-------
 views/layout.erb | 11 +++++++----
 3 files changed, 19 insertions(+), 12 deletions(-)

diff --git a/views/create.erb b/views/create.erb
index 6d3a1f7..ddf4b56 100644
--- a/views/create.erb
+++ b/views/create.erb
@@ -1 +1 @@
-<h3 style="overflow-wrap: break-word; word-wrap: break-word;"><a href="<%= @new_link %>" target="_blank"><%= @new_link %></a></h3>
+<h3 style="overflow-wrap: break-word; word-wrap: break-word; line-height: 120px;"><a href="<%= @new_link %>" target="_blank"><%= @new_link %></a></h3>
diff --git a/views/home.erb b/views/home.erb
index e94d3c6..7566c5e 100644
--- a/views/home.erb
+++ b/views/home.erb
@@ -1,9 +1,13 @@
 <form method="POST" action="/create">
-  <input type="url"
-    name="url"
-    pattern="https?://.+"
-    placeholder="http://www.example.com/"
-    autocomplete="off"
-    required />
-  <button type="submit">Submit</button>
+  <div style="margin-bottom: 1rem;">
+    <input type="url"
+      name="url"
+      pattern="https?://.+"
+      placeholder="http://www.example.com/"
+      autocomplete="off"
+      required />
+  </div>
+  <div>
+    <button type="submit">Submit</button>
+  </div>
 </form>
diff --git a/views/layout.erb b/views/layout.erb
index 44e5fab..c402792 100644
--- a/views/layout.erb
+++ b/views/layout.erb
@@ -30,16 +30,19 @@
         padding: 1rem;
         margin-top: 5rem;
         text-align: center;
-        min-height: 200px;
+        min-height: 260px;
         box-shadow: 3px 2px 10px var(--shadow);
         background: var(--white);
       }
 
+      input, button {
+        width: 80%;
+      }
+
       input {
         padding: 1rem;
         border-radius: 5px;
         border: 3px solid var(--dark-blue);
-        margin-right: 1rem;
         outline: none;
         transition: all .25s ease-in-out;
         -moz-transition: all .25s ease-in-out;
@@ -55,7 +58,7 @@
         padding: 1rem;
         border-radius: 5px;
         border: 2px solid var(--darker-blue);
-        background: var(--darker-blue);
+        background: var(--dark-blue);
         font-weight: bold;
         transition: background .25s ease-in-out;
         -moz-transition: background .25s ease-in-out;
@@ -63,7 +66,7 @@
       }
 
       button:hover {
-        background: var(--dark-blue);
+        background: var(--darker-blue);
       }
 
       button:active {