Some checks failed
No response / noResponse (push) Has been cancelled
CI / Continuous releases (push) Has been cancelled
CI / test-dev (macos-latest) (push) Has been cancelled
CI / test-dev (ubuntu-latest) (push) Has been cancelled
CI / test-dev (windows-latest) (push) Has been cancelled
Maintenance / main (push) Has been cancelled
Scorecards supply-chain security / Scorecards analysis (push) Has been cancelled
CodeQL / Analyze (push) Has been cancelled
42 lines
1.2 KiB
JavaScript
42 lines
1.2 KiB
JavaScript
import Box from '@mui/material/Box';
|
|
|
|
export default function FreeTemplatesBento() {
|
|
return (
|
|
<Box sx={{ position: 'relative' }}>
|
|
<Box
|
|
sx={(theme) => ({
|
|
width: '100vw',
|
|
position: 'relative',
|
|
left: '50%',
|
|
transform: 'translateX(-50%)',
|
|
py: 3,
|
|
borderBlock: '1px solid',
|
|
borderColor: 'divider',
|
|
background:
|
|
'linear-gradient(180deg, var(--muidocs-palette-primary-50) 0%, hsla(215, 15%, 97%, 0.6) 100%)',
|
|
...theme.applyStyles('dark', {
|
|
background:
|
|
'linear-gradient(180deg, hsla(210, 100%, 23%, 0.1) 0%, hsla(210, 14%, 4%, 0.5) 100%)',
|
|
}),
|
|
})}
|
|
>
|
|
<Box
|
|
component="img"
|
|
src="/static/blog/material-ui-v6-is-out/light-templates.png"
|
|
loading="lazy"
|
|
sx={(theme) => ({
|
|
width: '100%',
|
|
maxWidth: 1000,
|
|
mx: 'auto',
|
|
display: 'block',
|
|
height: 'auto',
|
|
...theme.applyStyles('dark', {
|
|
content: `url(/static/blog/material-ui-v6-is-out/dark-templates.png)`,
|
|
}),
|
|
})}
|
|
/>
|
|
</Box>
|
|
</Box>
|
|
);
|
|
}
|