FrancescoXX / rustcrab

An Open Source project with everything you need to learn about Rust.
https://rustcrab.com
MIT License
402 stars 69 forks source link

[Fix : 127] Improve Navbar UI for mobile device #130

Open iharsh02 opened 1 month ago

iharsh02 commented 1 month ago

Description

Please include a summary of the change and which issue is fixed. Please also include relevant motivation and context. List any dependencies that are required for this change.

Fixes #127

Type of change

Please delete options that are not relevant.

Test Required (Yes / No)

If Yes then How Has This Been Tested?

Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration

Test Configuration:

image

Checklist:

Preview

https://github.com/user-attachments/assets/0184f993-5f34-4c75-9777-88b62a7f347d

Summary by CodeRabbit

vercel[bot] commented 1 month ago

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

Name Status Preview Comments Updated (UTC)
rustcrab ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jul 26, 2024 5:43pm
coderabbitai[bot] commented 1 month ago

Walkthrough

The changes enhance the mobile navbar's UI by updating styling and menu rendering. The main element's className is modified with overflow-hidden to manage content overflow. The MobileNav component is refactored for consistency in quotes, includes a background overlay, and adjusts menu item positioning, improving the mobile view for a better user experience.

Changes

File Change Summary
src/app/page.tsx Added overflow-hidden to the className of the main element to control content overflow.
src/components/navbar/MobileNav.tsx Updated import statements and string values to use double quotes; refactored mobile menu for better UI.

Assessment against linked issues

Objective Addressed Explanation
Improve the mobile navbar to use 100vw 100vh for better visibility (#127)

Poem

In the code, a change was made so bright,
The mobile nav now takes full flight.
With quotes aligned and styles refined,
Overflow hidden, problems left behind.
A rabbit's touch, sleek and neat,
Full-screen menus, a user’s treat!

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share - [X](https://twitter.com/intent/tweet?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A&url=https%3A//coderabbit.ai) - [Mastodon](https://mastodon.social/share?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A%20https%3A%2F%2Fcoderabbit.ai) - [Reddit](https://www.reddit.com/submit?title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&text=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code.%20Check%20it%20out%3A%20https%3A//coderabbit.ai) - [LinkedIn](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fcoderabbit.ai&mini=true&title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&summary=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code)
devvsakib commented 1 month ago

Resolve conflict s @iharsh02

saivinaygondrala commented 1 week ago

Make sure to resolve the Merge Conflicts @iharsh02