Не могу изменить borderRadius у компонента Badge
Есть такой компонент
<BadgeErrorStyled
variant="standard"
color={severity}
badgeContent={countErrorsInOneAlert}
max={100000}
/>
у него выставляется бордер радиус 10px, а мне нужно 64 по макету
Пишу для него такие стили, радиус все-равно 10пкс
export const BadgeErrorStyled = styled(Badge)(({ theme: { spacing } }) => ({
height: spacing(2.5),
marginTop: spacing(2.5),
marginRight: spacing(2),
borderRadius: '64px',
}));
Ответы (1 шт):
Автор решения: Oliver Patterson
→ Ссылка
Вам нужно стилизовать .MuiBadge-badge
.
export const BadgeErrorStyled = styled(Badge)(({ theme: { spacing } }) => ({
"& .MuiBadge-badge":
{
height: spacing(2.5),
marginTop: spacing(2.5),
marginRight: spacing(2),
borderRadius: '64px',
}
}));