Is it possible to change the highlight shape and size of a date?
Right now, when i set customDatesStyles with a background color, it get applied as a big circle around the date. Is it possible to change the shape to be a square instead of a circle?
Also, Can the radius of the circle be decreased? By default, it is bigger than what I would want. I don't see nay properties to directly change it.
Can it be set through either dateContainerStyle in customDatesStyles? I don't see any example of a way to do that.
After going through the code, I see it is possible to do these. I couldn't get it working exactly as I wanted, but I see that it can be possible. I probably have to dig into the code a little bit more to get the necessary details.
For anyone interested, here is how this can be done:
To change the shape from a circle to square, we can play with the borderRadius parameter in the dateContainerStyle. So, something like the following will create rounded squares.
<CalendarStrip
....
customDatesStyles={(date) => {
dateContainerStyle: {
borderRadius: 5
}}
/>
Similarly, for adjusting the size of the circle, we have width and height properties for the dateContainerStyle object.
I am trying to see if I can change the size of the circle without changing the size of the date, but I haven't been able to figure that out yet. I will keep this open until I find that too or get an answer from someone.
For anyone, wondering, I found these from the CalendarDay.js file in the code.