React-dates: Adjust the inner padding of the calendar

[manatarms]

Thanks for this awesome calendar component.

I've been trying to reduce the padding between the calendar edge and the date table, but the values seem to be set dynamically during width and height calculation.

I don't want to hard code the height and width values of the calendar, because that makes things look weird when the number of days in the month change. I also thought of setting a max-height, but it makes the calendar padding inconsistent between months.
Here's a screenshot of what I'm trying to do. The padding I'm trying to reduce is shown by the red arrows.

Is there a way for me to reduce those values?
Thanks!

[austenpayan]

+1 for this. Tried overriding the .CalendarMonth padding values, but it seems to cause jank when switching months. Anyone have an idea how to do this smoothly?

[iliran11]

Try to pass in daySize prop the following expression:
daysize={window.innerWidth/7}

[dibrovadev]

+1
I inspect source code and didn't find any chance to change this values without problems with transition

[majapw]

I think that we need to have innerPadding be determined by a prop passed into the component (or maybe by a theme variable). I think we will need this eventually as well internally.

[Nickx58]

How can i increase the height and width of the calendar ?

[manatarms]

Awesome. I'll make a pull request soon. Thanks!

[sebas-deedee]

Any update on this?

[liplylie]

Since I couldn't reduce the padding, I adjusted the size of the days using the daySize prop.