javascript - Transparent Swipeable drawer Material-UI - Stack Overflow

admin管理员组

文章数量:1318129

I need to know how to apply a 'transparent' style porperty background to my SwipeableDrawer ponent from Material UI... Since the ponent creates another ponent in my html file when it renders i cannot change his background from my code. I tried to put some , but it seems that the ponent doesn`t like it.

Thanks in advance.

I need to know how to apply a 'transparent' style porperty background to my SwipeableDrawer ponent from Material UI... Since the ponent creates another ponent in my html file when it renders i cannot change his background from my code. I tried to put some , but it seems that the ponent doesn`t like it.

Thanks in advance.

• javascript
• html
• css
• reactjs
• material-ui

Share Improve this question Follow asked Jul 28, 2018 at 0:53 MichalisticoMichalistico 18533 silver badges1414 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 9

As stated in Material-ui Docs you can override the style of Modal using ModalProps. Using the BackdropProps of Modal you can able to set the background to transparent.

Create a styles variable and apply the necessary styles.

const styles = {
  BackdropProps: {
    background: 'transparent'
  }
};

Apply the style to the root of Backdrop using classes property

<SwipeableDrawer ModalProps={{
          BackdropProps:{
            classes:{
              root:classes.BackdropProps
            }
          }
        }}
        {...otherProps}>

Have a look at overriding ponents with classes in the docs

本文标签： javascriptTransparent Swipeable drawer MaterialUIStack Overflow