title: Remove / Override default styles from materialui components
body: <p>I'm trying to change the background color of the menuitem popover. But I am unable to remove paddingtop and paddingBottom from menuitem. It's kind of annoying because some materialui components inherit styles from paper, list, menu and etc. Is there a clean and efficient way to work around this? For eg, using overrides in theme and etc.</p>
  
  <p>I have experiment and I know it can be done using inline styles/classes but i do not wish to use that method. I've tried using ListProps={{disablePadding: true}}, MenuProps={{{disablePadding: true}}. But it Doesn't work.</p>
  
  <pre><code>       &lt;FormControl className={classes.formControl}&gt;
              &lt;Select
              value={value.groupId}
              onChange={handleChange}
              MenuProps={{
                  getContentAnchorEl: null,
                  anchorOrigin: {
                    vertical: "bottom",
                    horizontal: "left",
                  },
                }}
              classes={{
                  icon:  isDarkMode ?  classes.iconLight :classes.icon,
  
              }}
              ListProps={{disablePadding: true}}
              inputProps={{
                  name: 'groupId',
                  id: 'group-machines',
                }}
              &gt;
  
          {
              equipmentgroups.map(equipmentgroup =&gt;
              &lt;MenuItem 
              style={isDarkMode ? {backgroundColor: theme.palette.primary.dark} : 
              {backgroundColor: theme.palette.secondary.main}}
              className={classes.menuItemDisplay}  
              value={equipmentgroup.groupId}
              key={equipmentgroup.groupId}
              &gt;{equipmentgroup.groupName}&lt;/MenuItem&gt;
              )
  
          }
  
              &lt;/Select&gt;
          &lt;/FormControl&gt;
  </code></pre>
  
  <p>I'm still GETTING this when I'm inspecting the element.</p>
  
  <pre><code>        .MuiList-padding-370 {
               padding-top: 8px;
               padding-bottom: 8px;
           }
  </code></pre>