How to change background color of react-day-picker?

Question

I would like to change the background color of the day picker but I can't seem to find a way. Here is my code:

.DayPicker-wraper {
  background-color: black;
}

<DayPickerInput 
        placeholder={"Date..."} 
        onDayChange={day => setNewDate(day)}
/>

And here is the DOM structure for the day picker

Is the fact that you use -wraper instead of -wrapper just a typo here on SO or is that the actual problem with your code? — LeppyR64, Dec 31 '21 at 05:11

Kahzpa · Answer 1 · 2022-01-04T19:14:50.867

1

In your example the class you're targetting is 'DayPicker-wraper' while the DOM seems to have the classname as 'DayPicker-wrapper'. Alternatively, could you not also add a className like so then target that?

<DayPickerInput 
    className='date-picker'
    placeholder={"Date..."} 
    onDayChange={day => setNewDate(day)}
/>

edited Jan 04 '22 at 19:14

answered Dec 31 '21 at 05:12

Kahzpa

11
3

How to change background color of react-day-picker?

1 Answers1