Fix Multiple dropdowns remain open simultaneously in navbar. #2533
Conversation
Signed-off-by: Sourya07 <[email protected]>
Signed-off-by: Sourya07 <[email protected]>
✅ Deploy Preview for mesheryio-preview ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
Summary of ChangesHello @Sourya07, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! This pull request resolves an issue where multiple navigation dropdowns could remain open simultaneously, leading to a suboptimal user interface. The core change updates the navbar's JavaScript functionality to manage dropdown states, ensuring that opening one dropdown automatically closes any others that are currently open. This enhancement significantly improves the user experience by maintaining a clean and intuitive navigation flow. Additionally, some minor cosmetic adjustments were made to the recognition page. Highlights
Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request successfully fixes an issue where multiple navigation dropdowns could be open at the same time. The logic added to js/stellarnav.js correctly closes other open dropdowns before opening a new one, which is a solid implementation.
The PR also includes several formatting and style improvements in collections/_pages/recognition.md and js/stellarnav.js. While most of these are beneficial, I've pointed out one instance in the markdown file where using inline styles could be improved for better maintainability by moving them to a separate CSS file.
Overall, the core issue is well-addressed, and the other changes are mostly positive.
collections/_pages/recognition.md
Outdated
| <ul style="padding-left: 20px; text-align: left;"> | ||
| <li style="margin-bottom: 2rem;"><em><a href="https://badges.layer5.io">Layer5</a></em> - Badges are one of the many ways that we recognize the efforts of our contributors and uplift our users. Badges represent milestones that you achieve both in using and in contributing to Meshery. As a contributor, this is how you demonstrate your ownership, dedication, skills and commitment. As a user, this is how you demonstrate your prowess, milestones, and meaningful engagement.</li> | ||
| <li><em><a href="https://github.com/meshery/meshery.io/pulls">Add your program here</a></em> - Add your recognition program to this list by <a href="https://github.com/meshery/meshery.io/pulls">submitting a pull request</a>.</li> | ||
| </ul> |
There was a problem hiding this comment.
While this change achieves the desired styling, using inline styles in HTML is generally discouraged as it mixes content with presentation, making the code harder to maintain. A better approach is to use CSS classes.
Please consider moving the styling to a CSS file and applying it with classes. You would then need to add the corresponding styles for these classes in your project's stylesheet.
For example:
.recognition-list {
padding-left: 20px;
text-align: left;
}
.recognition-item-spaced {
margin-bottom: 2rem;
}| <ul style="padding-left: 20px; text-align: left;"> | |
| <li style="margin-bottom: 2rem;"><em><a href="https://badges.layer5.io">Layer5</a></em> - Badges are one of the many ways that we recognize the efforts of our contributors and uplift our users. Badges represent milestones that you achieve both in using and in contributing to Meshery. As a contributor, this is how you demonstrate your ownership, dedication, skills and commitment. As a user, this is how you demonstrate your prowess, milestones, and meaningful engagement.</li> | |
| <li><em><a href="https://github.com/meshery/meshery.io/pulls">Add your program here</a></em> - Add your recognition program to this list by <a href="https://github.com/meshery/meshery.io/pulls">submitting a pull request</a>.</li> | |
| </ul> | |
| <ul class="recognition-list"> | |
| <li class="recognition-item-spaced"><em><a href="https://badges.layer5.io">Layer5</a></em> - Badges are one of the many ways that we recognize the efforts of our contributors and uplift our users. Badges represent milestones that you achieve both in using and in contributing to Meshery. As a contributor, this is how you demonstrate your ownership, dedication, skills and commitment. As a user, this is how you demonstrate your prowess, milestones, and meaningful engagement.</li> | |
| <li><em><a href="https://github.com/meshery/meshery.io/pulls">Add your program here</a></em> - Add your recognition program to this list by <a href="https://github.com/meshery/meshery.io/pulls">submitting a pull request</a>.</li> | |
| </ul> |
Signed-off-by: Sourya07 <[email protected]>
Sourya07
force-pushed
the
fix-nav-dropdown-overlap
branch
from
7bae5be to
de29297
Compare
|
formatting issue 😩 |
|
@CodexRaunak |
1 participant
Description
This PR fixes #2530
Notes for Reviewers
Signed commits