Fixed Snackbar not showing and/or behind transactions (#2730)
This commit is contained in:
parent
60c01e8cc3
commit
c50ef499b3
@ -41,3 +41,8 @@
|
|||||||
.uuidline {
|
.uuidline {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.address {
|
||||||
|
white-space: nowrap;
|
||||||
|
font-family: monospace;
|
||||||
|
}
|
||||||
|
@ -19,7 +19,7 @@ import CopyToClipboard from 'react-copy-to-clipboard';
|
|||||||
import IconButton from 'material-ui/IconButton';
|
import IconButton from 'material-ui/IconButton';
|
||||||
import Snackbar from 'material-ui/Snackbar';
|
import Snackbar from 'material-ui/Snackbar';
|
||||||
import CopyIcon from 'material-ui/svg-icons/content/content-copy';
|
import CopyIcon from 'material-ui/svg-icons/content/content-copy';
|
||||||
import { lightWhite, fullWhite, lightBlack } from 'material-ui/styles/colors';
|
import { lightWhite, fullWhite, darkBlack } from 'material-ui/styles/colors';
|
||||||
|
|
||||||
import { Balance, Container, ContainerTitle, IdentityIcon, IdentityName, Tags } from '../../../ui';
|
import { Balance, Container, ContainerTitle, IdentityIcon, IdentityName, Tags } from '../../../ui';
|
||||||
|
|
||||||
@ -63,58 +63,68 @@ export default class Header extends Component {
|
|||||||
: <div className={ styles.uuidline }>uuid: { uuid }</div>;
|
: <div className={ styles.uuidline }>uuid: { uuid }</div>;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Container>
|
<div>
|
||||||
<IdentityIcon
|
|
||||||
address={ address } />
|
<Snackbar
|
||||||
<div className={ styles.floatleft }>
|
open={ addressCopied }
|
||||||
<ContainerTitle title={ <IdentityName address={ address } unknown /> } />
|
message={
|
||||||
<div className={ styles.addressline }>
|
<span>
|
||||||
<Snackbar
|
Address
|
||||||
open={ addressCopied }
|
<span className={ styles.address }> { address } </span>
|
||||||
message={ `Address ${address} copied to clipboard` }
|
copied to clipboard
|
||||||
autoHideDuration={ 4000 }
|
</span>
|
||||||
onRequestClose={ this.handleCopyAddressClose }
|
}
|
||||||
bodyStyle={ {
|
autoHideDuration={ 4000 }
|
||||||
backgroundColor: lightBlack
|
onRequestClose={ this.handleCopyAddressClose }
|
||||||
} }
|
bodyStyle={ {
|
||||||
/>
|
backgroundColor: darkBlack
|
||||||
<CopyToClipboard
|
} }
|
||||||
onCopy={ this.handleCopyAddress }
|
/>
|
||||||
text={ address } >
|
|
||||||
<IconButton
|
<Container>
|
||||||
tooltip='Copy address to clipboard'
|
<IdentityIcon
|
||||||
tooltipPosition='top-center'
|
address={ address } />
|
||||||
style={ {
|
<div className={ styles.floatleft }>
|
||||||
width: 32,
|
<ContainerTitle title={ <IdentityName address={ address } unknown /> } />
|
||||||
height: 16,
|
<div className={ styles.addressline }>
|
||||||
padding: 0
|
<CopyToClipboard
|
||||||
} }
|
onCopy={ this.handleCopyAddress }
|
||||||
iconStyle={ {
|
text={ address } >
|
||||||
width: 16,
|
<IconButton
|
||||||
height: 16
|
tooltip='Copy address to clipboard'
|
||||||
} }>
|
tooltipPosition='top-center'
|
||||||
<CopyIcon
|
style={ {
|
||||||
color={ addressCopied ? lightWhite : fullWhite }
|
width: 32,
|
||||||
/>
|
height: 16,
|
||||||
</IconButton>
|
padding: 0
|
||||||
</CopyToClipboard>
|
} }
|
||||||
{ address }
|
iconStyle={ {
|
||||||
|
width: 16,
|
||||||
|
height: 16
|
||||||
|
} }>
|
||||||
|
<CopyIcon
|
||||||
|
color={ addressCopied ? lightWhite : fullWhite }
|
||||||
|
/>
|
||||||
|
</IconButton>
|
||||||
|
</CopyToClipboard>
|
||||||
|
{ address }
|
||||||
|
</div>
|
||||||
|
{ uuidText }
|
||||||
|
<div className={ styles.infoline }>
|
||||||
|
{ meta.description }
|
||||||
|
</div>
|
||||||
|
{ this.renderTxCount() }
|
||||||
</div>
|
</div>
|
||||||
{ uuidText }
|
<div className={ styles.tags }>
|
||||||
<div className={ styles.infoline }>
|
<Tags tags={ meta.tags } />
|
||||||
{ meta.description }
|
|
||||||
</div>
|
</div>
|
||||||
{ this.renderTxCount() }
|
<div className={ styles.balances }>
|
||||||
</div>
|
<Balance
|
||||||
<div className={ styles.tags }>
|
account={ account }
|
||||||
<Tags tags={ meta.tags } />
|
balance={ balance } />
|
||||||
</div>
|
</div>
|
||||||
<div className={ styles.balances }>
|
</Container>
|
||||||
<Balance
|
</div>
|
||||||
account={ account }
|
|
||||||
balance={ balance } />
|
|
||||||
</div>
|
|
||||||
</Container>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user