well, I tried something

6 files changed, 45 insertions, 31 deletions

diff --git a/src/app/anime/search/page.jsx b/src/app/anime/search/page.jsx
index bf399cf..e94ef92 100644
--- a/src/app/anime/search/page.jsx
+++ b/src/app/anime/search/page.jsx
@@ -12,28 +12,28 @@ export default function Input() {
 	const [loading, setLoading] = useState(null);

 	const [info, setInfo] = useState(null);

 

-	const handleKeyPress = async (event) => {

-		if (

-			(event.code === "Enter" ||

-				event.key === "Enter" ||

-				event.code === 13) &&

-			searchedAnime !== ""

-		) {

-			setLoading(true);

-			setInfo(await fetchedInfo(await Results(searchedAnime)));

-			setLoading(false);

-		} else if (

-			(event.code === "Enter" ||

-				event.key === "Enter" ||

-				event.code === 13) &&

-			searchedAnime === ""

-		) {

-			alert("Input cannot be empty");

-		}

-	};

+	// const handleKeyPress = async (event) => {

+	// 	if (

+	// 		(event.code === "Enter" ||

+	// 			event.key === "Enter" ||

+	// 			event.code === 13) &&

+	// 		searchedAnime !== ""

+	// 	) {

+	// 		setLoading(true);

+	// 		setInfo(await fetchedInfo(await Results(searchedAnime)));

+	// 		setLoading(false);

+	// 	} else if (

+	// 		(event.code === "Enter" ||

+	// 			event.key === "Enter" ||

+	// 			event.code === 13) &&

+	// 		searchedAnime === ""

+	// 	) {

+	// 		alert("Input cannot be empty");

+	// 	}

+	// };

 

 	return (

-		<div style={{marginBottom: -15}}>

+		<div style={{ marginBottom: -15 }}>

 			<div className={styles.inputContainer}>

 				<div className={styles.searchContainer}>

 					<FaSearch className={styles.searchIcon} />

@@ -43,7 +43,15 @@ export default function Input() {
 								setSearchedAnime(event.target.value);

 							}

 						}}

-						onKeyDown={(event) => handleKeyPress(event)}

+						onKeyDown={async (event) => {

+							if (event.code !== 8) {

+								setInfo(

+									await fetchedInfo(

+										await Results(searchedAnime)

+									)

+								);

+							}

+						}}

 						placeholder="Enter anime title"

 						className={styles.SearchInput}

 					></input>

diff --git a/src/app/anime/search/search.module.css b/src/app/anime/search/search.module.css
index 185f6d5..bbb2795 100644
--- a/src/app/anime/search/search.module.css
+++ b/src/app/anime/search/search.module.css
@@ -40,7 +40,7 @@
 .searchContainer {

 	display: flex;

 	align-items: center;

-	margin: 20px 0px 20px 0px;

+	margin: 20px 0px 10px 0px;

 	background-color: #121212;

 	padding: 10px;

 	border-radius: 10px;

@@ -55,8 +55,7 @@
 .animeEntry {

 	display: flex;

 	overflow-x: auto;

-	margin-bottom: 1rem;

-	margin-left: 0.5rem;

+	margin: 0 0 1rem 0.5rem;

 }

 

 .animeEntry:hover .anime {

@@ -111,4 +110,4 @@
 	.anime p {

 		width: 50dvw;

 	}

-}

+}
\ No newline at end of file
diff --git a/src/app/kdrama/components/search.jsx b/src/app/kdrama/components/search.jsx
index f44e4bb..1d1b93b 100644
--- a/src/app/kdrama/components/search.jsx
+++ b/src/app/kdrama/components/search.jsx
@@ -21,13 +21,20 @@ export default function DramaSearch() {
 		setInfoTitle(data);

 	};

 

+	const fetch_every_title = async (title) => {

+		FetchSearchTitle(title);

+	};

+

 	return (

 		<div className={styles.SearchContainer}>

 			<div className={styles.Search}>

 				<FaSearch color="white" size={16} />

 				<input

 					placeholder="Search for drama"

-					onChange={(event) => setTitle(event.target.value)}

+					onChange={(event) => {

+						setTitle(event.target.value);

+						fetch_every_title(title);

+					}}

 					onKeyDown={async (e) => {

 						if ((e.key === "Enter" || e.code === 13) && title) {

 							await handleSearch(e.target.value);

diff --git a/src/app/movies/components/search.jsx b/src/app/movies/components/search.jsx
index 6514b76..20f8cac 100644
--- a/src/app/movies/components/search.jsx
+++ b/src/app/movies/components/search.jsx
@@ -24,9 +24,9 @@ export default function SEARCH_COMPONENT() {
 				<input
 					placeholder="Enter movie title here"
 					onChange={(event) => setTitle(event.target.value)}
-					onKeyDown={async (e) => {
-						if ((e.key === "Enter" || e.code === 13) && title) {
-							await fetch_results(e.target.value);
+					onKeyDown={async (event) => {
+						if (event.code !== 8) {
+							await fetch_results(title);
 						}
 					}}
 				></input>
diff --git a/src/app/movies/components/search_2.jsx b/src/app/movies/components/search_2.jsx
index fbfc714..82bba52 100644
--- a/src/app/movies/components/search_2.jsx
+++ b/src/app/movies/components/search_2.jsx
@@ -20,7 +20,7 @@ const SearchResults = async (title) => {
 								href={`/movies/${item.id}`}
 								key={index}
 								style={{
-									backgroundImage: `url(https://image.tmdb.org/t/p/original${item.backdrop_path})`,
+									backgroundImage: `url(https://sup-proxy.zephex0-f6c.workers.dev/api-content?url=https://image.tmdb.org/t/p/original${item.backdrop_path})`,
 									backgroundRepeat: "no-repeat",
 									backgroundSize: "cover",
 									textDecoration: "none",
diff --git a/src/app/movies/styles/search.module.css b/src/app/movies/styles/search.module.css
index 1148ad0..66b6046 100644
--- a/src/app/movies/styles/search.module.css
+++ b/src/app/movies/styles/search.module.css
@@ -73,4 +73,4 @@
 	.InputContainer {
 		width: 100%;
 	}
-}
+}
\ No newline at end of file