From 8355f799f437fa0ac01bdcb5877e41fca022b0a6 Mon Sep 17 00:00:00 2001
From: Brandon Leon <bsleon@umich.edu>
Date: Tue, 3 Nov 2020 00:21:48 -0500
Subject: [PATCH 1/2] Fix resolution of images on cards

---
 src/HOC/AnimeCard/AnimeCard.js         | 2 +-
 src/HOC/CharacterCard/CharacterCard.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/HOC/AnimeCard/AnimeCard.js b/src/HOC/AnimeCard/AnimeCard.js
index 571411b..06fdccd 100644
--- a/src/HOC/AnimeCard/AnimeCard.js
+++ b/src/HOC/AnimeCard/AnimeCard.js
@@ -19,7 +19,7 @@ const AnimeCard = ({ item, history }) => {
     return (
         <motion.div className="Card" whileHover={{ scale: 1.1 }}>
             <div onClick={() => goToAnime(item.mal_id)} className="container">
-                <img src={item.image_url} width="198px" height="198px" alt="Anime pic" />
+                <img src={item.image_url} width="198px" height="298px" alt="Anime pic" />
                 <div className="title">{item.title}</div>
                 <div className="score">{item.score}</div>
             </div>
diff --git a/src/HOC/CharacterCard/CharacterCard.js b/src/HOC/CharacterCard/CharacterCard.js
index e4b132f..9b4e317 100644
--- a/src/HOC/CharacterCard/CharacterCard.js
+++ b/src/HOC/CharacterCard/CharacterCard.js
@@ -20,7 +20,7 @@ const CharacterCard = ({ item, history }) => {
         <motion.div className="Card" whileHover={{ scale: 1.1 }}>
             <div onClick={() => goToCharacter(item.id)} className="container">
                 {item.attributes.image 
-                    ?<img src={item.attributes.image.original} width="198px" height="198px" alt="Character pic" />
+                    ?<img src={item.attributes.image.original} width="198px" height="298px" alt="Character pic" />
                      :<img src="https://pngimage.net/wp-content/uploads/2018/06/no-image-available-png-3.png" width="198px" height="198px" alt="Character pic" />
                 }
                 <div className="title">{item.attributes.name}</div>

From 67dcb075926105f57f01811cec837acaf4ddffa4 Mon Sep 17 00:00:00 2001
From: Brandon Leon <bsleon@umich.edu>
Date: Tue, 3 Nov 2020 00:52:14 -0500
Subject: [PATCH 2/2] Add Enter key-press for search submit

---
 src/HOC/Header/Header.js | 82 +++++++++++++++++++++++-----------------
 1 file changed, 48 insertions(+), 34 deletions(-)

diff --git a/src/HOC/Header/Header.js b/src/HOC/Header/Header.js
index 44fdd3f..0ff9362 100644
--- a/src/HOC/Header/Header.js
+++ b/src/HOC/Header/Header.js
@@ -2,44 +2,58 @@ import React, { useState } from "react";
 import { withRouter, Link } from "react-router-dom";
 
 //Importing Styles
-import "./Header.css"
+import "./Header.css";
 
 const Header = (props) => {
-    const [searchText, setSearchText] = useState("");
-    const [searchType, setSearchType] = useState(0);
+	const [searchText, setSearchText] = useState("");
+	const [searchType, setSearchType] = useState(0);
 
-    const hanldeSearch = () => {
-        props.history.push({
-            pathname: '/search',
-            state: {
-                searchText: searchText,
-                searchType: searchType,
-            }
-        });
-    }
+    const handleSearch = (e) => {
+		e.preventDefault();
+		props.history.push({
+			pathname: "/search",
+			state: {
+				searchText: searchText,
+				searchType: searchType,
+			},
+		});
+	};
 
-    return (
-        <div className="Header">
-            <div className="Logo">
-                <Link to="/">
-                    <h4>Aniverse</h4>
-                </Link>
-            </div>
-            <div className="Search-Box">
-                <input
-                    type="text"
-                    value={searchText}
-                    onChange={(e) => setSearchText(e.target.value)}
-                    placeholder={"Search"}
-                />
-                <button onClick={() => hanldeSearch()}> <i className="fas fa-search"></i> </button>
-            </div>
-            <div className="Selector">
-                <button className={searchType === 0 ? "selected" : ""} onClick={() => setSearchType(0)}>Anime</button>
-                <button className={searchType === 1 ? "selected" : ""} onClick={() => setSearchType(1)}>Character</button>
-            </div>
-        </div>
-    );
+	return (
+		<div className="Header">
+			<div className="Logo">
+				<Link to="/">
+					<h4>Aniverse</h4>
+				</Link>
+			</div>
+			<form className="Search-Box" onSubmit={handleSearch}>
+				<input
+					type="text"
+					value={searchText}
+					onChange={(e) => setSearchText(e.target.value)}
+					placeholder={"Search"}
+				/>
+				<button type="submit">
+					{" "}
+					<i className="fas fa-search"></i>{" "}
+				</button>
+			</form>
+			<div className="Selector">
+				<button
+					className={searchType === 0 ? "selected" : ""}
+					onClick={() => setSearchType(0)}
+				>
+					Anime
+				</button>
+				<button
+					className={searchType === 1 ? "selected" : ""}
+					onClick={() => setSearchType(1)}
+				>
+					Character
+				</button>
+			</div>
+		</div>
+	);
 };
 
 export default withRouter(Header);