mirror of
https://github.com/status-im/MyCrypto.git
synced 2025-01-10 02:55:41 +00:00
9cac0298a2
* Manage modal focus * Add isOpen prop to CustomNodeModal * Remove outline overrides * Update outline style for inputs * Fix modal focus management & Cleanup CustomNodeModal * Add aria-label on modal close button * Fix modal scroll to top * Add aria-live property for notifications * Add aria-busy to Spinner component * Fix border styles for generatewallet password inputs * Update token balances inputs * Remove multiple h1's & Update styles * Add alt text to all img elements * Update swap link from bity to shapeshift * Update aria-labels and alt text * Only show keystore password input when required * Revert "Only show keystore password input when required" This reverts commit 7ec5de52da0982cd3131f365b142f6915638d831. * address changes requested
51 lines
1.3 KiB
TypeScript
51 lines
1.3 KiB
TypeScript
import { toDataUrl } from 'ethereum-blockies';
|
|
import { isValidETHAddress } from 'libs/validators';
|
|
import React from 'react';
|
|
|
|
interface Props {
|
|
address: string;
|
|
className?: string;
|
|
size?: string;
|
|
}
|
|
|
|
export default function Identicon(props: Props) {
|
|
const size = props.size || '4rem';
|
|
const { address, className } = props;
|
|
// FIXME breaks on failed checksums
|
|
const identiconDataUrl = isValidETHAddress(address) ? toDataUrl(address) : '';
|
|
return (
|
|
// Use inline styles for printable wallets
|
|
<div
|
|
className={`Identicon ${className}`}
|
|
title="Address Identicon"
|
|
style={{ width: size, height: size, position: 'relative' }}
|
|
>
|
|
{identiconDataUrl && (
|
|
<React.Fragment>
|
|
<img
|
|
src={identiconDataUrl}
|
|
alt="Unique Address Image"
|
|
style={{
|
|
height: '100%',
|
|
width: '100%',
|
|
padding: '0px',
|
|
borderRadius: '50%'
|
|
}}
|
|
/>
|
|
<div
|
|
className="border"
|
|
style={{
|
|
position: 'absolute',
|
|
height: 'inherit',
|
|
width: 'inherit',
|
|
top: 0,
|
|
boxShadow: '0 3px 8px 0 rgba(0, 0, 0, 0.1), inset 0 0 3px 0 rgba(0, 0, 0, 0.1)',
|
|
borderRadius: '50%'
|
|
}}
|
|
/>
|
|
</React.Fragment>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|