Javascript 有没有办法增加材质ui中轮廓按钮的边框厚度？

我正在修改一个使用材质UI组件设计的用户界面，我被要求将一些略图按钮的边框加宽。有没有一种方法可以使用组件道具、主题或样式来实现这一点

这是我尝试绘制的两个按钮的代码，以及我当前使用的样式和主题：

const style = {
  play: {
    margin: 5,
    padding: 0,
    colorInherit: 'linear-gradient(45deg, #38e438 30%, #58e458 90%)',
  },
  play_disabled: {
    margin: 5,
    padding: 0,
    background: '#222',
  },
  clear: {
    margin: 5,
    marginRight: 10,
    padding: 0,
    background: 'linear-gradient(45deg, #FE3B3B 30%, #FF3B3B 90%)',
   },
  clear_disabled: {
    margin: 5,
    marginRight: 10,
    padding: 0,
    background: '#222',
  },
  default: {
    margin: 2,
    padding: 0,
    color: '#fff',
  },
  disabled: {
    margin: 2,  
    padding: 0,
    color: '#777',
  },
};
const theme = createMuiTheme({
  palette: {
    primary: {
      main: "#777",
    }
  }
});
<MuiThemeProvider theme={theme}>
  <Tooltip title="Render" placement="bottom-start">
    <Button
      id="play-btn"
      variant="outlined"
      size="small"
      onClick={this.handleRender}
      color="primary"
      className="header-btn"
      style={this.props.layoutType === layoutTypes.REFERENCE ? style.play_disabled : style.play}
      disabled={this.props.layoutType === layoutTypes.REFERENCE}>
      <Icon className="material-icons" style={{ color: '#777' }}>play_arrow</Icon>
    </Button>
  </Tooltip>
  <Tooltip title="Stop" placement="bottom-start">
    <Button
      id="stop-btn"
      variant="outlined"
      size="small"
      onClick={this.clear}
      color="primary"
      className="header-btn"
      style={this.props.layoutType === layoutTypes.REFERENCE ? style.clear_disabled : style.clear}
      disabled={this.props.layoutType === layoutTypes.REFERENCE}>
      <Icon className="material-icons" style={{ color: '#777' }}>stop</Icon>
    </Button>
  </Tooltip>
</MuiThemeProvider>

const style={
播放：{
差额：5，
填充：0，
colorInherit:“线性梯度（45度，#38e438 30%，#58e458 90%”，
},
已禁用播放单元：{
差额：5，
填充：0，
背景：“#222”，
},
清楚：{
差额：5，
marginRight:10，
填充：0，
背景：“线性梯度（45度，#FE3B3B 30%，#FF3B3B 90%）”，
},
清除/禁用：{
差额：5，
marginRight:10，
填充：0，
背景：“#222”，
},
默认值：{
差额：2，
填充：0，
颜色：“#fff”，
},
残疾人士：{
差额：2，
填充：0，
颜色：'#777'，
},
};
const theme=createMuiTheme({
调色板：{
主要：{
主要内容：“777”，
}
}
});
弹箭
停止

---

这是目前的情况：。我只是希望边界再厚一点，我会感谢你的帮助。谢谢

Try:

style={{{border:'2px solid'}}

或throught

makeStyles

const useStyles=makeStyles（主题=>({
按钮：{
边距：主题。间距（1），
边框：“2px实心”
}
}));
函数ThickerButton（）{
返回(
风格
制作风格
);
}

演示：

---

对于我想要实现的目标来说，效果非常好！非常感谢。