forked from mui/material-ui
-
Notifications
You must be signed in to change notification settings - Fork 0
/
DemoToolbarRoot.ts
38 lines (35 loc) · 1.17 KB
/
DemoToolbarRoot.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
import { styled, alpha } from '@mui/material/styles';
interface DemoToolbarRootProps {
demoOptions: any;
openDemoSource: any;
}
const DemoToolbarRoot = styled('div', {
shouldForwardProp: (prop) => prop !== 'demoOptions' && prop !== 'openDemoSource',
})<DemoToolbarRootProps>(({ theme, demoOptions, openDemoSource }) => [
{
display: 'none',
[theme.breakpoints.up('sm')]: {
top: 0,
display: 'block',
marginTop: demoOptions.bg === 'inline' ? theme.spacing(1) : -1,
padding: theme.spacing(0.5, 1),
border: `1px solid ${(theme.vars || theme).palette.divider}`,
borderTopWidth: demoOptions.bg === 'inline' ? 1 : 0,
backgroundColor: alpha(theme.palette.grey[50], 0.2),
borderRadius: openDemoSource ? 0 : '0 0 12px 12px',
transition: theme.transitions.create('border-radius'),
...(theme.direction === 'rtl' && {
left: theme.spacing(1),
}),
...(theme.direction !== 'rtl' && {
right: theme.spacing(1),
}),
},
},
theme.applyDarkStyles({
[theme.breakpoints.up('sm')]: {
backgroundColor: alpha(theme.palette.primaryDark[800], 0.2),
},
}),
]);
export default DemoToolbarRoot;