1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-22 01:47:00 +01:00

UX Multichain: updated ethereum logo icon (#18528)

* updated ethereum logo icon

* Updating eth logo (#18631)

* Updating eth logo

* Removing border from eth logo identicon

* Removing old eth logo

* updated snapshot and lint errors

* updated eth logo from svg to png

---------

Co-authored-by: George Marshall <george.marshall@consensys.net>
This commit is contained in:
Nidhi Kumari 2023-04-19 20:55:19 +05:30 committed by GitHub
parent 02e8e9c679
commit d362dbfacb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
22 changed files with 26 additions and 50 deletions

View File

@ -4,7 +4,7 @@ export const suggestedAssets = [
address: '0x6b175474e89094c44da98b954eedeac495271d0f',
symbol: 'ETH',
decimals: 18,
image: './images/eth_logo.svg',
image: './images/eth_logo.png',
unlisted: false,
},
},

View File

@ -174,7 +174,7 @@ const state = {
address: '0x6b175474e89094c44da98b954eedeac495271d0f',
symbol: 'ETH',
decimals: 18,
image: './images/eth_logo.svg',
image: './images/eth_logo.png',
unlisted: false,
},
'0xB8c77482e45F1F44dE1745F52C74426C631bDD52': {

BIN
app/images/eth_logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 KiB

View File

@ -1,18 +0,0 @@
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 500 500" style="enable-background:new 0 0 500 500;" xml:space="preserve">
<style type="text/css">
.st0{fill:#343434;}
.st1{fill:#8C8C8C;}
.st2{fill:#3C3C3B;}
.st3{fill:#141414;}
.st4{fill:#393939;}
</style>
<g id="XMLID_1_">
<polygon id="XMLID_2_" class="st0" points="250,67.5 247.5,75.8 247.5,317.2 250,319.6 362,253.4 "/>
<polygon id="XMLID_3_" class="st1" points="250,67.5 137.9,253.4 250,319.6 250,202.5 "/>
<polygon id="XMLID_4_" class="st2" points="250,340.8 248.6,342.5 248.6,428.5 250,432.5 362.1,274.6 "/>
<polygon id="XMLID_5_" class="st1" points="250,432.5 250,340.8 137.9,274.6 "/>
<polygon id="XMLID_6_" class="st3" points="250,319.6 362,253.4 250,202.5 "/>
<polygon id="XMLID_7_" class="st4" points="137.9,253.4 250,319.6 250,202.5 "/>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 919 B

View File

@ -221,7 +221,7 @@ export const CURRENCY_SYMBOLS = {
OPTIMISM: 'OP',
} as const;
export const ETH_TOKEN_IMAGE_URL = './images/eth_logo.svg';
export const ETH_TOKEN_IMAGE_URL = './images/eth_logo.png';
export const TEST_ETH_TOKEN_IMAGE_URL = './images/black-eth-logo.svg';
export const BNB_TOKEN_IMAGE_URL = './images/bnb.png';
export const MATIC_TOKEN_IMAGE_URL = './images/matic-token.png';

View File

@ -35,7 +35,6 @@ const AssetListItem = ({
warning,
primary,
secondary,
identiconBorder,
isERC721,
}) => {
const t = useI18nContext();
@ -137,7 +136,6 @@ const AssetListItem = ({
address={tokenAddress}
image={tokenImage}
alt={`${primary} ${tokenSymbol}`}
imageBorder={identiconBorder}
/>
}
midContent={midContent}
@ -170,7 +168,6 @@ AssetListItem.propTypes = {
warning: PropTypes.node,
primary: PropTypes.string,
secondary: PropTypes.string,
identiconBorder: PropTypes.bool,
isERC721: PropTypes.bool,
};

View File

@ -34,9 +34,6 @@ export default {
secondary: {
control: 'text',
},
identiconBorder: {
control: 'boolean',
},
isERC721: {
control: 'boolean',
},
@ -44,7 +41,7 @@ export default {
args: {
tokenAddress: '0x2170ed0880ac9a755fd29b2688956bd959f933f8',
tokenSymbol: 'ETH',
tokenImage: './images/eth_logo.svg',
tokenImage: './images/eth_logo.png',
identiconBorder: true,
},
};

View File

@ -273,7 +273,7 @@ const EthOverview = ({ className }) => {
</>
}
className={className}
icon={<Identicon diameter={32} image={primaryTokenImage} imageBorder />}
icon={<Identicon diameter={32} image={primaryTokenImage} />}
/>
);
};

View File

@ -59,7 +59,7 @@ The `AvatarBase` component can contain images, icons or text
```jsx
import { AvatarBase } from '../../component-library';
<AvatarBase>
<img src="./images/eth_logo.svg" />
<img src="./images/eth_logo.png" />
</AvatarBase>
<AvatarBase>
<img width="100%" src="./images/arbitrum.svg" />

View File

@ -110,7 +110,7 @@ export const Size = (args) => (
export const Children = (args) => (
<Box display={DISPLAY.FLEX} gap={1}>
<AvatarBase {...args}>
<img src="./images/eth_logo.svg" />
<img src="./images/eth_logo.png" />
</AvatarBase>
<AvatarBase {...args}>
<img width="100%" src="./images/arbitrum.svg" />

View File

@ -6,7 +6,7 @@ import { AvatarFavicon, AVATAR_FAVICON_SIZES } from '.';
describe('AvatarFavicon', () => {
const args = {
src: './images/eth_logo.svg',
src: './images/eth_logo.png',
name: 'test',
};

View File

@ -13,7 +13,7 @@ import { AvatarNetwork } from './avatar-network';
describe('AvatarNetwork', () => {
const args = {
name: 'ethereum',
src: './images/eth_logo.svg',
src: './images/eth_logo.png',
showHalo: false,
};

View File

@ -72,7 +72,7 @@ Use the `src` prop to set the image to be rendered of the `AvatarToken`.
```jsx
import { AvatarToken } from '../../component-library';
<AvatarToken src="./images/eth_logo.svg" />
<AvatarToken src="./images/eth_logo.png" />
<AvatarToken src="./images/arbitrum.svg" />
<AvatarToken src="./images/bnb.png" />
<AvatarToken src="https://static.metaswap.codefi.network/api/v1/tokenIcons/1/0x6b175474e89094c44da98b954eedeac495271d0f.png" />
@ -92,7 +92,7 @@ Use the `showHalo` prop to display the component with halo effect. Only works if
```jsx
import { AvatarToken } from '../../component-library';
<AvatarToken src="./images/eth_logo.svg" showHalo />;
<AvatarToken src="./images/eth_logo.png" showHalo />;
```
### Color, Background Color And Border Color

View File

@ -61,7 +61,7 @@ export default {
},
args: {
name: 'eth',
src: './images/eth_logo.svg',
src: './images/eth_logo.png',
size: Size.MD,
showHalo: false,
},
@ -126,7 +126,7 @@ export const SizeStory = (args) => (
<BadgeWrapper
badge={
<AvatarNetwork
src="./images/eth_logo.svg"
src="./images/eth_logo.png"
name="ETH"
size={Size.XS}
borderColor={BackgroundColor.backgroundDefault}
@ -139,7 +139,7 @@ export const SizeStory = (args) => (
<BadgeWrapper
badge={
<AvatarNetwork
src="./images/eth_logo.svg"
src="./images/eth_logo.png"
name="ETH"
size={Size.XS}
borderColor={BackgroundColor.backgroundDefault}
@ -152,7 +152,7 @@ export const SizeStory = (args) => (
<BadgeWrapper
badge={
<AvatarNetwork
src="./images/eth_logo.svg"
src="./images/eth_logo.png"
name="ETH"
size={Size.XS}
borderColor={BackgroundColor.backgroundDefault}
@ -165,7 +165,7 @@ export const SizeStory = (args) => (
<BadgeWrapper
badge={
<AvatarNetwork
src="./images/eth_logo.svg"
src="./images/eth_logo.png"
name="ETH"
size={Size.XS}
borderColor={BackgroundColor.backgroundDefault}
@ -178,7 +178,7 @@ export const SizeStory = (args) => (
<BadgeWrapper
badge={
<AvatarNetwork
src="./images/eth_logo.svg"
src="./images/eth_logo.png"
name="ETH"
size={Size.SM}
borderColor={BackgroundColor.backgroundDefault}
@ -297,7 +297,7 @@ Name.args = {
export const Src = (args) => (
<Box display={DISPLAY.FLEX} gap={1}>
<AvatarToken {...args} src="./images/eth_logo.svg" />
<AvatarToken {...args} src="./images/eth_logo.png" />
<AvatarToken {...args} src="./images/arbitrum.svg" />
<AvatarToken {...args} src="./images/bnb.png" />
<AvatarToken

View File

@ -62,7 +62,7 @@ import {
>
<AvatarToken
name="Eth"
src="./images/eth_logo.svg"
src="./images/eth_logo.png"
borderColor={BorderColor.borderMuted}
/>
</BadgeWrapper>

View File

@ -114,7 +114,7 @@ export const Children: ComponentStory<typeof BadgeWrapper> = () => (
>
<AvatarToken
name="Eth"
src="./images/eth_logo.svg"
src="./images/eth_logo.png"
borderColor={BorderColor.borderMuted}
/>
</BadgeWrapper>

View File

@ -277,7 +277,7 @@ export const StartAccessoryEndAccessory = (args) => {
>
<AvatarToken
name="eth"
src="./images/eth_logo.svg"
src="./images/eth_logo.png"
size={Size.SM}
/>
<Text>ETH</Text>

View File

@ -28,7 +28,7 @@ exports[`MultichainTokenListItem should render correctly 1`] = `
<img
alt="undefined logo"
class="mm-avatar-network__network-image"
src="./images/eth_logo.svg"
src="./images/eth_logo.png"
/>
</div>
</div>

View File

@ -30,7 +30,7 @@ export default {
args: {
secondary: '$9.80 USD',
primary: '88.00687889',
tokenImage: './images/eth_logo.svg',
tokenImage: './images/eth_logo.png',
tokenSymbol: 'ETH',
title: 'Ethereum',
},

View File

@ -40,7 +40,7 @@ WithImage.args = {
addBorder: false,
diameter: 32,
useBlockie: false,
image: './images/eth_logo.svg',
image: './images/eth_logo.png',
alt: 'Ethereum',
imageBorder: true,
};

View File

@ -31,7 +31,7 @@ DefaultStory.storyName = 'Default';
DefaultStory.args = {
name: 'eth',
icon: './images/eth_logo.svg',
icon: './images/eth_logo.png',
size: 24,
};

View File

@ -6,7 +6,7 @@ describe('SiteIcon', () => {
const args = {
size: 32,
name: 'Snap name',
icon: './images/eth_logo.svg',
icon: './images/eth_logo.png',
className: 'classname-test',
fallbackClassName: 'fallback-classname-test',
};