From 4556778a470a646bf3756efe39b092ded71b7ddf Mon Sep 17 00:00:00 2001
From: Rishi Ghan <rishi.ghan@gmail.com>
Date: Thu, 17 Nov 2022 14:06:26 -0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20Tweaking=20layout=20of=20the=20C?=
 =?UTF-8?q?V=20manual=20search=20form?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/client/components/ComicVineSearchForm.tsx | 34 ++++++++++---------
 1 file changed, 18 insertions(+), 16 deletions(-)

diff --git a/src/client/components/ComicVineSearchForm.tsx b/src/client/components/ComicVineSearchForm.tsx
index 25471d9..0b95ce3 100644
--- a/src/client/components/ComicVineSearchForm.tsx
+++ b/src/client/components/ComicVineSearchForm.tsx
@@ -42,20 +42,22 @@ export const ComicVineSearchForm = (data) => {
           </span>
           <div className="field is-horizontal">
             <div className="field-body">
-              <Field name="issueName">
-                {(props) => (
-                  <p className="control is-expanded has-icons-left">
-                    <input
-                      {...props.input}
-                      className="input is-normal"
-                      placeholder="Type the issue name"
-                    />
-                    <span className="icon is-small is-left">
-                      <i className="fas fa-journal-whills"></i>
-                    </span>
-                  </p>
-                )}
-              </Field>
+              <div className="field">
+                <Field name="issueName">
+                  {(props) => (
+                    <p className="control is-expanded has-icons-left">
+                      <input
+                        {...props.input}
+                        className="input is-normal"
+                        placeholder="Type the issue name"
+                      />
+                      <span className="icon is-small is-left">
+                        <i className="fas fa-journal-whills"></i>
+                      </span>
+                    </p>
+                  )}
+                </Field>
+              </div>
             </div>
           </div>
 
@@ -103,10 +105,10 @@ export const ComicVineSearchForm = (data) => {
                 <div className="control">
                   <button
                     type="submit"
-                    className="button is-info is-light is-outlined is-small"
+                    className="button is-success is-light is-outlined is-small"
                   >
                     <span className="icon">
-                      <i className="fas fa-hand-sparkles"></i>
+                      <i className="fas fa-search"></i>
                     </span>
                     <span>Search</span>
                   </button>