-
Notifications
You must be signed in to change notification settings - Fork 6
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
added a search bar filter #95
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is a great stab at adding in a search bar for the projects page! Functionality-wise, this looks like amazing work! I just left a couple small nits design-wise but once they're addressed this should be good to go!
|
||
return ( | ||
<div> | ||
<p>Filter projects</p> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Instead of a paragraph tag to filter projects, what if we used the placeholder
property for the searchbar input to indicate that we can search for specific projects? It's less text for the reader but still conveys that it's a searchbar.
If you want, you can also add in a small magnifying glass icon as well kinda like what google does (or we can make that another bite-sized PR along with other styling stuff in the future)!
pages/projects.tsx
Outdated
</div> | ||
); | ||
}) | ||
: <h1>No results found</h1> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
As a general rule, we only have a single h1 on a page at any given time. Subheadings can be h2
and it's fine to have multiple h2
tags present on a page at once!
@ColbertX when you're ready for review, just press the re-request review button! |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks great, thanks for addressing this Colbert!
User can type into the search bar and the projects get filtered in real time. It searches for any project that contains the search term in the name, description, topic or the language. I mainly focused on implementing the functionality, so the styling could do with some work