initially getting it vertical and I kind of like the feel
This commit is contained in:
@@ -70,13 +70,7 @@ export default function FooterControls() {
|
|||||||
return (
|
return (
|
||||||
<Box
|
<Box
|
||||||
sx={{
|
sx={{
|
||||||
mt: 'auto',
|
maxWidth: 100,
|
||||||
borderTop: '1px solid',
|
|
||||||
borderTopColor: blueGrey[100],
|
|
||||||
display: 'flex',
|
|
||||||
alignItems: 'center',
|
|
||||||
justifyContent: 'flex-start',
|
|
||||||
width: '100%',
|
|
||||||
|
|
||||||
zIndex: 10,
|
zIndex: 10,
|
||||||
boxShadow: 10,
|
boxShadow: 10,
|
||||||
@@ -85,7 +79,7 @@ export default function FooterControls() {
|
|||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Stack
|
<Stack
|
||||||
direction={'row'}
|
direction={'column'}
|
||||||
alignItems={'center'}
|
alignItems={'center'}
|
||||||
justifyContent={'flex-start'}
|
justifyContent={'flex-start'}
|
||||||
sx={{
|
sx={{
|
||||||
@@ -94,7 +88,7 @@ export default function FooterControls() {
|
|||||||
flex: 1,
|
flex: 1,
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Stack spacing={1} direction={'row'} alignItems={'center'}>
|
<Stack spacing={1} direction={'column'} alignItems={'center'}>
|
||||||
<IconButton
|
<IconButton
|
||||||
onClick={handleClickProfile}
|
onClick={handleClickProfile}
|
||||||
size="small"
|
size="small"
|
||||||
@@ -127,114 +121,93 @@ export default function FooterControls() {
|
|||||||
</Stack>
|
</Stack>
|
||||||
|
|
||||||
{selectedConversation && (
|
{selectedConversation && (
|
||||||
<>
|
<Stack direction={'column'} spacing={1}>
|
||||||
<Stack
|
<AvatarGroup
|
||||||
direction={'row'}
|
variant={'rounded'}
|
||||||
sx={{
|
sx={{
|
||||||
flex: 1,
|
display: 'flex',
|
||||||
mx: 'auto',
|
flexDirection: 'column',
|
||||||
|
'& >:first-child': {
|
||||||
WebkitAppRegion: 'drag',
|
marginTop: 0,
|
||||||
cursor: 'pointer',
|
},
|
||||||
|
'& > *': {
|
||||||
|
marginLeft: '0 !important' as any,
|
||||||
|
marginTop: -2,
|
||||||
|
},
|
||||||
}}
|
}}
|
||||||
alignItems={'center'}
|
|
||||||
justifyContent={'center'}
|
|
||||||
spacing={1}
|
|
||||||
>
|
>
|
||||||
<Container
|
{selectedConversation.members?.map((conversationUser, index) => (
|
||||||
maxWidth={'sm'}
|
<Avatar
|
||||||
sx={{
|
key={`${selectedConversation._id.toString()}-${conversationUser._id.toString()}-convoIcon`}
|
||||||
display: 'flex',
|
alt={conversationUser?.givenName}
|
||||||
justifyContent: 'center',
|
src={conversationUser?.picture}
|
||||||
}}
|
sx={{
|
||||||
>
|
opacity: selectedConversation.tunedInUsers?.includes(
|
||||||
<IconButton color="primary" size="small">
|
conversationUser._id.toString(),
|
||||||
<FiSun />
|
)
|
||||||
</IconButton>
|
? '100%'
|
||||||
|
: '20%',
|
||||||
<ConversationLabel
|
}}
|
||||||
users={selectedConversation.members ?? []}
|
|
||||||
conversationName={selectedConversation.name}
|
|
||||||
isSelected={true}
|
|
||||||
/>
|
/>
|
||||||
</Container>
|
))}
|
||||||
</Stack>
|
</AvatarGroup>
|
||||||
|
|
||||||
<Stack sx={{ ml: 'auto' }} direction={'row'} spacing={1}>
|
<Tooltip title="Mark priority or not!">
|
||||||
<AvatarGroup variant={'rounded'}>
|
<IconButton
|
||||||
{selectedConversation.members?.map((conversationUser, index) => (
|
sx={{
|
||||||
<Avatar
|
color: 'white',
|
||||||
key={`${selectedConversation._id.toString()}-${conversationUser._id.toString()}-convoIcon`}
|
}}
|
||||||
alt={conversationUser?.givenName}
|
size="small"
|
||||||
src={conversationUser?.picture}
|
>
|
||||||
sx={{
|
<FiActivity />
|
||||||
opacity: selectedConversation.tunedInUsers?.includes(
|
</IconButton>
|
||||||
conversationUser._id.toString(),
|
</Tooltip>
|
||||||
)
|
|
||||||
? '100%'
|
|
||||||
: '20%',
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
))}
|
|
||||||
</AvatarGroup>
|
|
||||||
|
|
||||||
<Tooltip title="Mark priority or not!">
|
<Tooltip title="Paste image or link!">
|
||||||
<IconButton
|
<IconButton
|
||||||
sx={{
|
sx={{
|
||||||
color: 'white',
|
color: 'white',
|
||||||
}}
|
}}
|
||||||
size="small"
|
size="small"
|
||||||
>
|
>
|
||||||
<FiActivity />
|
<FiLink />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
|
|
||||||
<Tooltip title="Paste image or link!">
|
<Tooltip title="Show screen!">
|
||||||
<IconButton
|
<IconButton
|
||||||
sx={{
|
sx={{
|
||||||
color: 'white',
|
color: 'white',
|
||||||
}}
|
}}
|
||||||
size="small"
|
size="small"
|
||||||
>
|
>
|
||||||
<FiLink />
|
<FiAirplay />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
|
|
||||||
<Tooltip title="Show screen!">
|
<Tooltip title="Show video!">
|
||||||
<IconButton
|
<IconButton
|
||||||
sx={{
|
sx={{
|
||||||
color: 'white',
|
color: 'white',
|
||||||
}}
|
}}
|
||||||
size="small"
|
size="small"
|
||||||
>
|
>
|
||||||
<FiAirplay />
|
<FiVideoOff />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
|
|
||||||
<Tooltip title="Show video!">
|
{/* todo: not speaking mode, speaking mode, locked in mode */}
|
||||||
<IconButton
|
<Tooltip title="Speak or toggle by clicking here!">
|
||||||
sx={{
|
<IconButton
|
||||||
color: 'white',
|
sx={{
|
||||||
}}
|
color: 'white',
|
||||||
size="small"
|
}}
|
||||||
>
|
size="small"
|
||||||
<FiVideoOff />
|
>
|
||||||
</IconButton>
|
<FiSun />
|
||||||
</Tooltip>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
{/* todo: not speaking mode, speaking mode, locked in mode */}
|
</Stack>
|
||||||
<Tooltip title="Speak or toggle by clicking here!">
|
|
||||||
<IconButton
|
|
||||||
sx={{
|
|
||||||
color: 'white',
|
|
||||||
}}
|
|
||||||
size="small"
|
|
||||||
>
|
|
||||||
<FiSun />
|
|
||||||
</IconButton>
|
|
||||||
</Tooltip>
|
|
||||||
</Stack>
|
|
||||||
</>
|
|
||||||
)}
|
)}
|
||||||
</Stack>
|
</Stack>
|
||||||
|
|
||||||
|
|||||||
@@ -22,7 +22,7 @@ export default function Terminal() {
|
|||||||
disableGutters={true}
|
disableGutters={true}
|
||||||
sx={{
|
sx={{
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
flexDirection: 'column',
|
flexDirection: 'row',
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Grid container spacing={0} sx={{ flex: 1 }}>
|
<Grid container spacing={0} sx={{ flex: 1 }}>
|
||||||
|
|||||||
Reference in New Issue
Block a user