diff --git a/packages/page-accounts/src/Sidebar/Sidebar.tsx b/packages/page-accounts/src/Sidebar/Sidebar.tsx index faef91eb29..f8af3393f8 100644 --- a/packages/page-accounts/src/Sidebar/Sidebar.tsx +++ b/packages/page-accounts/src/Sidebar/Sidebar.tsx @@ -9,10 +9,10 @@ import React, { useCallback } from 'react'; import { Label } from 'semantic-ui-react'; import styled from 'styled-components'; import { useAccountInfo, useApi, useRegistrars, useToggle } from '@polkadot/react-hooks'; - import { classes } from '@polkadot/react-components/util'; import { colorLink } from '@polkadot/react-components/styles/theme'; import { AccountNameJudgement, AccountName, AddressMini, AvatarItem, Button, Icon, IconLink, IdentityIcon, Input, InputTags, LinkExternal, Transfer } from '@polkadot/react-components'; +import { isHex } from '@polkadot/util'; import { useTranslation } from '../translate'; @@ -315,13 +315,17 @@ function Sidebar ({ address, className, onClose, onUpdateName, style }: Props):
{t('email')}
- - {identity.email} - + {isHex(identity.email) + ? identity.email + : ( + + {identity.email} + + )}
)} @@ -329,13 +333,17 @@ function Sidebar ({ address, className, onClose, onUpdateName, style }: Props):
{t('website')}
- - {identity.web} - + {isHex(identity.web) + ? identity.web + : ( + + {identity.web} + + )}
)} @@ -343,13 +351,17 @@ function Sidebar ({ address, className, onClose, onUpdateName, style }: Props):
{t('twitter')}
- - {identity.twitter} - + {isHex(identity.twitter) + ? identity.twitter + : ( + + {identity.twitter} + + )}
)} @@ -495,8 +507,10 @@ export default React.memo(styled(Sidebar)` } .td { - padding-left: 0.6rem; flex: 1; + overflow: hidden; + padding-left: 0.6rem; + text-overflow: ellipsis; } } }