import React from "react";

export default function DashboardCard(
  props: React.PropsWithChildren<{
    id?: string;
    title: string;
    value?: string;
  }>,
) {
  return (
    <div className="flex flex-col border rounded-xl bg-gql-white w-full h-48 p-5 shadow">
      <p className="text-md font-bold tracking-tight text-bold text-sideitem-hover-bgy text-gql-vis-darkblue">
        {props.title}
      </p>
      <p id={props.id} className="text-3xl font-bold text-blue-400 m-auto">
        {props.value || 0}
      </p>
    </div>
  );
}
