fix(blocks): refactor calendar-20 layout to fix visual discrepancies

[WonderSTK]

fix(blocks): refactor calendar-20 layout to fix visual discrepancies

Fixes #8854

Description:

This pull request fixes a bug in the Calendar-20 block where the layout does not match the demonstration on the shadcn/ui website. The following issues have been addressed:

• Excessive spacing: The large gap between the calendar and the timeslots has been removed.
• Unexpected scrollbar: The scrollbar that appeared on the timeslots container is now hidden.
• Missing border-radius: The right-top border-radius of the container is now visible.
• Responsiveness: The overall responsiveness of the component has been improved.

Changes:

The main change in this pull request is the refactoring of the layout for the Calendar-20 component. The previous implementation used absolute positioning, which caused the visual discrepancies. The new implementation uses a flexbox-based layout, which is more robust and easier to maintain.

How to test:

1. Add the Calendar-20 block to a project: npx shadcn@latest add calendar-20
2. Observe the rendered component and verify that the layout issues are resolved.

Note:

The project's dependencies could not be installed, so the changes have not been tested. The build, test, and lint commands are all failing due to an esbuild version mismatch.

[vercel]

@WonderSTK is attempting to deploy a commit to the shadcn-pro Team on Vercel.

A member of the Team first needs to authorize it.