search

spacelabdev / spacelab-react

5 stars 47 forks source link

Enhancement/reusable search bar component #364

Closed manuel12 closed 1 year ago

manuel12 commented 1 year ago

Hello Spacelab team. This is my solution for: https://github.com/spacelabdev/spacelab-react/issues/328.

I've added stylings to the scroll bar in results container. Also removed the blue X that appeared on container on focus:

image

I've also moved the search icon farther to the left and added search result title as placeholder:

image

And also the x icon will change to search when user clicks outside of search input:

Input focused:

image

Input blurred:

image

Please tell me if all is as expected :)

netlify[bot] commented 1 year ago

Deploy Preview for spacelab-main ready!

Name Link
Latest commit 070829a848e4cf93cd6635ca1ea61f94bbb00e45
Latest deploy log https://app.netlify.com/sites/spacelab-main/deploys/647aec1e5273c40008d134ac
Deploy Preview https://deploy-preview-364--spacelab-main.netlify.app/
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

manuel12 commented 1 year ago

This looks great! Before I approve, can you please comment out the code inside podcastArray? It is filler data that is only used for testing and shouldn't appear on the website.

Definitely, will do.

manuel12 commented 1 year ago

Already commented out the podcastArray, btw :)