ORGANISATION-KA-INTERNATIONALE/konstitisyon.nu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve Sign component

Browse Source
This commit is contained in:
Cédric Famibelle-Pronzola
2024-05-20 14:43:29 +04:00
parent 482b930e52
commit 644d6ea256
1 changed files with 26 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/session/sign.js
+26 -14
View File
@@ -6,34 +6,46 @@ import {useRouter} from 'next/navigation'
import Box from '@mui/material/Box' import Box from '@mui/material/Box'
import Stack from '@mui/material/Stack' import Stack from '@mui/material/Stack'
import Fab from '@mui/material/Fab' import Fab from '@mui/material/Fab'
import Tooltip from '@mui/material/Tooltip' import {styled} from '@mui/material/styles'
import Tooltip, {tooltipClasses} from '@mui/material/Tooltip'
import LogoutIcon from '@mui/icons-material/Logout' import LogoutIcon from '@mui/icons-material/Logout'
import LoginIcon from '@mui/icons-material/Login' import LoginIcon from '@mui/icons-material/Login'
import PersonAddIcon from '@mui/icons-material/PersonAdd' import PersonAddIcon from '@mui/icons-material/PersonAdd'
const LightTooltip = styled(({className, ...props}) => (
<Tooltip {...props} classes={{popper: className}} />
))(({theme}) => ({
[`& .${tooltipClasses.tooltip}`]: {
backgroundColor: theme.palette.common.white,
color: 'rgba(0, 0, 0, 0.87)',
boxShadow: theme.shadows[1],
fontSize: 15,
},
}))
export default function Sign({session}) { export default function Sign({session}) {
const router = useRouter() const router = useRouter()
return ( return (
<Box sx={{display: 'flex', justifyContent: 'center', marginTop: 1}}> <Box sx={{display: 'flex', justifyContent: session ? 'start' : 'center', marginTop: 1}}>
{session ? ( {session ? (
<Tooltip title='Se déconnecter' placement='left'> <LightTooltip title='Se déconnecter' placement='right'>
<Fab size='small' color='error' onClick={() => signOut()}> <Fab size='large' color='error' onClick={() => signOut()}>
<LogoutIcon fontSize='small' /> <LogoutIcon fontSize='large' />
</Fab> </Fab>
</Tooltip> </LightTooltip>
) : ( ) : (
<Stack direction='row' spacing={2}> <Stack direction='row' spacing={2}>
<Tooltip title='Se connecter' placement='left'> <LightTooltip title='Se connecter' placement='left'>
<Fab size='small' color='success' onClick={() => router.push('/login')}> <Fab size='large' color='success' onClick={() => router.push('/login')}>
<LoginIcon fontSize='small' /> <LoginIcon fontSize='large' />
</Fab> </Fab>
</Tooltip> </LightTooltip>
<Tooltip title='S’enregistrer' placement='right'> <LightTooltip title='S’enregistrer' placement='right'>
<Fab size='small' color='success' onClick={() => router.push('/register')}> <Fab size='large' color='success' onClick={() => router.push('/register')}>
<PersonAddIcon fontSize='small' /> <PersonAddIcon fontSize='large' />
</Fab> </Fab>
</Tooltip> </LightTooltip>
</Stack> </Stack>
)} )}
</Box> </Box>