diff --git a/src/components/AppLayout/Header/components/SafeTokenWidget/index.tsx b/src/components/AppLayout/Header/components/SafeTokenWidget/index.tsx index 6b29960034..d5547a46a0 100644 --- a/src/components/AppLayout/Header/components/SafeTokenWidget/index.tsx +++ b/src/components/AppLayout/Header/components/SafeTokenWidget/index.tsx @@ -1,6 +1,8 @@ -import { Box, ButtonBase } from '@material-ui/core' +import { Box } from '@material-ui/core' import { Text, Tooltip } from '@gnosis.pm/safe-react-components' import { useSelector } from 'react-redux' +import { Link } from 'react-router-dom' + import Img from 'src/components/layout/Img' import { getShortName, _getChainId } from 'src/config' import useSafeAddress from 'src/logic/currentSession/hooks/useSafeAddress' @@ -33,18 +35,19 @@ const StyledWrapper = styled(Box)` justify-content: center; ` -const buttonStyle = { - alignSelf: 'stretch', - display: 'flex', - borderRadius: '8px', - padding: '0px 8px 0px 8px', - backgroundColor: background, - margin: '8px 16px', - height: '30px', - alignItems: 'center', - justifyContent: 'center', - gap: '8px', -} +const StyledLink = styled(Link)` + align-self: stretch; + display: flex; + border-radius: 8px; + padding: 0px 8px 0px 8px; + text-decoration: none; + background-color: ${background}; + margin: 8px 16px; + height: 30px; + align-items: center; + justify-content: center; + gap: 8px; +` const SafeTokenWidget = (): JSX.Element | null => { const safeTokens = useSelector(extendedSafeTokensSelector) @@ -83,12 +86,12 @@ const SafeTokenWidget = (): JSX.Element | null => { - + Safe token {flooredTotalAllocation} - +