Add '#' on all <a>

packages/fether-react/src/Accounts/AccountsList/AccountsList.js

@@ -4,7 +4,7 @@
 // SPDX-License-Identifier: BSD-3-Clause
 
 import React, { Component } from 'react';
-import { AccountCard, Header } from 'fether-ui';
+import { AccountCard, Clickable, Header } from 'fether-ui';
 import { accountsInfo$, withoutLoading } from '@parity/light.js';
 import { inject, observer } from 'mobx-react';
 import light from '@parity/light.js-react';
@@ -44,9 +44,10 @@ class AccountsList extends Component {
         <Header
           title={<h1>Accounts</h1>}
           right={
-            <a className='icon -new' onClick={this.handleCreateAccount}>
-              New account
-            </a>
+            <Clickable
+              className='icon -new'
+              onClick={this.handleCreateAccount}
+            />
           }
         />
 

packages/fether-react/src/Accounts/AccountsList/Feedback/Feedback.js

@@ -9,6 +9,7 @@ export const Feedback = ({ accountsListLength }) => (
   <a
     className='feedback'
     href='https://github.com/paritytech/fether/issues/new'
+    rel='noopener noreferrer'
     target='_blank'
     style={{ marginBottom: accountsListLength > 1 ? '-2px' : '-10px' }}
   >

packages/fether-react/src/Send/TxForm/TxForm.js

@@ -5,10 +5,10 @@
 
 import React, { Component } from 'react';
 import BigNumber from 'bignumber.js';
+import { Clickable, Form as FetherForm, Header } from 'fether-ui';
 import createDecorator from 'final-form-calculate';
 import debounce from 'debounce-promise';
 import { Field, Form } from 'react-final-form';
-import { Form as FetherForm, Header } from 'fether-ui';
 import { fromWei, toWei } from '@parity/api/lib/util/wei';
 import { inject, observer } from 'mobx-react';
 import { isAddress } from '@parity/api/lib/util/address';
@@ -138,15 +138,15 @@ class Send extends Component {
   showDetailsAnchor = () => {
     return (
       <span className='toggle-details'>
-        <a onClick={this.toggleDetails}>&darr; Details</a>
+        <Clickable onClick={this.toggleDetails}>&darr; Details</Clickable>
       </span>
     );
   };
 
   showHideAnchor = () => {
     return (
       <span className='toggle-details'>
-        <a onClick={this.toggleDetails}>&uarr; Hide</a>
+        <Clickable onClick={this.toggleDetails}>&uarr; Hide</Clickable>
       </span>
     );
   };

packages/fether-react/src/Whitelist/Whitelist.js

@@ -8,6 +8,7 @@ import { chainName$, withoutLoading } from '@parity/light.js';
 import debounce from 'lodash/debounce';
 import { Header } from 'fether-ui';
 import light from '@parity/light.js-react';
+import { Link } from 'react-router-dom';
 
 import Health from '../Health';
 import NewTokenItem from './NewTokenItem';
@@ -103,9 +104,9 @@ class Whitelist extends Component {
       <div>
         <Header
           left={
-            <a to='/tokens' className='icon -back' onClick={history.goBack}>
+            <Link to='/tokens' className='icon -back' onClick={history.goBack}>
               Close
-            </a>
+            </Link>
           }
           title={<h1>Search tokens</h1>}
         />

packages/fether-ui/src/AccountHeader/AccountHeader.js

@@ -7,6 +7,7 @@ import React from 'react';
 import Blockies from 'react-blockies';
 import PropTypes from 'prop-types';
 
+import { Clickable } from '../Clickable';
 import { ClickToCopy } from '../ClickToCopy';
 import { Header } from '../Header';
 
@@ -15,7 +16,7 @@ const NormalContainer = ({ children }) => (
 );
 const CopyContainer = ({ address, children, ...otherProps }) => (
   <ClickToCopy label='Copy address' textToCopy={address} {...otherProps}>
-    <a className='account -header'>{children}</a>
+    <Clickable className='account -header'>{children}</Clickable>
   </ClickToCopy>
 );
 

packages/fether-ui/src/Clickable/Clickable.js

@@ -0,0 +1,14 @@
+// Copyright 2015-2018 Parity Technologies (UK) Ltd.
+// This file is part of Parity.
+//
+// SPDX-License-Identifier: BSD-3-Clause
+
+import React from 'react';
+
+// FIXME Use a button here, which the minimum amount of style to look like
+// an <a>.
+export const Clickable = ({ children, ...otherProps }) => (
+  <a href='#' {...otherProps}>
+    {children}
+  </a>
+);

packages/fether-ui/src/Clickable/index.js

@@ -0,0 +1,6 @@
+// Copyright 2015-2018 Parity Technologies (UK) Ltd.
+// This file is part of Parity.
+//
+// SPDX-License-Identifier: BSD-3-Clause
+
+export * from './Clickable';

packages/fether-ui/src/index.js

@@ -7,6 +7,7 @@ export * from './AccountCard';
 export * from './AccountHeader';
 export * from './AddressShort';
 export * from './Card';
+export * from './Clickable';
 export * from './Form';
 export * from './Header';
 export * from './Placeholder';