feat: adding active and hover states to search input #2741
Conversation
| @@ -106,19 +106,15 @@ export const SearchBarWithFilter: React.FC<SearchBarWithFilterProps> = ({ | |||
| )} | |||
|
|
|||
| <form onSubmit={form.handleSubmit} className={styles.filterForm}> | |||
| <TextField | |||
| <OutlinedInput | |||
There was a problem hiding this comment.
Changed this because TextField is a nightmare to style.
Yes, it should! Working on that now after looking at the test failures. |
|
Nice addition! I checked that other form fields (like on the Account page) have the error outline and error message using the color |
|
@AbhineetJain We are using the same outline colors! I think it's a standard for MUI inputs but idk the whole palette history, tbh: |
| @@ -152,29 +149,39 @@ export const SearchBarWithFilter: React.FC<SearchBarWithFilterProps> = ({ | |||
| ) | |||
| } | |||
|
|
|||
| const useStyles = makeStyles((theme) => ({ | |||
| interface StyleProps { | |||
| error?: unknown | |||
There was a problem hiding this comment.
nit This could just be a boolean.
There was a problem hiding this comment.
Good catch! I'm putting up another PR right after this one with more style improvements and I promise I'll fix it there. 🤞
Couple of improvements:
Before:
After:
