Feature Rich Card - Copy this React, Tailwind Component to your project

<Card className="bg gray 800 text white"> <CardHeader className="flex flex row items center justify between space y 0 pb 2"> <CardTitle className="text sm font medium"> New User Sign Up </CardTitle> </CardHeader> <CardContent> <div className="text 2xl font bold"> {newUserSignUp?.getAnalyticsUsersSignUp?.signUpStats?.reduce( (total, item) => total + item.count, 0 )} </div> <p className="text xs text gray 400"> { timePeriodOptions.find((item) => item.value === timePeriod) ?.label } </p> </CardContent> </Card>