update ui

pages/index.js

@@ -4,8 +4,6 @@ import Image from "next/image";
 
 export default function Home() {
   const [input, setInput] = useState();
-  const [defaultValue, setDefaultValue] = useState("Search a city...");
-  const [isCurrentActive, setIsCurrentActive] = useState(true);
   const [weatherData, setWeatherData] = useState();
 
   const clickHandler = async () => {
@@ -17,9 +15,7 @@ export default function Home() {
     const data = await res.json();
     console.log(data);
     setWeatherData({ ...data });
-
     setInput("");
-    // setDefaultValue("sss");
   };
 
   const something = (event) => {
@@ -85,9 +81,7 @@ export default function Home() {
         <input
           type="text"
           className={styles.searchInput}
-          defaultValue={defaultValue}
-          // placeholder="🔍 Search a city ..."
-          value={input}
+          defaultValue="Search a city..."
           onFocus={(e) => (e.target.value = "")}
           onChange={(e) => setInput(e.target.value)}
           onKeyDown={(e) => something(e)}

styles/Home.module.css

@@ -60,14 +60,12 @@
 .searchInput {
   margin-bottom: 20px;
   height: 40px;
-  width: 300px;
-  border: none;
+  width: 200px;
+  border: 2px solid rgb(218, 218, 218);
   padding: 0 10px;
   color: #c5c5c5;
-  /* background-color: none; */
   font-size: 20px;
   text-align: right;
-  /* background-color: rgb(247, 247, 247); */
   border-radius: 20px;
   font-family: "Varela Round", sans-serif;
   font-size: 18px;