🐛 [Bug report]: Fix search bar in mobile view

[janvi01]

Descrcibe the bug?

Currently, the search bar in mobile view looks so compact and after searching any term, the close and the filter icon takes up the whole space.

Steps to reproduce the bug?

1. Go to https://reactplay.io/plays
2. Search any play using search bar
3. Switch to mobile view and look at the search bar

Expected behavior

The unresponsiveness should be fixed to improve the user experience.

Desktop (Please provide your system information)

OS: macOS
Browser: Chrome

Mobile (Please provide your device information)

No response

Screenshot / Screenshare

Relevant log output

No response

Record

• I have checked the existing issues
• I have read the Contributing Guidelines
• I want to work on this issue
• I am in Hacktoberfest

Code of Conduct

• I agree to follow this project's Code of Conduct

[github-actions]

To reduce notifications, issues are locked. Your issue will be unlocked when we add the label 🏁 status: ready for dev.

[github-actions]

There hasn't been any activity on this issue recently, and in order to prioritize active issues, it will be marked as stale. Please make sure to update to the latest version and check if that solves the issue. Let us know if that works for you by leaving a 👍 Because this issue is marked as stale, it will be closed and locked in 7 days if no further activity occurs. Thank you for your contributions!