Fix Animation Positioning on Vertical Monitors

[onurhan1337]

This pull request addresses the issue of the code block's bottom 20% being visible on vertical monitors. The changes ensure that the entire code block is properly displayed, enhancing the overall user experience.

Changes include:

• Adjusted the positioning of the code block using Tailwind CSS utilities.
• Tested the changes on different screen sizes and orientations for consistency.
• With these changes, users on vertical monitors will have a better viewing experience, with the code block animation appearing in the correct position.

Example of resolved issue

The picture above shows the problem. With this PR, the 'code-overlay' size problem has been resolved and a better user experience has been provided.

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
input-otp-x1vw	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Feb 20, 2024 10:53am
rodz-input-otp	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Feb 20, 2024 10:53am

[guilhermerodz]

Thanks for pointing this out! I have now solved it in a slightly different way at e44c2de (doesn't require media queries)