Form Control styling from React Bootstrap is not reflecting in timeInput of ReactDatePicker

Viewed 17

I am using ReactDatePicker with React Bootstrap. I have applied form-control className to make the DatePicker pick up the default stylings of bootstrap as shown in the code below.

     <DatePicker
            minDate={new Date()}
            selected={selectedTime}
            onChange={(date) => {
                setSelectedTime(date);
            }}
            formatWeekDay={day => day.slice(0, 3)}
            className='form-control'
            placeholderText="Select Date & Time"
            timeIntervals={1}
            dateFormat="MM/dd/yyyy h:mm aa"
            showTimeInput
            fixedHeight
        />

However the time input component is having a transparent background as shown in the image below enter image description here

The DatePicker is been used from within a Modal.

How can I fix this please?

Thanks

0 Answers
Related