Material-ui: Drawer not working in iPhone

[kovaldmytro]

The Drawer works well on PC.
Also works on iphone but elements are invisible

| Tech | Version |
|--------------|---------|
| Material-UI | 3.6.1 |
| React | 16.3.2 |
| IOS| 12 |

render() {
  const { classes } = this.props;
  return (
    <Drawer
      variant="permanent"
      classes={{
        paper: classNames(classes.drawerPaper, !leftMenu.open && classes.drawerPaperClose),
      }}
      open={true}
    >
      <Divider/>
          {leftMenu.items.map((menuItem, index) => (
            <div id={menuItem.id} key={index}>
              <Tooltip classes={{tooltip: classes.lightTooltip}}
                       title={menuItem.name}
                       placement="right">
                <ListItem button
                          selected={menuItem.selected}
                          onClick={(event) => this.handleMenuItemClick(menuItem, event)}>
                  <ListItemIcon classes={{root: classNames(classes.menuIcon)}}>
                    <i className={menuItem.iconClass}/>
                  </ListItemIcon>
                </ListItem>
              </Tooltip>
            </div>
          ))}
    </Drawer>
  );
}

asdasdsad

[joshwooding]

Can you put this example in a codesandbox reproduction please

[kovaldmytro]

Example in codesandbox

[joshwooding]

@kovaldmytro That’s quite a complex reproduction with a lot of other libraries and variables. Do you think you can simplify it? I don’t have time to look through right now but I can have a look at it later if no one else does by then

[oliviertassinari]

@kovaldmytro Something is wrong with your demo. We don't have this problem with ours.

This solves the problem.

  root: {
    flexGrow: 1,
    zIndex: 1,
    //overflow: "hidden",
    position: "relative",
    display: "flex"
  },

https://43n8wrmn79.codesandbox.io/

@joshwooding I think that we should start working on some higher level layout component. People shouldn't have to build it from scratch. It's time consuming.

[kovaldmytro]

@oliviertassinari overflow: hidden problem solved when menu is open but icon menu invisible when close.

[oliviertassinari]

@kovaldmytro Until proved otherwise, the issue is outside of the scope of the library, it's a generic CSS issue. You gonna need to find a solution on your own. On our side, we will provide more full layout solutions.

[kovaldmytro]

It helps, thx