css - 如何在覆盖 npm 包的 css 时将普通 css 写入材料 UI makeStyles

Question

我目前正在开发 SunEditor-React NPM 包。一些设计使我的模板不对齐。所以我打算覆盖css，只使用需要的css。

目前在我的项目中，我正在使用 Material UI makeStyles 来设置我的组件的样式。

这是我当前的组件样式表。

import { makeStyles } from '@material-ui/core/styles';

export const useStyles = makeStyles(({ spacing, palette: { gray } }) => ({
  container: {
    display: 'flex',
    flexWrap: 'nowrap',
    justifyContent: 'center',
    flexDirection: 'column',
    alignItems: 'center',
    paddingBottom: spacing(6),
    textAlign: 'center',
  },
  title: {
    margin: spacing(1.5, 0, 1),
  },
  subtitle: { color: gray.dark, marginBottom: spacing(4) },
  htmlPreview: {
    pointerEvents: 'none',
  },
  loader: {
    position: 'static',
    width: '100%',
    height: spacing(40),
  },
}));

我需要把这个 css 写到上面的 makeStyles 中。

.sun-editor .se-container {
  display: flex;
  flex-direction: column-reverse;
}

.sun-editor .se-wrapper .se-wrapper-inner {
  height: 100% !important;
  max-height: 23em;
}

.sun-editor .se-wrapper .se-placeholder {
  padding-left: 5px !important;
  padding-right: 5px !important;
  padding-top: 5px !important;
}

.sun-editor-editable {
  padding: 5px !important;
}

.sun-editor .se-toolbar-cover {
  padding: 5px;
}

谁能帮我做到这一点。先感谢您。