Реагирование: Материал для пользовательского интерфейса. Кнопка для повторного использования не адаптирует стиль. - PullRequest
0 голосов
/ 11 марта 2019

Я попытался создать пользовательскую кнопку с пользовательским интерфейсом для повторного использования в других файлах моего проекта.Почему-то кнопка не адаптирует стиль, который я определил.Может кто-нибудь сказать мне, где я ошибся / что-то забыл?

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);
...