import React, { useState } from "react";
import "./styles.css";
export default function App() {
  const [mynum, setMynum] = useState("");
  return (
    <div
      className="App"
      style={
        mynum % 2 === 0
          ? { backgroundColor: "aquamarine" }
          : { backgroundColor: "#f54545" }
      }
    >
      <input
        type="number"
        placeholder="Enter the Number"
        value={mynum}
        onChange={(e) => setMynum(Number(e.target.value))}
      />

      <button onClick={() => setMynum("")}>Reset</button>
      <button onClick={() => setMynum((count) => count - 1)}>-</button>
      <button onClick={() => setMynum((count) => Number(count) + 1)}>+</button>
      <h2>Number:{mynum}</h2>
      {mynum % 2 == 0 ? <p>Even Number</p> : <p>Odd Number</p>}
    </div>
  );
}