Избегайте конфликтующих текстовых полей в MUI в wordpress

Привет, я новичок в Material UI и React. Пытаюсь создать один плагин для wordpress. Часть администратора я создаю текстовое поле, используя реакцию MUI. Поле ввода и отступы текстового поля влияют по умолчанию на wordpess load-style.css.

             <TextField label="Role or Title" classes={classes.uniqueclass} placeholder="Developer" fullWidth />

В провайдере темы:

      MuiInput: {
    root: {
      top: [theme.spacing(2),'!important'],
      bottom: theme.spacing(0),
      border: ["none",'!important'],
      outline: `1px solid transparent`,
      background: "transparent",
      padding: theme.spacing(0),
      marginBottom: theme.spacing(4),
      '&$focused': {
        borderColor: theme.palette.primary.main,

      },
    },

По умолчанию wordpress загружается как,

      input[type=checkbox]:focus, input[type=color]:focus, input[type=date]:focus, input[type=datetime-local]:focus, input[type=datetime]:focus, input[type=email]:focus, input[type=month]:focus, input[type=number]:focus, input[type=password]:focus, input[type=radio]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=text]:focus, input[type=time]:focus, input[type=url]:focus, input[type=week]:focus, select:focus, textarea:focus {
    border-color: #2271b1;
    box-shadow: 0 0 0 1px #2271b1;
    outline: 2px solid transparent;
}

Итак, как перезаписать это глобально для всего текста и полей выбора. заранее спасибо

0 ответов

Другие вопросы по тегам