Changing the color of minDate in react-calender when any other date is selected

Viewed 198

I am using a react-calender npm. It allows us to use custom calendar in react. The link below is the live demo of what I am doing:

https://codesandbox.io/live/4ac4910b380

 <Calendar
    onChange={changedate}
    value={date}
    minDate={new Date()}
  />

This is my code for using the calendar. There is a minDate prop which allows us to select the minimum date beyond this date user cannot select a date. I am using current time(new Date()) as the minDate. When I am trying to select any date other than the minDate, the minDate's color is becoming yellow enter image description here

I could not think of any way to change this color to white. I tried using tileClassName prop but it is also changing the color of the tiles which are disabled. I do not want to do that.

Is there any way to change the color of minDate to any other color without changing the color of any other tile?

1 Answers

I think you can add this class in your css file..

.react-calendar__tile--now {
  background: #purple; //or another color you want
}
Related