@brightlayer-ui/react-themes/componentStylesOverrides/MuiButtonGroup.js

React themes for Brightlayer UI applications

import * as BLUIColors from '@brightlayer-ui/colors';
import Color from 'color';
export default {
    styleOverrides: {
        root: () => ({
            '&.Mui-disabled': {
                border: `1px solid ${Color(BLUIColors.black[500]).alpha(0.12).string()}`,
            },
        }),
        outlined: () => ({
            color: BLUIColors.black[50],
        }),
        groupedText: ({ theme }) => ({
            ...theme.applyStyles('dark', {
                '&:not(:last-child).Mui-disabled': {
                    borderColor: theme.vars.palette.divider,
                },
            }),
        }),
        groupedOutlinedHorizontal: () => ({
            '&:not(:last-of-type)': {
                '&:hover': {
                    borderRightColor: 'transparent',
                },
            },
        }),
        groupedTextPrimary: ({ theme }) => ({
            '&:not(:last-child)': {
                '&.Mui-disabled': {
                    borderColor: theme.vars.palette.divider,
                },
            },
            ...theme.applyStyles('dark', {
                '&:not(:last-child).Mui-disabled': {
                    borderColor: theme.vars.palette.divider,
                },
            }),
        }),
        groupedTextSecondary: ({ theme }) => ({
            '&:not(:last-child)': {
                '&.Mui-disabled': {
                    borderColor: theme.vars.palette.divider,
                },
            },
            ...theme.applyStyles('dark', {
                '&:not(:last-child).Mui-disabled': {
                    borderColor: theme.vars.palette.divider,
                },
            }),
        }),
    },
};