import {CalendarX2, Plus} from "lucide-react";
import {Button} from "@/components/ui/button";
import React from "react";

export default function NoAppointmentsContainer() {
    return (
        <div className={"h-full flex items-center justify-center grow"}>
            <div className={"text-green-950 flex flex-col justify-center items-center gap-4"}>

                <CalendarX2 size={36} className={"text-red-950"}/>
                <div className={"text-center"}>
                    <p className={"font-semibold"}>You have no appoints for this day.</p>
                    <p>Don't fret. Tap the add new appointment button to add one now.</p>
                </div>

                <Button className={"flex gap-2 mt-4"}>
                    <Plus size={20}/>
                    Add New Appointment
                </Button>

            </div>
        </div>
    )
}