1

I am using reactDatePikcer and needs to change next and previous navigation with some other icons. Can't see any API to change next and previous buttons.

enter image description here

As3Script
  • 137
  • 4
  • 16

2 Answers2

0

Use CSS. For example to hide the arrow created with border properties and replace it your own css, text of icon font.

/* Hide current arrow */
.react-datepicker__navigation--previous {
   border-right-color: transparent;
} 
/* Display something else */
.react-datepicker__navigation--previous:after {
   content: 'XXX'
}
Jkarttunen
  • 6,764
  • 4
  • 27
  • 29
  • transparent hides but cant :after content is not replacing. Seems like it should work but not replacing. – As3Script Dec 09 '20 at 12:05
0

Try using the pickers from material-ui. They provide a hook to customize their components and also just make pickers look alot better in my opinion.

nicolabaechi
  • 55
  • 2
  • 8