🔧 Tweaking layout of the CV manual search form

This commit is contained in:
2022-11-17 14:06:26 -08:00
parent af5f443cbe
commit 4556778a47

View File

@@ -42,20 +42,22 @@ export const ComicVineSearchForm = (data) => {
</span> </span>
<div className="field is-horizontal"> <div className="field is-horizontal">
<div className="field-body"> <div className="field-body">
<Field name="issueName"> <div className="field">
{(props) => ( <Field name="issueName">
<p className="control is-expanded has-icons-left"> {(props) => (
<input <p className="control is-expanded has-icons-left">
{...props.input} <input
className="input is-normal" {...props.input}
placeholder="Type the issue name" className="input is-normal"
/> placeholder="Type the issue name"
<span className="icon is-small is-left"> />
<i className="fas fa-journal-whills"></i> <span className="icon is-small is-left">
</span> <i className="fas fa-journal-whills"></i>
</p> </span>
)} </p>
</Field> )}
</Field>
</div>
</div> </div>
</div> </div>
@@ -103,10 +105,10 @@ export const ComicVineSearchForm = (data) => {
<div className="control"> <div className="control">
<button <button
type="submit" 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"> <span className="icon">
<i className="fas fa-hand-sparkles"></i> <i className="fas fa-search"></i>
</span> </span>
<span>Search</span> <span>Search</span>
</button> </button>