import { faHardDrive } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";

type StatusItemProps = {
  statusInfoItem: string;
  description: string;
};

const StatusItemCPU = ({ statusInfoItem, description }: StatusItemProps) => {
  return (
    <div className="p-3 border border-gray-700 rounded-lg hover:bg-[#233241]">
      <div className="flex flex-row gap-2 items-center">
        <span className="font-bold text-xl bg-slate-700 p-1 px-2 rounded-md">
          <FontAwesomeIcon icon={faHardDrive} />
        </span>
        <p className="text-lg">{statusInfoItem}</p>
      </div>
      <p className="text-slate-400">{description}</p>
    </div>
  );
};

export default StatusItemCPU;