Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fixed navbar #1132

Merged
merged 5 commits into from
Aug 5, 2024
Merged

fixed navbar #1132

merged 5 commits into from
Aug 5, 2024

Conversation

ayush-848
Copy link
Contributor

Description

Fixed the navbars for various screen sizes

Related Issues

Screenshots / videos (if applicable)

image
fixed for 768px
image
for 820px
image
for 880px

Checklist

  • I have gone through the contributing guide
  • I have updated my branch and synced it with project main branch before making this PR
  • I have performed a self-review of my code
  • I have tested the changes thoroughly before submitting this pull request.
  • I have provided relevant issue numbers, screenshots, and videos after making the changes.
  • I have commented my code, particularly in hard-to-understand areas.

Copy link

vercel bot commented Aug 3, 2024

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

Name Status Preview Comments Updated (UTC)
rapidoc ✅ Ready (Inspect) Visit Preview 💬 Add feedback Aug 4, 2024 3:40pm

Copy link
Contributor

@github-actions github-actions bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great job, @ayush-848! 🎉 Thank you for submitting your pull request. Your contribution is valuable and we appreciate your efforts to improve our project.We will promptly review your changes and offer feedback. Keep up the excellent work! Kindly remember to check our contributing guidelines

Copy link

netlify bot commented Aug 3, 2024

Deploy Preview for rapidoc ready!

Name Link
🔨 Latest commit 2da7210
🔍 Latest deploy log https://app.netlify.com/sites/rapidoc/deploys/66afa0e861906e00082c3e8d
😎 Deploy Preview https://deploy-preview-1132--rapidoc.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@ayush-848
Copy link
Contributor Author

@varshith257 please check this

@varshith257
Copy link
Collaborator

@Anjaliavv51 Take a look. I think existing one is also looks fine. WDYT?

@Anjaliavv51
Copy link
Contributor

@Anjaliavv51 Take a look. I think existing one is also looks fine. WDYT?

Existing one is fine no need of this right nowm

@ayush-848
Copy link
Contributor Author

ayush-848 commented Aug 4, 2024

@Anjaliavv51 Take a look. I think existing one is also looks fine. WDYT?

Actually @varshith257 @Anjaliavv51 it is the existing one only.
But it was not responsive for smaller screens.
I haven't added anything new.
I have also mentioned that for 768px, 880px and 820px the navbar was overflowing or can be seen properly.
I just fixed it for these smaller screens

@Anjaliavv51
Copy link
Contributor

Actually it is the existing one. But it is not responsive for smaller screens. I just fixed that. I haven't added anything new

Screenshot_20240804_103858_Chrome

@ayush-848
Copy link
Contributor Author

Actually it is the existing one. But it is not responsive for smaller screens. I just fixed that. I haven't added anything new

Screenshot_20240804_103858_Chrome

Here I brought the logo in center and added padding to the hamburger drop-down

@Anjaliavv51
Copy link
Contributor

Actually it is the existing one. But it is not responsive for smaller screens. I just fixed that. I haven't added anything new

Screenshot_20240804_103858_Chrome

Here I brought the logo in center and added padding to the hamburger drop-down

But it's size is decreased??? In ur changes

@ayush-848
Copy link
Contributor Author

ayush-848 commented Aug 4, 2024

Actually it is the existing one. But it is not responsive for smaller screens. I just fixed that. I haven't added anything new

Screenshot_20240804_103858_Chrome

Here I brought the logo in center and added padding to the hamburger drop-down

But it's size is decreased??? In ur changes

Yes but if you want, I can restore it's original size. I only decreased it by 2px @Anjaliavv51

@ayush-848
Copy link
Contributor Author

@Anjaliavv51 should I increase the size???

@Anjaliavv51
Copy link
Contributor

@Anjaliavv51 should I increase the size???

Yes please increase the size of the navbar container in small screen.

@ayush-848
Copy link
Contributor Author

@Anjaliavv51 should I increase the size???

Yes please increase the size of the navbar container in small screen.

for the 768px??

@ayush-848
Copy link
Contributor Author

ayush-848 commented Aug 4, 2024

@Anjaliavv51
image

ma'am can you verify it for me, that in the 768px on clicking the hamburger the links don't appear
IT IS IN THE MAIN WEBSITE

@Anjaliavv51
Copy link
Contributor

Did u commit the code? @ayush-848

@ayush-848
Copy link
Contributor Author

Did u commit the code? @ayush-848

No no

@Anjaliavv51
Copy link
Contributor

Did u commit the code? @ayush-848

No no

Once commit the code then I will check and I will mention u if any changes.

@ayush-848
Copy link
Contributor Author

Did u commit the code? @ayush-848

No no

Once commit the code then I will check and I will mention u if any changes.

Ok

@ayush-848
Copy link
Contributor Author

@Anjaliavv51
image
please check now

@Anjaliavv51
Copy link
Contributor

@ayush-848 nav bar should appear when we click on the icon , but it's appearing before itself, and also container should be wide.

Screenshot_20240804_141802_Chrome

@ayush-848
Copy link
Contributor Author

@ayush-848 nav bar should appear when we click on the icon , but it's appearing before itself, and also container should be wide.

Screenshot_20240804_141802_Chrome

ok

@ayush-848
Copy link
Contributor Author

@Anjaliavv51
image
Now check

@Anjaliavv51
Copy link
Contributor

Anjaliavv51 commented Aug 4, 2024

Screenshot_20240804_171427_Chrome

Please increase the container size of the navbar in small screen

@ayush-848
Copy link
Contributor Author

Screenshot_20240804_171427_Chrome

Please increase the container size of the navbar in small screen

The one with home, about, news, etc??

@Anjaliavv51
Copy link
Contributor

@ayush-848 that container which contains all those.

@ayush-848
Copy link
Contributor Author

image
@Anjaliavv51 I have increased its width to 45% and increased the font size too

@ayush-848
Copy link
Contributor Author

@Anjaliavv51 is this one ok??

@varshith257 varshith257 added gssoc level2 medium (enhancements) labels Aug 5, 2024
@varshith257 varshith257 merged commit b78d40b into Anishkagupta04:main Aug 5, 2024
7 checks passed
Copy link
Contributor

github-actions bot commented Aug 5, 2024

🎉 Your pull request has been successfully merged! 🎉 Thank you for your contribution to our project. Your efforts are greatly appreciated. Keep up the fantastic work! 🚀

@Anjaliavv51
Copy link
Contributor

@varshith257 changes are not okay

@varshith257
Copy link
Collaborator

Are you talking about width of navbar container?

@Anjaliavv51
Copy link
Contributor

Are you talking about width of navbar container?

Yes

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
gssoc level2 medium (enhancements)
Projects
None yet
Development

Successfully merging this pull request may close these issues.

✨[Feature Request]: Restyling the navbar for responsive screens
3 participants