diff --git a/packages/app-treasury/src/Overview/Proposal.tsx b/packages/app-treasury/src/Overview/Proposal.tsx
index d8fae6f9ce..ade012e5e9 100644
--- a/packages/app-treasury/src/Overview/Proposal.tsx
+++ b/packages/app-treasury/src/Overview/Proposal.tsx
@@ -36,7 +36,7 @@ function ProposalDisplay ({ className, proposal: { council, id, proposal }, t }:
       </td>
       <td className='top'>
         <AddressMini
-          label={<label>{t('beneficiary')}</label>}
+          label={t('beneficiary')}
           value={proposal.beneficiary}
         />
       </td>
diff --git a/packages/react-components/src/AddressMini.tsx b/packages/react-components/src/AddressMini.tsx
index 7b660a4d44..4f2c937a4e 100644
--- a/packages/react-components/src/AddressMini.tsx
+++ b/packages/react-components/src/AddressMini.tsx
@@ -109,7 +109,6 @@ export default styled(AddressMini)`
   }
 
   .ui--AddressMini-address {
-    font-family: monospace;
     max-width: 9rem;
     min-width: 9rem;
     overflow: hidden;
diff --git a/packages/react-query/src/AccountName.tsx b/packages/react-query/src/AccountName.tsx
index 5aa5b84d2a..3602fc6d4b 100644
--- a/packages/react-query/src/AccountName.tsx
+++ b/packages/react-query/src/AccountName.tsx
@@ -67,12 +67,15 @@ function AccountName ({ children, className, defaultName, label, onClick, overri
 
     if (api.query.identity?.identityOf) {
       if (identity?.displayName) {
-        const { judgements, displayName } = identity;
-        const isGood = judgements.some(([, judgement]): boolean => judgement.isKnownGood || judgement.isReasonable);
-        const isBad = judgements.some(([, judgement]): boolean => judgement.isErroneous || judgement.isLowQuality);
+        const isGood = identity.judgements.some(([, judgement]): boolean => judgement.isKnownGood || judgement.isReasonable);
+        const isBad = identity.judgements.some(([, judgement]): boolean => judgement.isErroneous || judgement.isLowQuality);
 
         // FIXME This needs to be i18n, with plurals
-        const hover = `${judgements.length ? judgements.length : 'no'} judgement${judgements.length === 1 ? '' : 's'}${judgements.length ? ': ' : ''}${judgements.map(([, judgement]): string => judgement.toString()).join(', ')}`;
+        const hover = (
+          <div className='hover-identity'>
+            <div className='header'>{`${identity.judgements.length ? identity.judgements.length : 'no'} judgement${identity.judgements.length === 1 ? '' : 's'}${identity.judgements.length ? ': ' : ''}${identity.judgements.map(([, judgement]): string => judgement.toString()).join(', ')}`}</div>
+          </div>
+        );
 
         const name = (
           <div className='via-identity'>
@@ -90,7 +93,7 @@ function AccountName ({ children, className, defaultName, label, onClick, overri
                     : 'gray'
               }
             />
-            <div className='name'>{displayName.toUpperCase()}</div>
+            <div className='name'>{identity.displayName.toUpperCase()}</div>
           </div>
         );
 
@@ -125,6 +128,21 @@ function AccountName ({ children, className, defaultName, label, onClick, overri
 }
 
 export default styled(AccountName)`
+  .hover-identity {
+    div+div {
+      margin-top: 0.75rem;
+    }
+
+    table {
+      border: 0;
+
+      td:first-child {
+        padding-right: 0.25rem;
+        text-align: right;
+      }
+    }
+  }
+
   .via-identity {
     display: inline-block;