-
-
Notifications
You must be signed in to change notification settings - Fork 658
/
ReviewChangesHeader.tsx
42 lines (39 loc) · 1.44 KB
/
ReviewChangesHeader.tsx
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
39
40
41
42
import { Box, styled, Tooltip } from '@mui/material';
import HelpOutline from '@mui/icons-material/HelpOutline';
import { FC } from 'react';
import { PageHeader } from '../../../common/PageHeader/PageHeader';
const StyledHelpOutline = styled(HelpOutline)(({ theme }) => ({
fontSize: theme.fontSizes.mainHeader,
marginLeft: '0.3rem',
color: theme.palette.action.active,
}));
const StyledHeaderHint = styled('div')(({ theme }) => ({
color: theme.palette.text.secondary,
fontSize: theme.fontSizes.smallBody,
}));
export const ReviewChangesHeader: FC = () => (
<PageHeader
actions={''}
titleElement={
<>
<Box
sx={{
display: 'flex',
alignItems: 'center',
}}
>
Review your changes
<Tooltip
title='Here you can see all the changes that you are suggesting and you can send them for review. You can still discard the changes after you sent them for review or even cancel the entire review if you need it'
arrow
>
<StyledHelpOutline />
</Tooltip>
</Box>
<StyledHeaderHint>
Make sure you are sending the right changes to be reviewed
</StyledHeaderHint>
</>
}
/>
);