question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

MuiButtonBase-root override MuiButton-root

See original GitHub issue

I have a component where I override Button root class, but ButtonBaseRoot is overriding my styles.

  • The issue is present in the latest release.
  • I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

ButtonBaseRoot style is overriding Button given classes.

Expected Behavior 🤔

Classes given to Button should override all button styles

Steps to Reproduce 🕹

    import { Button } from '@material-ui/core';
    import { makeStyles } from '@material-ui/styles';
    import React from 'react';

    const useStyles = makeStyles({ root: { backgroundColor: 'red' } });

    const MyButton = (props) => {
        const classes = useStyles();
    
        return <Button classes={classes} {...props} />;
    }

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:13
  • Comments:21 (4 by maintainers)

github_iconTop GitHub Comments

9reactions
jonatasdanielcommented, Apr 26, 2022

I’m still with this problem after upgrading to mUI 5, but the weird thing is that it happens only in some pages, not all.

Anyone found a solution?

3reactions
clarencedesmaraiscommented, Nov 10, 2021

Noticed the error with @mui/material 5.1.0 as well.

image

Read more comments on GitHub >

github_iconTop Results From Across the Web

MuiButtonBase-root override MuiButton-root · Issue #27149
I have a component where I override Button root class, but ButtonBaseRoot is overriding my styles. The issue is present in the latest...
Read more >
Material ui contained button styling being overidden by ...
Upon further investigation I found out the the .MuiButton-containedPrimary style is being overidden by the .MuiButtonBase-root styling as seen ...
Read more >
How to customize - Material UI
Overriding nested component styles​​ First, use your browser's dev tools to identify the class for the component slot you want to override. The...
Read more >
Is it possible to have root buttons styles override all others?
Something I assumed when changing the Material UI button theming is that root styles should be the "source of truth" and override all...
Read more >
4 Ways to Override Material UI Styles | by John Au-Yeung
Material UI offers more than just a single way to override its ... all the styles that we want to apply in the...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found