hypeserver / react-date-range

A React component for choosing dates and date ranges.
MIT License
2.58k stars 667 forks source link

Editable Date Input #421

Closed farrukhrashid1997 closed 3 years ago

farrukhrashid1997 commented 3 years ago

Bring Editable Date Input to the bottom of the calendar

I am using the Date Range and I have enabled the editable date input, I would like the input to appear at the bottom of the calendar.

I have tried using the provided className but they end up working on the calendar.

Environment

Package Version: ^1.1.3 React version: ^17.0.1 Node version: 12.18.0 Browser: Chrome

image

farrukhrashid1997 commented 3 years ago

Just add classNames={{ dateDisplayWrapper: "dateDisplayWrapper", }}

in the props of DateRange/DateRangePicker

Then make a dateDisplayWrapper class and add this: -webkit-box-ordinal-group: 2; order: 1;

Hope this helps someone.