Modified navigation-bar

[simransia]

I have fixed the alignment of the "About us" nav-link and have also made the widths of both the "Store" and "Donate" buttons equal. Also, I have changed the about_title present in the en.yml file from "About us" to "About Us".
This will make the navigation bar look better 😇

Here is the screenshot:

Here is the video:

video.mp4

Fixes #11049

Make sure these boxes are checked before your pull request (PR) is ready to be reviewed and merged. Thanks!

• PR is descriptively titled 📑 and links the original issue above 🔗
• tests pass -- look for a green checkbox ✔️ a few minutes after opening your PR -- or run tests locally with rake test
• code is in uniquely-named feature branch and has no merge conflicts 📁
• screenshots/GIFs are attached 📎 in case of UI updation
• ask @publiclab/reviewers for help, in a comment below

[gitpod-io]

[TildaDares]

HI @simransia, can you add screenshots? Thanks!!

[github-actions]

This pull request generated screenshots of many common pages in the running app. You should be able to download and view them here:
https://github.com/publiclab/plots2/suites/6114028840/artifacts/212527003

[simransia]

HI @simransia, can you add screenshots? Thanks!!

Hello @TildaDares I have attached the screenshot and video of the navbar.

Thank you so much for guiding me patiently about my mistakes!

[TildaDares]

@simransia The navbar items are misplaced on smaller screens

[github-actions]

This pull request generated screenshots of many common pages in the running app. You should be able to download and view them here:
https://github.com/publiclab/plots2/suites/6132168423/artifacts/213650877

[simransia]

@simransia The navbar items are misplaced on smaller screens

Hello @TildaDares, I have fixed this issue by using media queries and sorry for not recognizing this issue before.
Now the nav-links are looking fine on smaller screens also and the buttons are having a little space between them. You can view it in the screenshot below. Thank You.

[TildaDares]

@simransia From screen size 576px - 768px, the store and donate buttons don't show.

[simransia]

@simransia From screen size 576px - 768px, the store and donate buttons don't show.

@TildaDares mam, On the mention screen sizes, those buttons were already not showing from starting even before I have started modifying the navigation bar.

This is the screenshot of the present working website of public lab:

[TildaDares]

@simransia You're right. Do you think you could add them? Thank you!!

[simransia]

@simransia You're right. Do you think you could add them? Thank you!!

Yes @TildaDares mam, I can add them. I have just now tried adding them and they are occupying the full width of the page after getting added. So, I want to know your preference. You can choose one from the below images:

Are they looking good like this:

Or should I make their width smaller like this:

[TildaDares]

@simransia The first image is better. Thanks!!

[codeclimate]

Code Climate has analyzed commit 2606e61 and detected 0 issues on this pull request.

View more on Code Climate.

[simransia]

@simransia The first image is better. Thanks!!

Hello @TildaDares. I have added the 'store' and 'donate' buttons on the mentioned screen sizes successfully. And I am ready to do any further modifications if needed.

Thank You so much!

[github-actions]

This pull request generated screenshots of many common pages in the running app. You should be able to download and view them here:
https://github.com/publiclab/plots2/suites/6145074502/artifacts/214532945

[TildaDares]

Thanks for working this @simransia!!

[welcome]

Congrats on merging your first pull request! 🙌🎉⚡️
Your code will likely be published to PublicLab.org in the next few days, but first it will be published to https://stable.publiclab.org/ (it will take some minutes for this to load, and until then you may see logs from the build process). Please test out your work on this testing server and report back with a comment that all has gone well!
Do join our weekly check-in to share your this week goal and the awesome work you did 😃. Please find the link to our latest check-in here 📝
Now that you've completed this, you can help someone else take their first step!
Reach out to someone else working on theirs on Public Lab's code welcome page (where you'll now be featured as a recent contributor!). Thanks!

Help others take their first step

Now that you've merged your first pull request, you're the perfect person to help someone else out with this challenging first step. 🙌

https://code.publiclab.org

Try looking at this list of `first-timers-only` issues, and see if someone else is waiting for feedback, or even stuck! 😕

People often get stuck at the same steps, so you might be able to help someone get unstuck, or help lead them to some documentation that'd help. Reach out and be encouraging and friendly! 😄 🎉

Read about how to help support another newcomer here, or find other ways to offer mutual support here.

[TildaDares]

Thank you @simransia!!

[simransia]

Thank you @simransia!!

It's my pleasure @TildaDares !
I am so happy working on this! 🤩