Search bar new design

[ggsawatyanon]

Summary

This pull request is the first step towards implementing the new Search Bar design (according to the Figma).

• Implemented search bar new design
• Implemented new design for search pages + Nav bar but kept old design for home page (according to Figma).
• Fixed width issue for navbar's search bar
• Fixed placeholder text issue for navbar search bar

Test Plan

Old design for home:

New design for search pages:

Navbar searchbar design:

Notes

• Deployment check failed: this will be a future fix – it's a result of the previously existing code for Autocomplete.tsx having a lot of code that isn't used (Menu). So can be fixed by deleting a lot of the unused code.

[dti-github-bot]

[diff-counting] Significant lines: 200.

[github-actions]

Visit the preview URL for this PR (updated for commit c893136):

https://cu-apts-staging--pr302-searchbarredesign-h339b8ei.web.app

_{(expires Mon, 30 Oct 2023 20:10:17 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: 096ac87b789b31770a01964fe0aaa92d563b9353}

[ggsawatyanon]

Fixed failed deployment checks + made input adornment clickable + cleared search bar when searched

[cyrus14]

Hi Grace! Great job on your code changes. You've done a remarkable job with these specific enhancements: firstly, implementing a new design for the search bar, a crucial UI upgrade. Secondly, your work on the new design for search pages and the navigation bar, aligned with the Figma design, showcases your dedication to design consistency. Additionally, you've effectively resolved the width issue in the navbar's search bar, ensuring it displays correctly, and addressed the placeholder text issue, significantly improving the user experience. Your code is well-structured and clean, and your contributions are much appreciated. Keep up the great work!

[jesshan700]

Hey Grace! This is a very important feature for our website - the code looks clean this implementation definitely makes it easier for the user to see where they can search!

[cyrus14]

Hey Grace! Your recent pull request is a great step towards implementing the new Search Bar design. You've successfully brought the new design to life, extended it to search pages and the navigation bar while keeping the old design for the home page in line with Figma's guidelines. Your attention to detail is evident in fixing the width and placeholder text issues in the navbar's search bar, and your commitment to quality and design consistency is highly appreciated. Keep up the excellent work, Grace – looking forward to more of your valuable contributions.