Using DayPickerSingleDateController it seems the prev does not have a specific class associated to the button. For example, the next button has DayPickerNavigation_rightButton__horizontalDefault, wouldn't the prev button have DayPickerNavigation_leftButton__horizontalDefault? I see this defined in the styles, but it doesn't seem to be getting applied. Is there something I'm missing?
This is previous button:
<button class="DayPickerNavigation_button DayPickerNavigation_button_1 DayPickerNavigation_button__horizontal DayPickerNavigation_button__horizontal_2" type="button" aria-label="Move backward to switch to the previous month."><div>prev</div></button>
and next button:
<button class="DayPickerNavigation_button DayPickerNavigation_button_1 DayPickerNavigation_button__default DayPickerNavigation_button__default_2 DayPickerNavigation_button__horizontal DayPickerNavigation_button__horizontal_3 DayPickerNavigation_button__horizontalDefault DayPickerNavigation_button__horizontalDefault_4 DayPickerNavigation_rightButton__horizontalDefault DayPickerNavigation_rightButton__horizontalDefault_5" type="button" aria-label="Move forward to switch to the next month."><svg class="DayPickerNavigation_svg__horizontal DayPickerNavigation_svg__horizontal_1" viewBox="0 0 1000 1000"><path d="M694.4 242.4l249.1 249.1c11 11 11 21 0 32L694.4 772.7c-5 5-10 7-16 7s-11-2-16-7c-11-11-11-21 0-32l210.1-210.1H67.1c-13 0-23-10-23-23s10-23 23-23h805.4L662.4 274.5c-21-21.1 11-53.1 32-32.1z"></path></svg></button>
I can use DayPickerNavigation_button__horizontal_2 to specifically target the prev button, but just seems like perhaps I'm missing something here. Thank you!
Ok, so I guess when defining custom content to the buttons navPrev and navNext this actually changes the containing buttons styles. Is there a way when defining these to specify a custom class for the actual button itself?
Which version of react-dates are you using @btmdave? The answer kind of depends because we made a major change in v17!
@majapw Thanks, using 17.0.0
I'm interested in this as well. I'd like to swap out the prevNav/nextNav svg arrows for another set. Setting these properties to an img node causes the containing buttons to lose their styles. Those containing button styles are useful for aligning the DayPickerNavigation_button with the CalendarMonth_caption.
I am also having this issue. When setting custom navigation components the elements lose the class names which correctly position/align them.
Any update about that?
Most helpful comment
I'm interested in this as well. I'd like to swap out the prevNav/nextNav svg arrows for another set. Setting these properties to an img node causes the containing buttons to lose their styles. Those containing button styles are useful for aligning the DayPickerNavigation_button with the CalendarMonth_caption.