-
-
Notifications
You must be signed in to change notification settings - Fork 379
Closed
Labels
component: toggleChanges related to the toggle component.Changes related to the toggle component.component: toggle groupChanges related to the toggle group component.Changes related to the toggle group component.type: new featureExpand the scope of the product to solve a new problem.Expand the scope of the product to solve a new problem.
Description
I'd like to style a <ToggleButton> to look and behave exactly like a <Button> without explicitly overriding all of the ToggleButton's class styles.
I've learned that I can inject Button styles this way:
<ToggleButton
classes={{
root: 'MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedSecondary MuiButton-disableElevation',
selected: 'MuiButton-root:hover MuiButton-containedSecondary:hover MuiButton-disableElevation:active MuiButton-disableElevation:hover MuiButton-contained:active MuiButton-contained:hover',
}}
>
This halfway solves my problem. However, I'd like to avoid injecting the classes MuiToggleButton-root MuiToggleButtonGroup-grouped MuiToggleButtonGroup-groupedHorizontal because they're overriding the ones I've added above.
Is this sort of thing possible? The reason I'm trying this is because I can't put a <Button> inside of a <ToggleButton> without getting an error, so I figured I'd try to make it look and behave like a <Button>.
Thanks
Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
component: toggleChanges related to the toggle component.Changes related to the toggle component.component: toggle groupChanges related to the toggle group component.Changes related to the toggle group component.type: new featureExpand the scope of the product to solve a new problem.Expand the scope of the product to solve a new problem.
Projects
Status
Recently completed