Update change wallet button

common/components/BalanceSidebar/AccountAddress.tsx

@@ -78,11 +78,6 @@ class AccountAddress extends React.Component<Props, State> {
             >
               <Address address={address} />
             </div>
-            {/* {networkId !== 'XMR' && (
-              <div className="AccountInfo-label" title="Edit label">
-                {labelButton}
-              </div>
-            )} */}
           </div>
         </div>
       </div>

common/components/PrimaryButton/PrimaryButton.scss

@@ -34,7 +34,7 @@
       box-shadow: 0 7px 14px rgba(232, 234, 237, 0.5), 0 3px 6px rgba(232, 234, 237, 0.5);
     }
     &:active {
-      transform: translateY(-1px);
+      transform: translateY(1px);
       background-color: darken($brand-primary, 3.5%);
       box-shadow: 0 1px 3px rgba(#32325d, 0.1), 0 1px 1px rgba(#32325d, 0.05),
         0 0 1px rgba(#32325d, 0.03);

common/components/SecondaryButton/SecondaryButton.scss

@@ -21,12 +21,16 @@
       z-index: 2;
       box-shadow: 0 7px 14px rgba(232, 234, 237, 0.5), 0 3px 6px rgba(232, 234, 237, 0.5);
     }
+    &:active {
+      transform: translateY(1px);
+      background-color: darken(white, 3.5%);
+      box-shadow: 0 1px 3px rgba(#32325d, 0.1), 0 1px 1px rgba(#32325d, 0.05),
+        0 0 1px rgba(#32325d, 0.03);
+    }
   }
 
-  &:active {
-    transform: translateY(-1px);
-    background-color: darken(white, 3.5%);
-    box-shadow: 0 1px 3px rgba(#32325d, 0.1), 0 1px 1px rgba(#32325d, 0.05),
-      0 0 1px rgba(#32325d, 0.03);
+  > i {
+    margin-left: 1rem;
+    color: #333;
   }
 }

common/components/SecondaryButton/index.tsx

@@ -7,15 +7,18 @@ interface Props {
   disabled?: boolean;
   text?: string;
   loading?: boolean;
+  children?: any;
   onClick(): void;
 }
 
 export default class SecondaryButton extends React.Component<Props> {
   public render() {
-    const { text, disabled, className, loading, onClick } = this.props;
+    const { text, disabled, className, loading, onClick, children } = this.props;
     return (
       <button className={className + ' SecondaryButton'} disabled={disabled} onClick={onClick}>
         {loading ? <Spinner light={true} /> : text}
+        {/* use 'children' prop for inline icons */}
+        {children}
       </button>
     );
   }

common/components/ui/UnlockHeader.scss

@@ -6,9 +6,9 @@
 
   &-open {
     position: absolute;
-    top: 0;
+    top: -0.5rem;
     right: 0;
-    padding-right: none;
+    padding: 0.5rem 1rem;
 
     &-text {
       padding-right: 8px;
@@ -31,9 +31,5 @@
       height: 26px;
       width: 26px;
     }
-
-    &:hover {
-      opacity: 0.87;
-    }
   }
 }

common/components/ui/UnlockHeader.tsx

@@ -1,10 +1,11 @@
 import React from 'react';
 import { connect } from 'react-redux';
 import { AppState } from 'reducers';
-import translate from 'translations';
+import { translateRaw } from 'translations';
 import WalletDecrypt, { DisabledWallets } from 'components/WalletDecrypt';
 import { IWallet } from 'libs/wallet/IWallet';
 import closeIcon from 'assets/images/close.svg';
+import { SecondaryButton } from 'components';
 import './UnlockHeader.scss';
 
 interface Props {
@@ -38,17 +39,14 @@ export class UnlockHeader extends React.PureComponent<Props, State> {
         {title && <h1 className="UnlockHeader-title">{title}</h1>}
         {wallet &&
           !isExpanded && (
-            <button
-              className="UnlockHeader-open btn btn-default btn-smr"
-              onClick={this.toggleisExpanded}
+            <SecondaryButton
+              text={translateRaw('CHANGE_WALLET')}
+              onClick={this.toggleisExpanded as any}
+              className="UnlockHeader-open btn-smr"
             >
-              <span>
-                <span className="hidden-xs UnlockHeader-open-text">
-                  {translate('CHANGE_WALLET')}
-                </span>
-                <i className="fa fa-refresh" />
-              </span>
-            </button>
+              {/* use 'children' prop for inline icons */}
+              <i className="fa fa-refresh" />
+            </SecondaryButton>
           )}
         {wallet &&
           isExpanded && (

common/containers/Tabs/SendTransaction/index.tsx

@@ -43,7 +43,7 @@ class SendTransaction extends React.Component<Props> {
   public render() {
     const { wallet, match, location, history, network } = this.props;
     const currentPath = match.url;
-    const Tabs: Tab[] = [
+    const ETHtabs: Tab[] = [
       {
         path: 'send',
         name: translate('NAV_SENDETHER'),
@@ -67,6 +67,17 @@ class SendTransaction extends React.Component<Props> {
         name: translate('NAV_ADDRESS_BOOK')
       }
     ];
+    const XMRtabs: Tab[] = [
+      {
+        path: 'send',
+        name: translate('NAV_SENDETHER'),
+        disabled: !!wallet && !!wallet.isReadOnly
+      },
+      {
+        path: 'receive',
+        name: translate('NAV_REQUESTPAYMENT')
+      }
+    ];
 
     return (
       <TabSection>
@@ -75,7 +86,12 @@ class SendTransaction extends React.Component<Props> {
           {wallet && (
             <div className="SubTabs row">
               <div className="col-sm-8">
-                <SubTabs tabs={Tabs} match={match} location={location} history={history} />
+                <SubTabs
+                  tabs={network.id === 'XMR' ? XMRtabs : ETHtabs}
+                  match={match}
+                  location={location}
+                  history={history}
+                />
               </div>
               <div className="col-sm-8">
                 <Switch>
@@ -136,7 +152,6 @@ class SendTransaction extends React.Component<Props> {
 
 const mapStateToProps = (state: AppState): StateProps => ({
   wallet: getWalletInst(state),
-  requestDisabled: !isNetworkUnit(state, 'ETH'),
   network: getNetworkConfig(state)
 });