Estou aprendendo tanto react quanto a utilizar o material-ui em conjunto com react, meu problema é que eu gostaria de utilizar um "custom width" para o componente Drawer, na minha tentativa inicial eu fiz o seguinte:
<Drawer variant="permanent" style={{width:'240px'}}>
<div>
<IconButton>
<HomeIcon />
<Typography color="inherit" noWrap>
Início
</Typography>
</IconButton>
</div>
<Divider />
</Drawer>
Contudo, o resultado obtido é o seguinte:
Percebi com isso que o Drawer é composto por duas "div", quando eu utilizo a tag style, apenas a primeira div recebe o estilo desejado, e modificando manualmente o CSS no console do navegador da segunda div, eu obtenho o resultado desejado:
Vou ressaltar novamente que sou novo tanto em react quanto na utilização do pacote material-ui. Então o que eu devo fazer para alcançar essa "segunda div", gostaria muito de entender o que eu estou fazendo de errado.
Drawer
, o correto é você definir o tamanho no conteúdo dele, defina o width na<div style={{width:'240px'}}>
de dentro e remova doDrawer
, no site do material-ui a varias exemplos de utilização e é possivel ver bem com é definido as medidas.