Как искать аналоги свойств CSS в Material UI?

Question

[RionRedhand]

Допустим, я хочу сделать скругление для элемента.
В CSS это свойство border-radius,
У стилей Material UI это borderRadius
Сейчас пытался это сделать и только случайно наткнулся на это свойство

Как можно искать подобные аналоги у Material UI?
Как вообще можно найти все свойства стилей у Material UI? Я, может, плохо ищу, но не могу найти на их сайте подробное описание всех стилей.

Answer 1

[Дима Паутов]

Что за чушь?
Кто вам такое сказал что есть свойство borderRadius? Оно везде называется border-radius

То, что увидели вы в исходниках - это переменные, миксины, функции, scss или less, т.е. это препроцессоры!

Это должен быть нечто подобный синтаксис

$borderRadius;

include borderRadius(5px);

и т.п.

Comments

[RionRedhand]

Вы немного не поняли, borderRadius это свойство стилей Material UI, я нашел его методом тыка, а хотелось бы не тыком.
Если вы не понимаете о чем я говорю, то вот сайт https://material-ui.com/

[Дима Паутов]

RionRedhand, я вам ещё раз повторяю. Не существует css свойства borderRadius!!!!
Существует лишь border-radius. А то, что вы увидели, я сказал, что это такое.

[Дима Паутов]

RionRedhand, Если вы имеете в виду js свойства для Styled components, тогда это совсем другой вопрос. Это лишь js синтаксис обычных css свойств, только пишутся они через camelCase. Нового там ничего нет

[RionRedhand]

Дима Турков, да я не спорю, что это не свойство CSS(я об этом нигде и не сказал, собственно). Меня интересует, где можно подобное еще найти.

[Дима Паутов]

RionRedhand, вы мне хоть кусочек кода покажите, подобие которого вы хотите найти

[RionRedhand]

export default function LogIn(){
  const useStyles = makeStyles({
    tocenterstyle:{
      display: "flex",
      width: 100
    },
    paperstyle:{
      height: 450,
      width: 400,
      
    },
    typostyle:{
      align: 'center',
      fontSize: 24
    },

    buttonstyle:
    {
      background: "ff3366"
    },

    paperimgstyle:
    {
      height: 100,
      width: 100,
      
    },

    roundtry:{
      borderRadius: 25,
    }

[Дима Паутов]

RionRedhand, ну, я что и сказал borderRadius - это js свойство для установки стиля. Почитайте про CSSOM и как через js устанавливаются css свойства для DOM элементов. Ничего нового тут нет. Всё тоже самое.

Причина разницы банальная:

// Не валидная конструкция, браузер выдаст ошибку, т.к. нельзя так именовать js свойства
border-radius: {
//...
}

// А так можно
borderRadius: {
//...
}

Видишь, разницы в них никакой. Аналогично с backgroundImage vs background-image и т.п.