talksik/nirvana-v3
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

nice updated timeline although still static

Browse Source
This commit is contained in:
talksik
2022-06-25 11:34:58 -05:00
parent 977697de4c
commit 2da1dd1490
1 changed files with 165 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/desktop/src/tree/MainPanel.tsx
+165 -28
View File
@@ -158,11 +158,84 @@ function ConversationDetails({ masterConversation }: { masterConversation: Maste
last week last week
</Typography> </Typography>
<ConversationChunk /> <Card sx={{ display: 'flex', flexDirection: 'column', p: 2 }}>
<Stack
direction={'row'}
alignItems={'center'}
justifyContent="flex-start"
spacing={2}
>
<Avatar
sx={{
width: 20,
height: 20,
}}
alt="Remy Sharp"
src="https://mui.com/static/images/avatar/2.jpg"
/>
<ConversationChunk /> <Typography variant={'subtitle2'} color={'GrayText'}>
Arjun Patel
</Typography>
<ConversationChunk /> <Typography variant={'caption'} color={'GrayText'}>
6/18/22 | 2:35pm
</Typography>
</Stack>
</Card>
<Card sx={{ display: 'flex', flexDirection: 'column', p: 2 }}>
<Stack
direction={'row'}
alignItems={'center'}
justifyContent="flex-start"
spacing={2}
>
<Avatar
sx={{
width: 20,
height: 20,
}}
alt="Remy Sharp"
src="https://mui.com/static/images/avatar/1.jpg"
/>
<Typography variant={'subtitle2'} color={'GrayText'}>
James Pod
</Typography>
<Typography variant={'caption'} color={'GrayText'}>
6/19/22 | 10:00am
</Typography>
</Stack>
</Card>
<Card sx={{ display: 'flex', flexDirection: 'column', p: 2 }}>
<Stack
direction={'row'}
alignItems={'center'}
justifyContent="flex-start"
spacing={2}
>
<Avatar
sx={{
width: 20,
height: 20,
opacity: 0.2,
}}
alt="Remy Sharp"
src="https://mui.com/static/images/avatar/2.jpg"
/>
<Typography variant={'subtitle2'} color={'GrayText'}>
Arjun Patel
</Typography>
<Typography variant={'caption'} color={'GrayText'}>
6/19/22 | 4:02pm
</Typography>
</Stack>
</Card>
</Stack> </Stack>
<Stack spacing={1} sx={{ display: 'flex', flexDirection: 'column', py: 2 }}> <Stack spacing={1} sx={{ display: 'flex', flexDirection: 'column', py: 2 }}>
@@ -170,7 +243,32 @@ function ConversationDetails({ masterConversation }: { masterConversation: Maste
yesterday yesterday
</Typography> </Typography>
<ConversationChunk /> <Card sx={{ display: 'flex', flexDirection: 'column', p: 2 }}>
<Stack
direction={'row'}
alignItems={'center'}
justifyContent="flex-start"
spacing={2}
>
<Avatar
sx={{
width: 20,
height: 20,
opacity: 0.2,
}}
alt="Remy Sharp"
src="https://mui.com/static/images/avatar/3.jpg"
/>
<Typography variant={'subtitle2'} color={'GrayText'}>
Joshua Bottle
</Typography>
<Typography variant={'caption'} color={'GrayText'}>
11:35am
</Typography>
</Stack>
</Card>
</Stack> </Stack>
<Stack spacing={1} sx={{ display: 'flex', flexDirection: 'column', py: 2 }}> <Stack spacing={1} sx={{ display: 'flex', flexDirection: 'column', py: 2 }}>
@@ -178,9 +276,58 @@ function ConversationDetails({ masterConversation }: { masterConversation: Maste
today today
</Typography> </Typography>
<ConversationChunk /> <Card sx={{ display: 'flex', flexDirection: 'column', p: 2 }}>
<Stack
direction={'row'}
alignItems={'center'}
justifyContent="flex-start"
spacing={2}
>
<Avatar
sx={{
width: 20,
height: 20,
}}
alt="Remy Sharp"
src="https://mui.com/static/images/avatar/2.jpg"
/>
<ConversationChunk /> <Typography variant={'subtitle2'} color={'GrayText'}>
Arjun Patel
</Typography>
<Typography variant={'caption'} color={'GrayText'}>
4:02pm
</Typography>
</Stack>
</Card>
<Card sx={{ display: 'flex', flexDirection: 'column', p: 2 }}>
<Stack
direction={'row'}
alignItems={'center'}
justifyContent="flex-start"
spacing={2}
>
<Avatar
sx={{
width: 20,
height: 20,
opacity: 0.2,
}}
alt="Remy Sharp"
src="https://mui.com/static/images/avatar/4.jpg"
/>
<Typography variant={'subtitle2'} color={'GrayText'}>
Mary Ann
</Typography>
<Typography variant={'caption'} color={'GrayText'}>
4:03pm
</Typography>
</Stack>
</Card>
</Stack> </Stack>
</Container> </Container>
</Stack> </Stack>
@@ -250,34 +397,24 @@ function valueLabelFormat(value: number) {
function ConversationChunk() { function ConversationChunk() {
return ( return (
<Card sx={{ display: 'flex', flexDirection: 'column', p: 2 }}> <Card sx={{ display: 'flex', flexDirection: 'column', p: 2 }}>
<Stack direction={'row'} alignItems={'center'} justifyContent="flex-end" spacing={2}> <Stack direction={'row'} alignItems={'center'} justifyContent="flex-start" spacing={2}>
<Typography variant={'caption'} color={'GrayText'}> <Avatar
Monday sx={{
width: 10,
height: 10,
}}
alt="Remy Sharp"
src="https://mui.com/static/images/avatar/2.jpg"
/>
<Typography variant={'subtitle2'} color={'GrayText'}>
Arjun Patel
</Typography> </Typography>
<Divider orientation={'vertical'} flexItem />
<Typography variant={'caption'} color={'GrayText'}>
2:30pm
</Typography>
<Divider orientation={'vertical'} flexItem />
<Typography variant={'caption'} color={'GrayText'}> <Typography variant={'caption'} color={'GrayText'}>
6/18/22 6/18/22
</Typography> </Typography>
</Stack> </Stack>
<Box sx={{ position: 'relative', p: 4 }}>
<Slider
aria-label="Restricted values"
defaultValue={0}
valueLabelFormat={valueLabelFormat}
getAriaValueText={valuetext}
valueLabelDisplay="on"
marks={marks}
/>
</Box>
</Card> </Card>
); );
} }