Page MenuHomePhorge

D6637.1768421007.diff
No OneTemporary

Size
2 KB
Referenced Files
None
Subscribers
None

D6637.1768421007.diff

diff --git a/web/account/connected-wallet-info.css b/web/account/connected-wallet-info.css
--- a/web/account/connected-wallet-info.css
+++ b/web/account/connected-wallet-info.css
@@ -6,18 +6,16 @@
padding: 10px 20px;
border-radius: 8px;
background-color: #282537;
- outline: #302b42 solid 1px;
- transition: background-color 0.25s ease, outline-color 0.25s ease,
- box-shadow 0.25s ease;
+ border: #302b42 solid 1px;
+ transition: background-color 0.2s ease, border 0.2s ease, box-shadow 0.2s ease;
}
div.container:hover {
cursor: pointer;
background-color: #302b42;
- outline: #6a20e3 solid 1px;
+ border: #6a20e3 solid 1px;
box-shadow: 2px 4px 20px #6a20e333;
- transition: background-color 0.25s, outline-color 0.25s ease,
- box-shadow 0.25s ease;
+ transition: background-color 0.2s ease, border 0.2s ease, box-shadow 0.2s ease;
}
div.avatar {
@@ -30,6 +28,10 @@
border-radius: 16px;
}
+div.avatar img {
+ border-radius: 18px;
+}
+
div.address p {
font-size: 18px;
}
diff --git a/web/account/connected-wallet-info.react.js b/web/account/connected-wallet-info.react.js
--- a/web/account/connected-wallet-info.react.js
+++ b/web/account/connected-wallet-info.react.js
@@ -2,7 +2,7 @@
import { emojiAvatarForAddress, useAccountModal } from '@rainbow-me/rainbowkit';
import * as React from 'react';
-import { useAccount } from 'wagmi';
+import { useAccount, useEnsAvatar } from 'wagmi';
import { useENSName } from 'lib/hooks/ens-cache.js';
@@ -36,6 +36,18 @@
[emojiAvatar.color],
);
+ const emojiAvatarView = React.useMemo(() => <p>{emojiAvatar.emoji}</p>, [
+ emojiAvatar.emoji,
+ ]);
+
+ const { data: ensAvatarURI } = useEnsAvatar({
+ addressOrName: potentiallyENSName,
+ });
+ const potentiallyENSAvatar = React.useMemo(
+ () => <img src={ensAvatarURI} height="34px" width="34px" />,
+ [ensAvatarURI],
+ );
+
const onClick = React.useCallback(() => {
openAccountModal && openAccountModal();
}, [openAccountModal]);
@@ -43,7 +55,7 @@
return (
<div className={css.container} onClick={onClick} title={potentiallyENSName}>
<div className={css.avatar} style={emojiAvatarStyle}>
- <p>{emojiAvatar.emoji}</p>
+ {ensAvatarURI ? potentiallyENSAvatar : emojiAvatarView}
</div>
<div className={css.address}>
<p>{shortenAddressToFitWidth(potentiallyENSName)}</p>
diff --git a/web/account/log-in-form.css b/web/account/log-in-form.css
--- a/web/account/log-in-form.css
+++ b/web/account/log-in-form.css
@@ -7,7 +7,7 @@
padding: 20px 20px;
border-radius: 16px;
background-color: #191723;
- outline: #282537 solid 1px;
+ border: #282537 solid 1px;
}
div.modal_body h4 {

File Metadata

Mime Type
text/plain
Expires
Wed, Jan 14, 8:03 PM (11 h, 27 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5933717
Default Alt Text
D6637.1768421007.diff (2 KB)

Event Timeline