add banner to make it clear current app is mobile optimized

app/components/ens/nameLookup.js

@@ -134,7 +134,7 @@ class RenderAddresses extends PureComponent {
     return (
       <Fragment>
         <Hidden mdDown>
-          <div style={{ display: 'flex', flexDirection: 'column' }}>
+          <div style={{ display: 'flex', flexDirection: 'column', margin: 50 }}>
             <Info.Action title="Click to copy"><b>{formatName(domainName)}</b>{expirationTime && <i> (Expires {generatePrettyDate(expirationTime)})</i>} Resolves To:</Info.Action>
             {address && <Text style={{ marginTop: '1em' }}>Ethereum Address {renderCopied(address)}</Text>}
             <CopyToClipboard text={address} onCopy={markCopied}>

app/components/standard/StatusOptimized.js

@@ -0,0 +1,53 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { withStyles } from '@material-ui/core/styles';
+import AppBar from '@material-ui/core/AppBar';
+import Toolbar from '@material-ui/core/Toolbar';
+import Typography from '@material-ui/core/Typography';
+import IconButton from '@material-ui/core/IconButton';
+import IPhone from '@material-ui/icons/PhoneIphone';
+import Android from '@material-ui/icons/Android';
+
+const styles = {
+  root: {
+    flexGrow: 1,
+    position: 'fixed',
+    top: 0,
+    width: '100%',
+    zIndex: 1,
+  },
+  flex: {
+    flexGrow: 1,
+  },
+  menuButton: {
+    marginLeft: -12,
+    marginRight: 20,
+  },
+};
+
+function ButtonAppBar(props) {
+  const { classes } = props;
+  return (
+    <div className={classes.root}>
+      <AppBar position="static">
+        <Toolbar>
+          <Typography variant="title" color="inherit" className={classes.flex}>
+            This site is optimized for Status. Get the App to enable all features and get the best experience.
+          </Typography>
+          <IconButton color="inherit" aria-label="iPhone" href="https://status.im/success.html" target="_blank">
+            <IPhone />
+          </IconButton>
+          <IconButton color="inherit" aria-label="Android" href="https://test.status.im/" target="_blank">
+            <Android />
+          </IconButton>
+        </Toolbar>
+      </AppBar>
+    </div>
+  );
+}
+
+ButtonAppBar.propTypes = {
+  classes: PropTypes.object.isRequired,
+};
+
+export default withStyles(styles)(ButtonAppBar);

app/dapp.js

@@ -21,6 +21,7 @@ import Welcome from './components/ens/welcome';
 import Fade from '@material-ui/core/Fade';
 import Hidden from '@material-ui/core/Hidden';
 import Web3Render from './components/standard/Web3Render';
+import StatusOptimized from './components/standard/StatusOptimized';
 
 import './dapp.css';
 
@@ -53,6 +54,9 @@ class App extends React.Component {
     return (
       <div>
         <CssBaseline />
+        <Hidden mdDown>
+          <StatusOptimized />
+        </Hidden>
         <div style={{ display: admin ? 'block' : 'none' }} >
           <AdminMode style={{ display: admin ? 'block' : 'none' }}/>
         </div>