fix: month/week view events and grid misaligned

[smilewilson1999]

Reason

1. .rbc-abs-full sets right: 0, which makes the background fill the entire container.
2. .rbc-row-bg overrides it with right: 1px, shrinking the background by 1px from the right.
3. This causes a width mismatch between the background layer and the header layer.

Related Issue

Fixes #2783

Changes

• Styles (Remove right: 1px; from .rbc-row-bg)

Testing

• Local testing completed
• Unit tests pass
• Manual testing done

Sandbox Demo

Screenshots/Video

Before

After

[smilewilson1999]

@cutterbl @jquense Hi, sorry to ping you guys. Would you be able to review this PR?

I'm using react-big-calendar for our project and find this bug. Just a small fix, but I think it makes UI way better.

[vanquandang]

Hi @smilewilson1999, sorry to ping you. I have bumped into the same issue as yours and thanks to you I have managed to fix it at some point.

Have you managed to improve the solution for this small issue since then?
I'm using react-big-calendar with the resources prop. There can be up to 30 users (resources), and with each additional user the layout shifts slightly, making the width mismatch quite noticeable.

[smilewilson1999]

@vanquandang I think it can also be fixed within src/sass/month.scss Try to add/remove some right/left css code.