0

我尝试使用材质 ui 创建一个自定义样式的按钮,以便在我的项目的其他文件中重用。不知何故,按钮不适应我定义的样式。有人可以告诉我我在哪里犯了错误/忘记了什么吗?

import React from 'react';
import { withStyles } from '@material-ui/core/styles';
import IconButton from '@material-ui/core/IconButton';


const styles = themes => ({

    root: {
        margin: "50px",
        padding: "20px",
        display: 'block'
    },

    button: {
        marginTop: '20px',
        padding: '100px',
        height: "300px+15vh",    
        width: "300px+15vw",
        borderRadius: "20% 20%",
        color: '#FFFFFF',
        backgroundColor: '#05164D',
        '&:hover': {
        backgroundColor: "rgba(5, 22, 77, 0.75)",
        boxShadow: '0 3px 5px 2px rgba(153, 153, 153, .8)'
      },
  },


});


const styledButton = props => { 

      const { classes } = props;

      return (

      <div>

      <IconButton className={classes.button} {...props} aria-label="Gift" disableTouchRipple="true">

       {props.children}

      </IconButton>

      </div>

    )

}


export default withStyles(styles)(styledButton);
4

0 回答 0