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

cleaning up footer

Browse Source
This commit is contained in:
talksik
2022-05-30 09:41:49 -05:00
parent 1e005e1f10
commit ff01b9a7cb
1 changed files with 39 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/desktop/src/components/FooterControls.tsx
+39 -43
View File
@@ -78,7 +78,7 @@ export default function FooterControls() {
<Switch color="secondary" size="small" /> <Switch color="secondary" size="small" />
</Tooltip> </Tooltip>
<Stack direction={'row'} alignItems={'center'} component="div" sx={{ flex: 1 }}> <Stack direction={'row'} alignItems={'center'} component="div">
<Tooltip title="Sound configuration"> <Tooltip title="Sound configuration">
<IconButton color="inherit" size="small"> <IconButton color="inherit" size="small">
<FiHeadphones /> <FiHeadphones />
@@ -91,50 +91,46 @@ export default function FooterControls() {
</Stack> </Stack>
{selectedConversation && ( {selectedConversation && (
<Box sx={{ mx: 'auto' }}> <Stack
<Stack direction={'row'}
direction={'row'} sx={{
sx={{ flex: 1,
py: 2, mx: 'auto',
px: 2, WebkitAppRegion: 'drag',
borderBottom: '1px solid', cursor: 'pointer',
borderBottomColor: blueGrey[100], }}
WebkitAppRegion: 'drag', alignItems={'center'}
cursor: 'pointer', justifyContent={'flex-start'}
}} >
alignItems={'center'} <IconButton color="primary" size="small">
justifyContent={'flex-start'} <FiSun />
> </IconButton>
<IconButton color="primary" size="small">
<FiSun />
</IconButton>
<Box sx={{ color: 'GrayText' }}> <Box sx={{ color: 'GrayText' }}>
<ConversationLabel <ConversationLabel
users={selectedConversation.userCache ?? []} users={selectedConversation.userCache ?? []}
conversationName={selectedConversation.name} conversationName={selectedConversation.name}
isSelected={true} isSelected={true}
/>
</Box>
<AvatarGroup variant={'rounded'}>
{selectedConversation.userCache?.map((conversationUser, index) => (
<Avatar
key={`${selectedConversation.id}-${conversationUser.uid}-convoIcon`}
alt={conversationUser?.displayName}
src={conversationUser?.photoUrl}
sx={{
width: 30,
height: 30,
opacity: selectedConversation.membersInRoom?.includes(conversationUser.uid)
? '100%'
: '20%',
}}
/> />
</Box> ))}
</AvatarGroup>
<AvatarGroup variant={'rounded'}> </Stack>
{selectedConversation.userCache?.map((conversationUser, index) => (
<Avatar
key={`${selectedConversation.id}-${conversationUser.uid}-convoIcon`}
alt={conversationUser?.displayName}
src={conversationUser?.photoUrl}
sx={{
width: 30,
height: 30,
opacity: selectedConversation.membersInRoom?.includes(conversationUser.uid)
? '100%'
: '20%',
}}
/>
))}
</AvatarGroup>
</Stack>
</Box>
)} )}
{/* todo: add a third mode which is when toggle broadcasting */} {/* todo: add a third mode which is when toggle broadcasting */}