Files
react-test/docs/src/components/blog/material-ui-v6-is-out/FreeTemplatesBento.js
how2ice 005cf56baf
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
init project
2025-12-12 14:26:25 +09:00

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>
);
}