Почему не применяются стили для кнопки в material ui?

Question

[Артем Рассадин]

Добрый день! Сегодня начал изучать material ui и уже есть вопрос. Весь код который будет ниже я брал из документации, изменял незначительно.

const useStyles = makeStyles({
    root: {
        color: '#fff',
        backgroundColor: "#000",
        border: 0,
        borderRadius: 3,
        height: 48,
        padding: '0 30px',
    },
});

export default function Weather(props) {
    const classes = useStyles(props);

    return (<Button className={classes.root}>weather</Button>);
}

В стилях написано много чего, но не все из них отображаются в браузере. Вот что получается:
В чем может быть проблема?

P.S Я нашел в чем проблема. Дело в том, что стили самого material ui перебивают мои стили. Как это можно исправить?

Comments

[Everybody_Lies]

Дело в том, что стили самого material ui перебивают мои стили. Как это можно исправить?

https://mui.com/customization/how-to-customize/

[Артем Рассадин]

Everybody_Lies, спасибо большое! К сожалению, не смогу оставить это решением из-за того, что это комментарий.