I want to change the background color of select from material ui when it is selected. The link is the image showing when it is not selected, and when it is selected. Select
As you can see, when it is selected, there is huge gray backgound color showing up. I want to change it to transparent but it is not working somehow.
Below is code that I'm using right now.
const useStyles = makeStyles(theme => ({
select: {
height: theme.spacing(5)
},
}));
const classes = useStyles();
<FormControl margin='none' variant="outlined">
<Select
native
className={classes.select}
value={filter}
onChange={handleChange()}
name="filter"
inputProps={{ 'aria-label': 'filter' }}
>
<option value="All">All</option>
</Select>
</FormControl>