cleaning footer

This commit is contained in:
talksik
2022-05-31 06:53:43 -05:00
parent e39df85faa
commit 6ad13f25e4
@@ -15,7 +15,7 @@ import {
Tooltip, Tooltip,
Typography, Typography,
} from '@mui/material'; } from '@mui/material';
import { FiHeadphones, FiHelpCircle, FiLogOut, FiSun } from 'react-icons/fi'; import { FiHeadphones, FiHelpCircle, FiLink, FiLogOut, FiSun } from 'react-icons/fi';
import React, { useCallback } from 'react'; import React, { useCallback } from 'react';
import ConversationLabel from '../subcomponents/ConversationLabel'; import ConversationLabel from '../subcomponents/ConversationLabel';
@@ -52,17 +52,15 @@ export default function FooterControls() {
display: 'flex', display: 'flex',
alignItems: 'center', alignItems: 'center',
justifyContent: 'flex-start', justifyContent: 'flex-start',
gap: 2,
width: '100%', width: '100%',
zIndex: 10, zIndex: 10,
boxShadow: 10, boxShadow: 10,
bgcolor: blueGrey[200], bgcolor: blueGrey[800],
}} }}
> >
<Stack <Stack
spacing={1}
direction={'row'} direction={'row'}
alignItems={'center'} alignItems={'center'}
justifyContent={'flex-start'} justifyContent={'flex-start'}
@@ -83,21 +81,23 @@ export default function FooterControls() {
<Avatar alt={user.displayName} src={user.photoURL} /> <Avatar alt={user.displayName} src={user.photoURL} />
</IconButton> </IconButton>
<Tooltip title="Sound configuration">
<IconButton
sx={{
color: 'white',
}}
size="small"
>
<FiHeadphones />
</IconButton>
</Tooltip>
<Tooltip title={'overlay mode'}> <Tooltip title={'overlay mode'}>
<Switch color="secondary" size="small" /> <Switch color="secondary" size="small" />
</Tooltip> </Tooltip>
<Stack direction={'row'} alignItems={'center'} component="div"> <Button size={'small'} color={'secondary'} variant="text">
<Tooltip title="Sound configuration"> flow
<IconButton color="inherit" size="small"> </Button>
<FiHeadphones />
</IconButton>
</Tooltip>
<Button size={'small'} color={'secondary'} variant="text">
flow
</Button>
</Stack>
{selectedConversation && ( {selectedConversation && (
<> <>
@@ -150,20 +150,38 @@ export default function FooterControls() {
</> </>
)} )}
{/* todo: add a third mode which is when toggle broadcasting */} <Stack sx={{ ml: 'auto' }} direction={'row'} spacing={1}>
{selectedConversation ? (
<Tooltip title="Speak or toggle by clicking here!">
<Fab color="primary" aria-label="add" size="medium">
<FiSun />
</Fab>
</Tooltip>
) : (
<Tooltip title="No conversation selected!"> <Tooltip title="No conversation selected!">
<IconButton color="inherit" size="small"> <IconButton
<FiSun /> sx={{
color: 'white',
}}
size="small"
>
<FiLink />
</IconButton> </IconButton>
</Tooltip> </Tooltip>
)}
{/* todo: add a third mode which is when toggle broadcasting with lock on top right badge */}
{selectedConversation ? (
<Tooltip title="Speak or toggle by clicking here!">
<Fab color="primary" aria-label="add" size="medium">
<FiSun />
</Fab>
</Tooltip>
) : (
<Tooltip title="No conversation selected!">
<IconButton
sx={{
color: 'white',
}}
size="small"
>
<FiSun />
</IconButton>
</Tooltip>
)}
</Stack>
</Stack> </Stack>
<Menu <Menu