Datepicker Position top / bottom

[jatinthapar1910]

The date-picker always open at bottom of page.

But it some case it may be needed to open at top, please check this screenshot:

Ideally here if component automatically adjust based on window then it would be great.

[andresayej]

I needed to change the position of the calendar box to be on the top of the input.
Here is how I achieved it:

#litepie label + div {
    @apply md:top-auto md:bottom-16;
}

/*
* If you are using the default left placement of the arrow
*/
.litepie-datepicker.place-left::before {
    @apply md:top-auto md:bottom-0 md:rotate-[135deg] md:translate-x-2/4 md:translate-y-2/4
}

/*
* If you are using the right placement of the arrow
*/
.litepie-datepicker.place-right::before {
    @apply md:top-auto md:bottom-0 md:rotate-[135deg] md:translate-x-2/4 md:translate-y-2/4
}

Here is the result:

@jatinthapar1910 Hopefully it helps