search

hypeserver / react-date-range

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

Custom text in DateDisplay fields #394

Open alimovz opened 4 years ago

alimovz commented 4 years ago

Is there a way to add some custom text to the From and To fields above the calendar? Here is an example: https://ibb.co/WzQTDj8

chrisclausen90 commented 4 years ago

Maybe you can try with css pseudo elements

Try to implement this on your stylings

span.rdrDateInput.rdrDateDisplayItem::before { content: 'To:'; position: absolute; display: inline-block; width: 185px; color: black; font-size: 1.8rem; }

span.rdrDateInput.rdrDateDisplayItem.rdrDateDisplayItemActive::before { content: 'From:'; }