status-im
/
ens-usernames
mirror of https://github.com/status-im/ens-usernames.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

update reserved page for mobile

This commit is contained in:
Barry Gitarts 2018-07-31 14:24:51 -04:00
parent 9df3e60abc
commit c4cf54fd3d
1 changed files with 29 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
app/components/ens/nameLookup.js
View File

@ -18,6 +18,7 @@ import EnsLogo from '../../ui/icons/logos/ens.png';
import { formatPrice } from '../ens/utils'; import { formatPrice } from '../ens/utils';
import CheckCircle from '../../ui/icons/components/baseline_check_circle_outline.png'; import CheckCircle from '../../ui/icons/components/baseline_check_circle_outline.png';
const { getPrice, getExpirationTime } = ENSSubdomainRegistry.methods; const { getPrice, getExpirationTime } = ENSSubdomainRegistry.methods;
import NotInterested from '@material-ui/icons/NotInterested';
const invalidSuffix = '0000000000000000000000000000000000000000' const invalidSuffix = '0000000000000000000000000000000000000000'
const nullAddress = '0x0000000000000000000000000000000000000000' const nullAddress = '0x0000000000000000000000000000000000000000'
@ -59,17 +60,34 @@ class RenderAddresses extends PureComponent {
const isCopied = address => address == copied; const isCopied = address => address == copied;
const renderCopied = address => isCopied(address) && <span style={{ color: theme.positive }}><IconCheck/>Copied!</span>; const renderCopied = address => isCopied(address) && <span style={{ color: theme.positive }}><IconCheck/>Copied!</span>;
return ( return (
<div style={{ display: 'flex', flexDirection: 'column' }}> <Fragment>
<Info.Action title="Click to copy"><b>{formatName(domainName).toUpperCase()}</b>{expirationTime && <i> (Expires {generatePrettyDate(expirationTime)})</i>} Resolves To:</Info.Action> <Hidden mdDown>
{address && <Text style={{ marginTop: '1em' }}>Ethereum Address {renderCopied(address)}</Text>} <div style={{ display: 'flex', flexDirection: 'column' }}>
<CopyToClipboard text={address} onCopy={markCopied}> <Info.Action title="Click to copy"><b>{formatName(domainName).toUpperCase()}</b>{expirationTime && <i> (Expires {generatePrettyDate(expirationTime)})</i>} Resolves To:</Info.Action>
<div style={addressStyle}>{address}</div> {address && <Text style={{ marginTop: '1em' }}>Ethereum Address {renderCopied(address)}</Text>}
</CopyToClipboard> <CopyToClipboard text={address} onCopy={markCopied}>
{validStatusAddress(statusAccount) && <Text style={{ marginTop: '1em' }}>Status Address {renderCopied(statusAccount)}</Text>} <div style={addressStyle}>{address}</div>
{validStatusAddress(statusAccount) && <CopyToClipboard text={statusAccount} onCopy={markCopied}> </CopyToClipboard>
<div style={{ ...addressStyle, color: isCopied ? theme.primary : null }}>{statusAccount}</div> {validStatusAddress(statusAccount) && <Text style={{ marginTop: '1em' }}>Status Address {renderCopied(statusAccount)}</Text>}
</CopyToClipboard>} {validStatusAddress(statusAccount) && <CopyToClipboard text={statusAccount} onCopy={markCopied}>
</div> <div style={{ ...addressStyle, color: isCopied ? theme.primary : null }}>{statusAccount}</div>
</CopyToClipboard>}
</div>
</Hidden>
<Hidden mdUp>
<Info background="#000000" style={{ margin: '0.4em', boxShadow: '0px 6px 10px rgba(0, 0, 0, 0.2)' }}>
<Typography variant="title" style={
{ display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'space-evenly', height: '4em', color: '#ffffff', textAlign: 'center', margin: '10%' }
}>
<NotInterested style={{ marginBottom: '0.5em', fontSize: '2em' }}/>
<b>{formatName(domainName).toUpperCase()}</b>
<div style={{ fontWeight: 300 }}>
{expirationTime && <i>Expires {generatePrettyDate(expirationTime)}</i>}
</div>
</Typography>
</Info>
</Hidden>
</Fragment>
) )
} }
} }