diff --git a/client/src/components/atoms/Account.module.scss b/client/src/components/atoms/Account.module.scss
index f658d5d..3bff029 100644
--- a/client/src/components/atoms/Account.module.scss
+++ b/client/src/components/atoms/Account.module.scss
@@ -2,10 +2,12 @@
 
 .account {
     display: flex;
+    flex-wrap: wrap;
     align-items: center;
     text-align: left;
 
     > div {
+        flex: 0 0 80%;
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
@@ -14,6 +16,12 @@
     }
 }
 
+.accountType {
+    width: 100%;
+    margin-left: calc(1.5rem + #{$spacer / 3});
+    font-size: $font-size-mini;
+}
+
 .blockies {
     width: 1.5rem;
     height: 1.5rem;
diff --git a/client/src/components/atoms/Account.tsx b/client/src/components/atoms/Account.tsx
index 47006d6..e83414f 100644
--- a/client/src/components/atoms/Account.tsx
+++ b/client/src/components/atoms/Account.tsx
@@ -3,13 +3,22 @@ import Dotdotdot from 'react-dotdotdot'
 import { toDataUrl } from 'ethereum-blockies'
 import styles from './Account.module.scss'
 
-const Account = ({ account }: { account: string }) => {
+const Account = ({
+    account,
+    isBurner
+}: {
+    account: string
+    isBurner: boolean
+}) => {
     const blockies = account && toDataUrl(account)
 
     return account && blockies ? (
         <div className={styles.account}>
             <img className={styles.blockies} src={blockies} alt="Blockies" />
             <Dotdotdot clamp={2}>{account}</Dotdotdot>
+            {isBurner && (
+                <span className={styles.accountType}>Burner Wallet</span>
+            )}
         </div>
     ) : (
         <em>No account selected</em>
diff --git a/client/src/components/molecules/AccountStatus/Popover.module.scss b/client/src/components/molecules/AccountStatus/Popover.module.scss
index 5972204..7abcdce 100644
--- a/client/src/components/molecules/AccountStatus/Popover.module.scss
+++ b/client/src/components/molecules/AccountStatus/Popover.module.scss
@@ -50,6 +50,10 @@ $popoverWidth: 18rem;
     margin-left: $spacer / 2;
     white-space: nowrap;
 
+    strong {
+        color: $brand-grey-lighter;
+    }
+
     &:first-child {
         margin-left: 0;
     }
diff --git a/client/src/components/molecules/AccountStatus/Popover.tsx b/client/src/components/molecules/AccountStatus/Popover.tsx
index b7cdb81..d5590f0 100644
--- a/client/src/components/molecules/AccountStatus/Popover.tsx
+++ b/client/src/components/molecules/AccountStatus/Popover.tsx
@@ -4,11 +4,17 @@ import { User } from '../../../context'
 import styles from './Popover.module.scss'
 
 export default class Popover extends PureComponent<{
-    forwardedRef: (ref: HTMLElement | null) => void
-    style: React.CSSProperties
+    forwardedRef?: (ref: HTMLElement | null) => void
+    style?: React.CSSProperties
 }> {
     public render() {
-        const { account, balance, network, isOceanNetwork } = this.context
+        const {
+            account,
+            balance,
+            network,
+            isOceanNetwork,
+            isBurner
+        } = this.context
 
         return (
             <div
@@ -19,7 +25,7 @@ export default class Popover extends PureComponent<{
                 {
                     <>
                         <div className={styles.popoverInfoline}>
-                            <Account account={account} />
+                            <Account account={account} isBurner={isBurner} />
                         </div>
 
                         {account && balance && (
diff --git a/client/src/components/molecules/VersionNumbers/index.module.scss b/client/src/components/molecules/VersionNumbers/index.module.scss
index ec09158..f242088 100644
--- a/client/src/components/molecules/VersionNumbers/index.module.scss
+++ b/client/src/components/molecules/VersionNumbers/index.module.scss
@@ -1,12 +1,9 @@
 @import '../../../styles/variables';
 
-.versions {
-    margin-top: $spacer * 2;
-}
-
 .versionsTitle {
     font-size: $font-size-large;
     margin-bottom: $spacer / 2;
+    margin-top: $spacer * 2;
 }
 
 .versionsMinimal {
diff --git a/client/src/components/molecules/VersionNumbers/index.tsx b/client/src/components/molecules/VersionNumbers/index.tsx
index b446619..aadf29c 100644
--- a/client/src/components/molecules/VersionNumbers/index.tsx
+++ b/client/src/components/molecules/VersionNumbers/index.tsx
@@ -149,13 +149,13 @@ export default class VersionNumbers extends PureComponent<
         return minimal ? (
             <this.MinimalOutput />
         ) : (
-            <div className={styles.versions} id="#oceanversions">
-                <h2 className={styles.versionsTitle}>
+            <>
+                <h2 className={styles.versionsTitle} id="#oceanversions">
                     Ocean Components Status
                 </h2>
                 <VersionStatus status={this.state.status} />
                 <VersionTable data={this.state} />
-            </div>
+            </>
         )
     }
 }
diff --git a/client/src/components/organisms/Header.tsx b/client/src/components/organisms/Header.tsx
index b4fa5e1..b5d43fc 100644
--- a/client/src/components/organisms/Header.tsx
+++ b/client/src/components/organisms/Header.tsx
@@ -2,7 +2,6 @@ import React, { PureComponent } from 'react'
 import { NavLink } from 'react-router-dom'
 import { ReactComponent as Logo } from '@oceanprotocol/art/logo/logo.svg'
 import AccountStatus from '../molecules/AccountStatus'
-import WalletSelector from './WalletSelector'
 import styles from './Header.module.scss'
 
 import menu from '../../data/menu.json'
@@ -33,7 +32,6 @@ export default class Header extends PureComponent {
                         {menu.map(item => (
                             <MenuItem key={item.title} item={item} />
                         ))}
-                        <WalletSelector />
                         <AccountStatus className={styles.accountStatus} />
                     </nav>
                 </div>
diff --git a/client/src/components/organisms/WalletSelector.module.scss b/client/src/components/organisms/WalletSelector.module.scss
index d79ea81..855649f 100644
--- a/client/src/components/organisms/WalletSelector.module.scss
+++ b/client/src/components/organisms/WalletSelector.module.scss
@@ -1,13 +1,9 @@
 @import '../../styles/variables';
 
-.actions {
-    text-align: right;
-    margin-top: $spacer;
-}
-
 .openLink {
     margin: 0;
-    font-size: $font-size-small;
+    margin-top: $spacer / 2;
+    margin-left: $spacer;
 }
 
 .info {
diff --git a/client/src/components/organisms/WalletSelector.tsx b/client/src/components/organisms/WalletSelector.tsx
index b84dea0..1fa251a 100644
--- a/client/src/components/organisms/WalletSelector.tsx
+++ b/client/src/components/organisms/WalletSelector.tsx
@@ -6,10 +6,10 @@ import Button from '../atoms/Button'
 
 export default class WalletSelector extends PureComponent<
     {},
-    {
-        isModalOpen: boolean
-    }
+    { isModalOpen: boolean }
 > {
+    public static contextType = User
+
     public state = {
         isModalOpen: false
     }
@@ -25,12 +25,13 @@ export default class WalletSelector extends PureComponent<
 
     private loginMetamask = () => {
         this.context.loginMetamask()
+        this.context.logoutBurnerWallet()
         this.toggleModal()
     }
 
     public render() {
         return (
-            <div className={styles.actions}>
+            <>
                 <Button
                     link
                     className={styles.openLink}
@@ -53,9 +54,7 @@ export default class WalletSelector extends PureComponent<
                         </button>
                     </div>
                 </Modal>
-            </div>
+            </>
         )
     }
 }
-
-WalletSelector.contextType = User
diff --git a/client/src/components/organisms/Web3message.module.scss b/client/src/components/organisms/Web3message.module.scss
index 5a86272..4988335 100644
--- a/client/src/components/organisms/Web3message.module.scss
+++ b/client/src/components/organisms/Web3message.module.scss
@@ -11,12 +11,14 @@
     text-align: left;
 }
 
-.warnings {
-    padding-left: $spacer;
+.text {
+    margin-left: $spacer;
+    display: inline-block;
 }
 
 .status {
-    margin-left: -($spacer);
-    margin-right: $spacer / 2;
+    position: absolute;
+    left: 0;
+    top: $spacer / 1.5;
     padding: 0;
 }
diff --git a/client/src/components/organisms/Web3message.tsx b/client/src/components/organisms/Web3message.tsx
index 67421a2..8fce377 100644
--- a/client/src/components/organisms/Web3message.tsx
+++ b/client/src/components/organisms/Web3message.tsx
@@ -7,33 +7,39 @@ import WalletSelector from './WalletSelector'
 import content from '../../data/web3message.json'
 
 export default class Web3message extends PureComponent {
-    private message = (message: string, account?: string) => (
-        <div className={styles.message}>
-            {account ? (
-                <Account account={account} />
-            ) : (
-                <div className={styles.warnings}>
-                    <AccountStatus className={styles.status} />
-                    <span dangerouslySetInnerHTML={{ __html: message }} />{' '}
-                    <WalletSelector />
-                </div>
-            )}
-        </div>
-    )
+    public static contextType = User
+
+    private message = () => {
+        const { isOceanNetwork, isLogged, isBurner } = this.context
+
+        return !isOceanNetwork && !isBurner
+            ? content.wrongNetwork
+            : !isLogged
+            ? content.noAccount
+            : isBurner
+            ? content.hasBurnerWallet
+            : isLogged
+            ? content.hasMetaMaskWallet
+            : ''
+    }
 
     public render() {
-        const { isOceanNetwork, isLogged, isBurner, account } = this.context
-
-        return !isOceanNetwork
-            ? this.message(content.wrongNetwork)
-            : !isLogged
-            ? this.message(content.noAccount)
-            : isBurner
-            ? this.message(content.burnerWallet)
-            : isLogged
-            ? this.message(content.hasAccount, account)
-            : null
+        return (
+            <div className={styles.message}>
+                {this.context.account ? (
+                    <Account
+                        account={this.context.account}
+                        isBurner={this.context.isBurner}
+                    />
+                ) : (
+                    <AccountStatus className={styles.status} />
+                )}
+                <em
+                    className={styles.text}
+                    dangerouslySetInnerHTML={{ __html: this.message() }}
+                />{' '}
+                <WalletSelector />
+            </div>
+        )
     }
 }
-
-Web3message.contextType = User
diff --git a/client/src/context/BurnerWalletProvider.ts b/client/src/context/BurnerWalletProvider.ts
index 0859573..f1f0037 100644
--- a/client/src/context/BurnerWalletProvider.ts
+++ b/client/src/context/BurnerWalletProvider.ts
@@ -1,7 +1,7 @@
 import Web3 from 'web3'
 import { nodeUri } from '../config'
-import bip39 from 'bip39'
 import HDWalletProvider from 'truffle-hdwallet-provider'
+const bip39 = require('bip39') // eslint-disable-line @typescript-eslint/no-var-requires
 
 export class BurnerWalletProvider {
     private web3: Web3
diff --git a/client/src/context/UserProvider.tsx b/client/src/context/UserProvider.tsx
index 062bdb4..d66d84d 100644
--- a/client/src/context/UserProvider.tsx
+++ b/client/src/context/UserProvider.tsx
@@ -62,6 +62,7 @@ interface UserProviderState {
     requestFromFaucet(account: string): Promise<FaucetResponse>
     loginMetamask(): Promise<any>
     loginBurnerWallet(): Promise<any>
+    logoutBurnerWallet(): Promise<any>
     message: string
 }
 
@@ -98,6 +99,11 @@ export default class UserProvider extends PureComponent<{}, UserProviderState> {
         )
     }
 
+    private logoutBurnerWallet = async () => {
+        const burnerwalletProvider = new BurnerWalletProvider()
+        await burnerwalletProvider.logout()
+    }
+
     public state = {
         isLogged: false,
         isBurner: false,
@@ -114,6 +120,7 @@ export default class UserProvider extends PureComponent<{}, UserProviderState> {
         requestFromFaucet: () => requestFromFaucet(''),
         loginMetamask: () => this.loginMetamask(),
         loginBurnerWallet: () => this.loginBurnerWallet(),
+        logoutBurnerWallet: () => this.logoutBurnerWallet(),
         message: 'Connecting to Ocean...'
     }
 
diff --git a/client/src/data/web3message.json b/client/src/data/web3message.json
index 59c12f0..edbb663 100644
--- a/client/src/data/web3message.json
+++ b/client/src/data/web3message.json
@@ -1,6 +1,6 @@
 {
   "noAccount": "No wallet selected. For publishing and downloading an asset you need to use one.",
-  "burnerWallet": "You are using temporary burner wallet. Improve your security by migrating to Metamask",
-  "hasAccount": "",
+  "hasBurnerWallet": "<p>We created a temporary burner wallet for you, allowing you to use all Commons functionality without any setup on your side. This wallet will persist in your browser across sessions, but not across different browsers or devices.</p>To personalize your experience and improve your security, <a href='https://docs.oceanprotocol.com/tutorials/metamask-setup/'>migrate to MetaMask</a>.",
+  "hasMetaMaskWallet": "Connected with MetaMask.",
   "wrongNetwork": "Not connected to Pacific network.<br />Please connect in MetaMask with Custom RPC <code>https://pacific.oceanprotocol.com</code>"
 }
diff --git a/client/src/routes/About.tsx b/client/src/routes/About.tsx
index c6ae988..799e617 100644
--- a/client/src/routes/About.tsx
+++ b/client/src/routes/About.tsx
@@ -2,6 +2,8 @@ import React, { Component } from 'react'
 import Route from '../components/templates/Route'
 import Content from '../components/atoms/Content'
 import VersionNumbers from '../components/molecules/VersionNumbers'
+import Web3message from '../components/organisms/Web3message'
+import stylesVersionNumbers from '../components/molecules/VersionNumbers/index.module.scss'
 
 class About extends Component {
     public render() {
@@ -37,6 +39,10 @@ class About extends Component {
                 </Content>
 
                 <Content>
+                    <h2 className={stylesVersionNumbers.versionsTitle}>
+                        Your Web3 Account Status
+                    </h2>
+                    <Web3message />
                     <VersionNumbers />
                 </Content>
             </Route>
diff --git a/client/src/styles/global.scss b/client/src/styles/global.scss
index 7d6e100..f841d04 100644
--- a/client/src/styles/global.scss
+++ b/client/src/styles/global.scss
@@ -140,6 +140,11 @@ em,
     font-style: italic;
 }
 
+small {
+    font-size: $font-size-small;
+    display: inline-block;
+}
+
 abbr[title],
 dfn {
     text-transform: none;