Как изменить цвет переключателя в дизайне муравьев?

Я использую радио antd и флажки. Я хочу придать им индивидуальные цвета. Я нашел ответ о флажке, но не нашел способа изменить цвет переключателя.

Есть ли способ сделать это?


person Ali Ahmad    schedule 27.06.2020    source источник


Ответы (1)


Вы можете добиться этого, переопределив следующие классы css:

.ant-radio-checked .ant-radio-inner{
  border-color: red !important ;
}

.ant-radio-checked .ant-radio-inner:after{
  background-color: red;
}

.ant-radio:hover .ant-radio-inner {
  border-color: red ;
}

Первый блок отвечает за раскрашивание кружка вокруг точки в радио. Вы можете игнорировать правило! Important, но тогда вам придется переопределить селектор: focus, например:

.ant-radio-checked .ant-radio-inner:focus{
  border-color: red;
}

Второй блок раскрашивает точку в середине выбранного радио. Последний цветовой круг при наведении. Я не совсем уверен, почему ant-radio-inner должен быть внутри radio: hover, но у меня это работает.

person Pabblo13    schedule 02.07.2020
comment
Нужно ли нам ссылаться на класс в нашем коде, или он будет выбран сам по себе. Посмотрите мой пост и посмотрите, сможете ли вы там помочь. stackoverflow.com/questions/63799078/ - person Sarah; 08.09.2020