nodejs
fix: navbar breakpoint issue
Description
the navbar had the wrong breakpoint applied to it which resulted in it not being responsive.
Validation
Before:
https://github.com/nodejs/nodejs.org/assets/151054138/3f0fc4ae-f67d-47ab-9aef-8e52e464b898
After:
https://github.com/nodejs/nodejs.org/assets/151054138/a02e0227-16a2-4345-bbb5-919ac1279e6b
Related Issues
Fixes #6399
Check List
- [✅] I have read the Contributing Guidelines and made commit messages that follow the guideline.
- [✅] I have run
npx turbo formatto ensure the code follows the style guide. - [✅] I have run
npx turbo testto check if all tests are passing. - [✅] I have run
npx turbo buildto check if the website builds without errors. - [✅] I've covered new added functionality with unit tests if necessary.
The latest updates on your projects. Learn more about Vercel for Git ↗︎
| Name | Status | Preview | Updated (UTC) |
|---|---|---|---|
| nodejs-org | ✅ Ready (Inspect) | Visit Preview | Mar 24, 2024 5:58pm |
![vercel[bot] avatar](https://avatars.githubusercontent.com/in/8329?v=4 "Published by a pub.dev verified publisher"){kind=small}
Lighthouse Results
| URL | Performance | Accessibility | Best Practices | SEO | Report |
|---|---|---|---|---|---|
| /en | 🟢 99 | 🟢 90 | 🟢 100 | 🟢 91 | 🔗 |
| /en/about | 🟢 100 | 🟢 91 | 🟢 100 | 🟢 91 | 🔗 |
| /en/about/previous-releases | 🟢 99 | 🟢 90 | 🟢 100 | 🟢 92 | 🔗 |
| /en/download | 🟢 99 | 🟠 89 | 🟢 100 | 🟢 91 | 🔗 |
| /en/blog | 🟢 99 | 🟢 90 | 🟢 100 | 🟢 92 | 🔗 |
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
Unit Test Coverage Report
| Lines | Statements | Branches | Functions |
|---|---|---|---|
 |
80.07% (450/562) | 79.55% (144/181) | 71.17% (79/111) |
Unit Test Report
| Tests | Skipped | Failures | Errors | Time |
|---|---|---|---|---|
| 90 | 0 :zzz: | 0 :x: | 0 :fire: | 4.789s :stopwatch: |
Hey there, could you also take screenshots of how this would look on common tablet, mobile and desktop screens (portrait and landscape)? (Available via DevTools)
Just to ensure this change doesn't break previous working viewports 👀
@ovflowd Sure.
Desktop ( 1440 x 990 ) :
Tablet ( 768×1024 ) :
| Portrait | Landscape |
|---|---|
Mobile ( 480 x 800 ) :
| Portrait | Landscape |
|---|---|
@ovflowd it's been almost a week and this PR hasn't been merged yet 😅
Just as a reminder, you need to take the time to make sure that a pr is properly reviewed so that you don't have to open another one. Also it's an open source project, none of us are getting paid, we're doing this because we love the project. So we can't be reactive by the minute.
But thank you for your contribution
