material-ui icon indicating copy to clipboard operation
material-ui copied to clipboard

MUI Alert Slots Missing

Open ThreeCrown opened this issue 4 months ago • 0 comments

Steps to reproduce

Use Mui Alert and attempt to set the backdrop Does not set a backdrop

Current behavior

Currently working with an alert and attempting to set a backdropFilter to blur. Classes only accept strings and I don't want to have to rewrite the entire CSS as I don't know the defaults There is no slotProp for the root component so I can access the SX.

Expected behavior

Should be able to access slotProps for the root to reach it's SX to style.

Context

<Alert
          severity="error"
          variant="outlined"
          sx={{
            position: 'absolute',
            top: -55,
            left: 0,
            right: 0,
            zIndex: 10,
            borderRadius: '10px',
            background: 'linear-gradient(135deg, rgba(255,0,0,0.2), rgba(120,0,0,0.3))',
            backdropFilter: 'blur(20px)',
          }}
          iconMapping={{
            error: <ErrorOutline fontSize="medium" className="Alert-Icon" />,
          }}
        >

Your environment

No response

Search keywords: Alert Slots backdropFilter CSS SX Styles

ThreeCrown avatar Oct 17 '24 07:10 ThreeCrown