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

Dark mode: add network times icon (#14202)

This commit is contained in:
George Marshall 2022-03-25 07:33:53 -07:00 committed by GitHub
parent e850bcbc4a
commit 853002bc0b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 60 additions and 52 deletions

View File

@ -1,3 +0,0 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.42237 13.347C9.42237 13.5827 9.33819 13.7847 9.16983 13.9531C9.00147 14.1214 8.79944 14.2056 8.56374 14.2056L6.84648 14.2056C6.61078 14.2056 6.40875 14.1214 6.24039 13.9531C6.07203 13.7847 5.98785 13.5827 5.98785 13.347L5.98785 9.63466L2.27554 9.63466C2.03984 9.63466 1.83781 9.55048 1.66945 9.38212C1.50109 9.21377 1.41691 9.01174 1.41691 8.77603L1.41691 7.05877C1.41691 6.82307 1.50109 6.62104 1.66945 6.45268C1.83781 6.28432 2.03984 6.20014 2.27554 6.20014L5.98785 6.20014V2.48783C5.98785 2.25213 6.07203 2.0501 6.24039 1.88174C6.40875 1.71338 6.61078 1.6292 6.84648 1.6292H8.56374C8.79944 1.6292 9.00147 1.71338 9.16983 1.88174C9.33819 2.0501 9.42237 2.25213 9.42237 2.48783L9.42237 6.20014H13.1347C13.3704 6.20014 13.5724 6.28432 13.7408 6.45268C13.9091 6.62104 13.9933 6.82307 13.9933 7.05877V8.77603C13.9933 9.01173 13.9091 9.21377 13.7408 9.38212C13.5724 9.55048 13.3704 9.63466 13.1347 9.63466H9.42237L9.42237 13.347Z" fill="#6A737D"/>
</svg>

Before

Width:  |  Height:  |  Size: 1.0 KiB

View File

@ -80,11 +80,10 @@ const AddNetwork = ({
<Typography variant={TYPOGRAPHY.H7} color={COLORS.TEXT_DEFAULT}> <Typography variant={TYPOGRAPHY.H7} color={COLORS.TEXT_DEFAULT}>
{item.ticker} {item.ticker}
</Typography> </Typography>
<img <i
className="add-network__add-icon" className="fa fa-plus add-network__add-icon"
src="./images/times.svg"
alt={`${t('add')} ${item.ticker}`}
onClick={onAddNetworkClick} onClick={onAddNetworkClick}
title={`${t('add')} ${item.ticker}`}
/> />
</Box> </Box>
))} ))}

View File

@ -1,53 +1,66 @@
import React from 'react'; import React from 'react';
import AddNetwork from '.'; import AddNetwork from '.';
const MATIC_TOKEN_IMAGE_URL = './images/matic-token.png';
const ARBITRUM_IMAGE_URL = './images/arbitrum.svg';
const OPTIMISM_IMAGE_URL = './images/optimism.svg';
export default { export default {
title: 'Components/APP/AddNetwork', title: 'Components/APP/AddNetwork',
id: __filename, id: __filename,
argTypes: {
onBackClick: {
action: 'onBackClick',
},
onAddNetworkClick: {
action: 'onAddNetworkClick',
},
onAddNetworkManuallyClick: {
action: 'onAddNetworkManuallyClick',
},
featuredRPCS: {
control: 'array',
},
},
args: {
featuredRPCS: [
{
chainId: '0x89',
nickname: 'Polygon Mumbai',
rpcUrl:
'https://polygon-mainnet.infura.io/v3/2b6d4a83d89a438eb1b5d036788ab29c',
ticker: 'MATIC',
rpcPrefs: {
blockExplorerUrl: 'https://mumbai.polygonscan.com/',
imageUrl: MATIC_TOKEN_IMAGE_URL,
},
},
{
chainId: '0x99',
nickname: 'Optimism Testnet ',
rpcUrl:
'https://optimism-kovan.infura.io/v3/2b6d4a83d89a438eb1b5d036788ab29c',
ticker: 'KOR',
rpcPrefs: {
blockExplorerUrl: 'https://kovan-optimistic.etherscan.io/',
imageUrl: OPTIMISM_IMAGE_URL,
},
},
{
chainId: '0x66eeb',
nickname: 'Arbitrum Testnet',
rpcUrl:
'https://arbitrum-rinkeby.infura.io/v3/2b6d4a83d89a438eb1b5d036788ab29c',
ticker: 'ARETH',
rpcPrefs: {
blockExplorerUrl: 'https://testnet.arbiscan.io/',
imageUrl: ARBITRUM_IMAGE_URL,
},
},
],
},
}; };
export const DefaultStory = () => { export const DefaultStory = (args) => <AddNetwork {...args} />;
const MATIC_TOKEN_IMAGE_URL = './images/matic-token.png';
const ARBITRUM_IMAGE_URL = './images/arbitrum.svg';
const OPTIMISM_IMAGE_URL = './images/optimism.svg';
const FEATURED_RPCS = [
{
chainId: '0x89',
nickname: 'Polygon Mumbai',
rpcUrl:
'https://polygon-mainnet.infura.io/v3/2b6d4a83d89a438eb1b5d036788ab29c',
ticker: 'MATIC',
rpcPrefs: {
blockExplorerUrl: 'https://mumbai.polygonscan.com/',
imageUrl: MATIC_TOKEN_IMAGE_URL,
},
},
{
chainId: '0x99',
nickname: 'Optimism Testnet ',
rpcUrl:
'https://optimism-kovan.infura.io/v3/2b6d4a83d89a438eb1b5d036788ab29c',
ticker: 'KOR',
rpcPrefs: {
blockExplorerUrl: 'https://kovan-optimistic.etherscan.io/',
imageUrl: OPTIMISM_IMAGE_URL,
},
},
{
chainId: '0x66eeb',
nickname: 'Arbitrum Testnet',
rpcUrl:
'https://arbitrum-rinkeby.infura.io/v3/2b6d4a83d89a438eb1b5d036788ab29c',
ticker: 'ARETH',
rpcPrefs: {
blockExplorerUrl: 'https://testnet.arbiscan.io/',
imageUrl: ARBITRUM_IMAGE_URL,
},
},
];
return <AddNetwork featuredRPCS={FEATURED_RPCS} />;
};
DefaultStory.storyName = 'Default'; DefaultStory.storyName = 'Default';

View File

@ -15,11 +15,10 @@
} }
&__add-icon { &__add-icon {
height: 16px;
width: 12px;
color: var(--color-text-alternative); color: var(--color-text-alternative);
margin-left: auto; margin-left: auto;
margin-right: 0; margin-right: 0;
cursor: pointer;
} }
&__footer { &__footer {