feat: sort project cards lexicographically for better navigation#611
Conversation
|
@nishtha-agarwal-211 is attempting to deploy a commit to the Anuj's projects Team on Vercel. A member of the Team first needs to authorize it. |
|
Implemented the change by sorting all project cards lexicographically for improved navigation and easier project discovery. The cards are now displayed in alphabetical order, making the UI more organised and user-friendly. 
|
There was a problem hiding this comment.
Pull request overview
Note
Copilot was unable to run its full agentic suite in this review.
Adds client-side sorting so project cards render alphabetically by their title when the page finishes loading.
Changes:
- Collects
.project-cardelements and sorts them lexicographically by<h3>text. - Re-appends sorted cards into
.projects-gridduringDOMContentLoaded.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
|
||
| // Sort project cards lexicographically (alphabetically) by title | ||
| var projectsGrid = document.querySelector('.projects-grid'); | ||
| var rawCards = Array.from(document.querySelectorAll('.project-card')); |
| rawCards.sort(function (a, b) { | ||
| var titleA = (a.querySelector('h3') || {}).textContent || ''; | ||
| var titleB = (b.querySelector('h3') || {}).textContent || ''; | ||
| return titleA.trim().localeCompare(titleB.trim()); | ||
| }); | ||
| rawCards.forEach(function (card) { | ||
| projectsGrid.appendChild(card); | ||
| }); |
nishtha-agarwal-211
force-pushed
the
fix/decorative-code-overlapping-474
branch
from
b017359 to
809a114
Compare
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
🎉 Thank you for your contribution! Your Pull Request has been merged successfully. We appreciate the time and effort you put into improving this project. Contributions like yours help the repository grow and stay useful for everyone. If you'd like to contribute again, please check the open issues and make sure you are assigned before opening another Pull Request. Thanks again for your support! 🙌 |
Description
Fixes #603
This PR resolves the issue where project cards on the homepage were displayed in an inconsistent/random order. It ensures that all project cards are sorted lexicographically (alphabetically) by their title for better navigation and UX.
Proposed Changes
main.js: Reordered the project card DOM elements inside.projects-gridalphabetically usinglocaleCompareon their<h3>text content right at the start of theDOMContentLoadedevent handler.projectCards, all downstream interactions (filtering, search, favorites, category tabs) automatically operate on the sorted elements.Benefits
DOMContentLoadedbefore rendering is complete.index.html) as well as all specific categories (games.html,math.html,utilities.html).Verification & Testing
pytestto ensure zero regressions to the calculation modules:119 passed in 0.69sAP/GP/AGP/HP Recognizer,Armstrong Numbersthrough toWord Scramble/Whack-a-Mole.