From f544dabcf3e31906169562d0271a9a25df915def Mon Sep 17 00:00:00 2001 From: Ross Bulat Date: Sat, 2 Nov 2024 17:25:11 +0700 Subject: [PATCH 1/4] use inline block & transform --- package.json | 2 +- src/canvas/JoinPool/Header.tsx | 13 ++++---- .../JoinPool/Overview/AddressSection.tsx | 4 +-- src/canvas/JoinPool/Wrappers.ts | 2 ++ .../PoolMembers/Prompts/UnbondMember.tsx | 6 ++-- .../PoolMembers/Prompts/WithdrawMember.tsx | 6 ++-- src/library/Account/DefaultAccount.tsx | 4 +-- src/library/Account/PoolAccount.tsx | 4 +-- src/library/AccountInput/Wrapper.ts | 2 ++ src/library/AccountInput/index.tsx | 4 ++- .../Hardware/HardwareAddress/Wrapper.ts | 2 ++ src/library/Import/Confirm.tsx | 4 ++- src/library/Import/Remove.tsx | 4 ++- src/library/ListItem/Labels/Identity.tsx | 4 ++- src/library/ListItem/Labels/PoolIdentity.tsx | 4 ++- src/library/PayeeInput/index.tsx | 7 ++--- src/library/Stat/index.tsx | 7 ++--- src/modals/AccountPoolRoles/index.tsx | 2 +- src/modals/Accounts/Account.tsx | 4 +-- src/modals/Accounts/Wrappers.ts | 2 ++ src/modals/ChangePoolRoles/RoleChange.tsx | 10 ++++-- src/modals/Connect/Proxies.tsx | 4 +-- src/modals/Connect/ReadOnly.tsx | 4 +-- src/modals/ImportLedger/Addresses.tsx | 2 +- src/modals/ImportVault/index.tsx | 2 +- src/modals/ImportWalletConnect/index.tsx | 2 +- src/modals/ManagePool/Tasks.tsx | 6 ++-- src/modals/ManagePool/Wrappers.ts | 1 + src/modals/ValidatorGeo/index.tsx | 4 ++- src/modals/ValidatorMetrics/index.tsx | 4 ++- src/pages/Overview/AccountControls/Item.tsx | 9 ++---- .../Overview/AccountControls/Wrappers.ts | 4 +-- src/pages/Pools/PoolAccount/Wrapper.ts | 3 +- src/pages/Pools/PoolAccount/index.tsx | 6 ++-- yarn.lock | 31 ++++++++++++++----- 35 files changed, 108 insertions(+), 71 deletions(-) diff --git a/package.json b/package.json index f4ce70d9c1..a349f15b26 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,7 @@ "@w3ux/hooks": "1.2.1-beta.0", "@w3ux/react-connect-kit": "^1.8.0", "@w3ux/react-odometer": "^1.1.0", - "@w3ux/react-polkicon": "^1.3.0", + "@w3ux/react-polkicon": "2.0.0-alpha.7", "@w3ux/utils": "^1.1.0", "@w3ux/validator-assets": "^0.2.0", "@zondax/ledger-substrate": "^1.0.0", diff --git a/src/canvas/JoinPool/Header.tsx b/src/canvas/JoinPool/Header.tsx index 46c85e021e..fb47bfb6f5 100644 --- a/src/canvas/JoinPool/Header.tsx +++ b/src/canvas/JoinPool/Header.tsx @@ -9,7 +9,7 @@ import { import { ButtonPrimary } from 'kits/Buttons/ButtonPrimary'; import { ButtonPrimaryInvert } from 'kits/Buttons/ButtonPrimaryInvert'; import { Polkicon } from '@w3ux/react-polkicon'; -import { determinePoolDisplay, remToUnit } from '@w3ux/utils'; +import { determinePoolDisplay } from '@w3ux/utils'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { PageTitleTabs } from 'kits/Structure/PageTitleTabs'; import { useTranslation } from 'react-i18next'; @@ -64,11 +64,12 @@ export const Header = ({
- + + +
diff --git a/src/canvas/JoinPool/Overview/AddressSection.tsx b/src/canvas/JoinPool/Overview/AddressSection.tsx index 9a8c4d2df5..fafa33e40b 100644 --- a/src/canvas/JoinPool/Overview/AddressSection.tsx +++ b/src/canvas/JoinPool/Overview/AddressSection.tsx @@ -6,7 +6,7 @@ import { ButtonHelp } from 'kits/Buttons/ButtonHelp'; import { HeadingWrapper } from '../Wrappers'; import { Polkicon } from '@w3ux/react-polkicon'; import { CopyAddress } from 'library/ListItem/Labels/CopyAddress'; -import { ellipsisFn, remToUnit } from '@w3ux/utils'; +import { ellipsisFn } from '@w3ux/utils'; import type { AddressSectionProps } from '../types'; export const AddressSection = ({ @@ -31,8 +31,8 @@ export const AddressSection = ({

diff --git a/src/canvas/JoinPool/Wrappers.ts b/src/canvas/JoinPool/Wrappers.ts index 64fd4dcee4..4dcc985d91 100644 --- a/src/canvas/JoinPool/Wrappers.ts +++ b/src/canvas/JoinPool/Wrappers.ts @@ -267,6 +267,8 @@ export const AddressesWrapper = styled.div` > span { margin-right: 0.75rem; + font-size: 1rem; + padding: 0.5rem; } > h4 { diff --git a/src/canvas/PoolMembers/Prompts/UnbondMember.tsx b/src/canvas/PoolMembers/Prompts/UnbondMember.tsx index 14e779d402..bada696283 100644 --- a/src/canvas/PoolMembers/Prompts/UnbondMember.tsx +++ b/src/canvas/PoolMembers/Prompts/UnbondMember.tsx @@ -2,7 +2,7 @@ // SPDX-License-Identifier: GPL-3.0-only import { Polkicon } from '@w3ux/react-polkicon'; -import { ellipsisFn, remToUnit, rmCommas, unitToPlanck } from '@w3ux/utils'; +import { ellipsisFn, rmCommas, unitToPlanck } from '@w3ux/utils'; import BigNumber from 'bignumber.js'; import { getUnixTime } from 'date-fns'; import { useEffect, useState } from 'react'; @@ -111,8 +111,8 @@ export const UnbondMember = ({ ))} ) : null} -

- +

+   {ellipsisFn(who, 7)}

diff --git a/src/canvas/PoolMembers/Prompts/WithdrawMember.tsx b/src/canvas/PoolMembers/Prompts/WithdrawMember.tsx index e3298435aa..b508a029e5 100644 --- a/src/canvas/PoolMembers/Prompts/WithdrawMember.tsx +++ b/src/canvas/PoolMembers/Prompts/WithdrawMember.tsx @@ -2,7 +2,7 @@ // SPDX-License-Identifier: GPL-3.0-only import { Polkicon } from '@w3ux/react-polkicon'; -import { ellipsisFn, remToUnit, rmCommas } from '@w3ux/utils'; +import { ellipsisFn, rmCommas } from '@w3ux/utils'; import BigNumber from 'bignumber.js'; import type { RefObject } from 'react'; import { useState } from 'react'; @@ -107,8 +107,8 @@ export const WithdrawMember = ({ ) : null} -

- +

+   {ellipsisFn(who, 7)}

diff --git a/src/library/Account/DefaultAccount.tsx b/src/library/Account/DefaultAccount.tsx index c94d3a31a6..54dbef52f5 100644 --- a/src/library/Account/DefaultAccount.tsx +++ b/src/library/Account/DefaultAccount.tsx @@ -3,7 +3,7 @@ import { faGlasses } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { ellipsisFn, remToUnit } from '@w3ux/utils'; +import { ellipsisFn } from '@w3ux/utils'; import { useTranslation } from 'react-i18next'; import { Polkicon } from '@w3ux/react-polkicon'; import { useImportedAccounts } from 'contexts/Connect/ImportedAccounts'; @@ -41,7 +41,7 @@ const DefaultAccount = ({ value, label, readOnly }: AccountProps) => { ) : ( <> - + {text} diff --git a/src/library/Account/PoolAccount.tsx b/src/library/Account/PoolAccount.tsx index 53344cf4b3..cfd8caac61 100644 --- a/src/library/Account/PoolAccount.tsx +++ b/src/library/Account/PoolAccount.tsx @@ -2,7 +2,7 @@ // SPDX-License-Identifier: GPL-3.0-only import { u8aToString, u8aUnwrapBytes } from '@polkadot/util'; -import { ellipsisFn, remToUnit } from '@w3ux/utils'; +import { ellipsisFn } from '@w3ux/utils'; import { useTranslation } from 'react-i18next'; import { useBondedPools } from 'contexts/Pools/BondedPools'; import { Polkicon } from '@w3ux/react-polkicon'; @@ -35,7 +35,7 @@ const PoolAccount = ({ label, pool, syncing }: PoolAccountProps) => { {label !== undefined &&
{label}
} - + {text} diff --git a/src/library/AccountInput/Wrapper.ts b/src/library/AccountInput/Wrapper.ts index cbbb77dd48..813754f3d7 100644 --- a/src/library/AccountInput/Wrapper.ts +++ b/src/library/AccountInput/Wrapper.ts @@ -46,6 +46,7 @@ export const AccountInputWrapper = styled.div` > div { &:first-child { padding-right: 0.5rem; + .ph { background: var(--background-default); width: 22px; @@ -53,6 +54,7 @@ export const AccountInputWrapper = styled.div` border-radius: 50%; } } + &:last-child { display: flex; flex-flow: column wrap; diff --git a/src/library/AccountInput/index.tsx b/src/library/AccountInput/index.tsx index d8fdfeceaa..b6c2b87919 100644 --- a/src/library/AccountInput/index.tsx +++ b/src/library/AccountInput/index.tsx @@ -182,7 +182,9 @@ export const AccountInput = ({
{isValidAddress(value) ? ( - + + + ) : (
)} diff --git a/src/library/Hardware/HardwareAddress/Wrapper.ts b/src/library/Hardware/HardwareAddress/Wrapper.ts index 29cbdfa1bc..d8368abb9f 100644 --- a/src/library/Hardware/HardwareAddress/Wrapper.ts +++ b/src/library/Hardware/HardwareAddress/Wrapper.ts @@ -39,12 +39,14 @@ export const Wrapper = styled.div` flex-shrink: 1; flex-grow: 0; position: relative; + font-size: 2.75rem; .index-icon { background: var(--background-primary); border: 1px solid var(--border-primary-color); color: var(--text-color-secondary); font-family: InterSemiBold, sans-serif; + font-size: 1rem; border-radius: 50%; position: absolute; bottom: -0.25rem; diff --git a/src/library/Import/Confirm.tsx b/src/library/Import/Confirm.tsx index 00795f755c..0de3f13ae9 100644 --- a/src/library/Import/Confirm.tsx +++ b/src/library/Import/Confirm.tsx @@ -31,7 +31,9 @@ export const Confirm = ({ address, index, addHandler }: ConfirmProps) => { return ( - +

+ +

{t('importAccount')}

{address}
diff --git a/src/library/Import/Remove.tsx b/src/library/Import/Remove.tsx index 3480029708..04b24a7ead 100644 --- a/src/library/Import/Remove.tsx +++ b/src/library/Import/Remove.tsx @@ -28,7 +28,9 @@ export const Remove = ({ address, getHandler, removeHandler }: RemoveProps) => { return ( - +

+ +

{t('removeAccount')}

{address}
diff --git a/src/library/ListItem/Labels/Identity.tsx b/src/library/ListItem/Labels/Identity.tsx index d5a4533588..fb88a7642b 100644 --- a/src/library/ListItem/Labels/Identity.tsx +++ b/src/library/ListItem/Labels/Identity.tsx @@ -31,7 +31,9 @@ export const Identity = ({ address }: IdentityProps) => { animate={{ opacity: 1 }} transition={{ duration: 0.3 }} > - + + +
{validatorsFetched && display !== null ? (

{display}

diff --git a/src/library/ListItem/Labels/PoolIdentity.tsx b/src/library/ListItem/Labels/PoolIdentity.tsx index 1b511d9f30..e8e27b3b21 100644 --- a/src/library/ListItem/Labels/PoolIdentity.tsx +++ b/src/library/ListItem/Labels/PoolIdentity.tsx @@ -20,7 +20,9 @@ export const PoolIdentity = ({ return ( - + + +
{!metadataSynced ? (

{ellipsisFn(addresses.stash)}

diff --git a/src/library/PayeeInput/index.tsx b/src/library/PayeeInput/index.tsx index afbacef3d4..49e1803607 100644 --- a/src/library/PayeeInput/index.tsx +++ b/src/library/PayeeInput/index.tsx @@ -104,10 +104,9 @@ export const PayeeInput = ({ {showEmpty ? (
) : ( - + + + )}
- + + +
) : null} {display} diff --git a/src/modals/AccountPoolRoles/index.tsx b/src/modals/AccountPoolRoles/index.tsx index 1cd683ece7..6fffd7fdc0 100644 --- a/src/modals/AccountPoolRoles/index.tsx +++ b/src/modals/AccountPoolRoles/index.tsx @@ -89,7 +89,7 @@ const Button = ({ className="item" >
- +
diff --git a/src/modals/Accounts/Account.tsx b/src/modals/Accounts/Account.tsx index 629c0e36b7..30bb64a8fa 100644 --- a/src/modals/Accounts/Account.tsx +++ b/src/modals/Accounts/Account.tsx @@ -86,11 +86,11 @@ export const AccountButton = ({ > {delegator && (
- +
)}
- +
{delegator && ( diff --git a/src/modals/Accounts/Wrappers.ts b/src/modals/Accounts/Wrappers.ts index 7ac4e45702..b8e1a97397 100644 --- a/src/modals/Accounts/Wrappers.ts +++ b/src/modals/Accounts/Wrappers.ts @@ -96,6 +96,7 @@ export const AccountWrapper = styled.div` } .delegator { width: 1.1rem; + font-size: 1.9rem; z-index: 0; > div { @@ -106,6 +107,7 @@ export const AccountWrapper = styled.div` } .identicon { z-index: 1; + font-size: 1.9rem; } /* svg theming */ diff --git a/src/modals/ChangePoolRoles/RoleChange.tsx b/src/modals/ChangePoolRoles/RoleChange.tsx index 4c1c8acfd0..fdc45dba8c 100644 --- a/src/modals/ChangePoolRoles/RoleChange.tsx +++ b/src/modals/ChangePoolRoles/RoleChange.tsx @@ -3,7 +3,7 @@ import { faAnglesRight } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { ellipsisFn, remToUnit } from '@w3ux/utils'; +import { ellipsisFn } from '@w3ux/utils'; import { Polkicon } from '@w3ux/react-polkicon'; import { RoleChangeWrapper } from './Wrapper'; import type { RoleChangeProps } from './types'; @@ -17,7 +17,9 @@ export const RoleChange = ({
{roleName}
- + + +
- + + + { {delegators.map(({ delegator, proxyType }, j) => (
- - + +

diff --git a/src/modals/Connect/ReadOnly.tsx b/src/modals/Connect/ReadOnly.tsx index f775c94c8c..6c8a321e39 100644 --- a/src/modals/Connect/ReadOnly.tsx +++ b/src/modals/Connect/ReadOnly.tsx @@ -95,8 +95,8 @@ export const ReadOnly = ({ setInputOpen, inputOpen }: ListWithInputProps) => { {externalAccounts.map((a, i) => (
- - + +

{a.address}

diff --git a/src/modals/ImportLedger/Addresses.tsx b/src/modals/ImportLedger/Addresses.tsx index ec13a3d222..8959777d91 100644 --- a/src/modals/ImportLedger/Addresses.tsx +++ b/src/modals/ImportLedger/Addresses.tsx @@ -77,7 +77,7 @@ export const Addresess = ({ addresses, onGetAddress }: AnyJson) => { address={address} index={index} initial={initialName} - Identicon={} + Identicon={} existsHandler={ledgerAccountExists} renameHandler={renameHandler} openRemoveHandler={openRemoveHandler} diff --git a/src/modals/ImportVault/index.tsx b/src/modals/ImportVault/index.tsx index b56383f11d..317cc52e22 100644 --- a/src/modals/ImportVault/index.tsx +++ b/src/modals/ImportVault/index.tsx @@ -98,7 +98,7 @@ export const ImportVault = () => { address={address} index={index} initial={name} - Identicon={} + Identicon={} existsHandler={vaultAccountExists} renameHandler={renameHandler} openRemoveHandler={openRemoveHandler} diff --git a/src/modals/ImportWalletConnect/index.tsx b/src/modals/ImportWalletConnect/index.tsx index d78f9f544a..fb2f78e6ca 100644 --- a/src/modals/ImportWalletConnect/index.tsx +++ b/src/modals/ImportWalletConnect/index.tsx @@ -90,7 +90,7 @@ export const ImportWalletConnect = () => { index={index} initial={name} allowAction={false} - Identicon={} + Identicon={} existsHandler={wcAccountExists} renameHandler={renameHandler} openRemoveHandler={() => { diff --git a/src/modals/ManagePool/Tasks.tsx b/src/modals/ManagePool/Tasks.tsx index 3a6fde3b00..97f8966c1f 100644 --- a/src/modals/ManagePool/Tasks.tsx +++ b/src/modals/ManagePool/Tasks.tsx @@ -12,7 +12,7 @@ import { useActiveAccounts } from 'contexts/ActiveAccounts'; import { ButtonRowWrapper, ContentWrapper } from './Wrappers'; import type { TasksProps } from './types'; import { useApi } from 'contexts/Api'; -import { ellipsisFn, remToUnit } from '@w3ux/utils'; +import { ellipsisFn } from '@w3ux/utils'; import { CopyAddress } from 'library/ListItem/Labels/CopyAddress'; import { ButtonOption } from 'kits/Buttons/ButtonOption'; @@ -47,7 +47,7 @@ export const Tasks = forwardRef(
- +

@@ -61,7 +61,7 @@ export const Tasks = forwardRef(
- +

diff --git a/src/modals/ManagePool/Wrappers.ts b/src/modals/ManagePool/Wrappers.ts index ffc2a5b3e3..3e75119900 100644 --- a/src/modals/ManagePool/Wrappers.ts +++ b/src/modals/ManagePool/Wrappers.ts @@ -141,6 +141,7 @@ export const ButtonRowWrapper = styled.div` > .icon { margin-right: 0.75rem; + font-size: 3rem; } > div > h3 { diff --git a/src/modals/ValidatorGeo/index.tsx b/src/modals/ValidatorGeo/index.tsx index 17877d7685..40740e15ea 100644 --- a/src/modals/ValidatorGeo/index.tsx +++ b/src/modals/ValidatorGeo/index.tsx @@ -74,7 +74,9 @@ export const ValidatorGeo = () => { <> <div className="header"> - <Polkicon address={address} size={33} /> + <span style={{ fontSize: '2.75rem' }}> + <Polkicon address={address} /> + </span> <h2>    {identity === null ? ellipsisFn(address) : identity} diff --git a/src/modals/ValidatorMetrics/index.tsx b/src/modals/ValidatorMetrics/index.tsx index 1b03ca553b..7db896e15d 100644 --- a/src/modals/ValidatorMetrics/index.tsx +++ b/src/modals/ValidatorMetrics/index.tsx @@ -98,7 +98,9 @@ export const ValidatorMetrics = () => { <> <Title title={t('validatorMetrics')} /> <div className="header"> - <Polkicon address={address} size={33} /> + <span style={{ fontSize: '2.75rem' }}> + <Polkicon address={address} /> + </span> <h2>    {identity === null ? ellipsisFn(address) : identity} diff --git a/src/pages/Overview/AccountControls/Item.tsx b/src/pages/Overview/AccountControls/Item.tsx index 8887df6b27..501f3847c4 100644 --- a/src/pages/Overview/AccountControls/Item.tsx +++ b/src/pages/Overview/AccountControls/Item.tsx @@ -4,7 +4,7 @@ import { faCopy } from '@fortawesome/free-regular-svg-icons'; import { faArrowLeft } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { ellipsisFn, remToUnit } from '@w3ux/utils'; +import { ellipsisFn } from '@w3ux/utils'; import { useTranslation } from 'react-i18next'; import type { NotificationText } from 'controllers/Notifications/types'; import { useProxies } from 'contexts/Proxies'; @@ -43,14 +43,11 @@ export const Item = ({ address, delegate = null }: ActiveAccountProps) => { <> {delegatorAddress && ( <div className="delegator"> - <Polkicon - address={delegatorAddress || ''} - size={remToUnit('1.7rem')} - /> + <Polkicon address={delegatorAddress || ''} /> </div> )} <div className="icon"> - <Polkicon address={primaryAddress} size={remToUnit('1.7rem')} /> + <Polkicon address={primaryAddress} /> </div> {delegatorAddress && ( <span> diff --git a/src/pages/Overview/AccountControls/Wrappers.ts b/src/pages/Overview/AccountControls/Wrappers.ts index 3339604a3c..9a15ecd371 100644 --- a/src/pages/Overview/AccountControls/Wrappers.ts +++ b/src/pages/Overview/AccountControls/Wrappers.ts @@ -32,6 +32,7 @@ export const ItemWrapper = styled.div` width: 100%; .delegator { + font-size: 1.7rem; width: 0.75rem; z-index: 0; margin-top: 0.1rem; @@ -43,8 +44,7 @@ export const ItemWrapper = styled.div` } .icon { - position: relative; - top: 0.1rem; + font-size: 1.7rem; margin-right: 0.5rem; z-index: 1; } diff --git a/src/pages/Pools/PoolAccount/Wrapper.ts b/src/pages/Pools/PoolAccount/Wrapper.ts index 42c50e7e2b..2286a56e5a 100644 --- a/src/pages/Pools/PoolAccount/Wrapper.ts +++ b/src/pages/Pools/PoolAccount/Wrapper.ts @@ -22,8 +22,7 @@ export const Wrapper = styled.div` } .icon { - position: relative; - top: 0.1rem; + font-size: 1.7rem; margin-right: 0.5rem; } h4 { diff --git a/src/pages/Pools/PoolAccount/index.tsx b/src/pages/Pools/PoolAccount/index.tsx index ff5219b0d1..db1eb71c1b 100644 --- a/src/pages/Pools/PoolAccount/index.tsx +++ b/src/pages/Pools/PoolAccount/index.tsx @@ -3,7 +3,7 @@ import { faCopy } from '@fortawesome/free-regular-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; -import { ellipsisFn, remToUnit } from '@w3ux/utils'; +import { ellipsisFn } from '@w3ux/utils'; import { motion } from 'framer-motion'; import { useTranslation } from 'react-i18next'; import type { NotificationText } from 'controllers/Notifications/types'; @@ -46,14 +46,14 @@ export const PoolAccount = ({ address, pool }: PoolAccountProps) => { ) : synced && display !== null ? ( <> <div className="icon"> - <Polkicon address={address} size={remToUnit('1.6rem')} /> + <Polkicon address={address} /> </div> <h4>{display}</h4> </> ) : ( <> <div className="icon"> - <Polkicon address={address} size={remToUnit('1.6rem')} /> + <Polkicon address={address} /> </div> <h4>{ellipsisFn(address)}</h4> </> diff --git a/yarn.lock b/yarn.lock index d811dfe589..d94534703e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3664,6 +3664,13 @@ __metadata: languageName: node linkType: hard +"@w3ux/crypto@npm:1.0.0-beta.0": + version: 1.0.0-beta.0 + resolution: "@w3ux/crypto@npm:1.0.0-beta.0" + checksum: 10c0/45d840c523eef7da79a116a439a530bd3cdd5163093a1e486f0265e7b435c327b4472aa74ff89b136cae10ed8a01661cc8e9f0a16ce6bc027a55e4a5b232067a + languageName: node + linkType: hard + "@w3ux/extension-assets@npm:0.4.0, @w3ux/extension-assets@npm:^0.4.0": version: 0.4.0 resolution: "@w3ux/extension-assets@npm:0.4.0" @@ -3722,13 +3729,14 @@ __metadata: languageName: node linkType: hard -"@w3ux/react-polkicon@npm:^1.3.0": - version: 1.3.0 - resolution: "@w3ux/react-polkicon@npm:1.3.0" +"@w3ux/react-polkicon@npm:2.0.0-alpha.7": + version: 2.0.0-alpha.7 + resolution: "@w3ux/react-polkicon@npm:2.0.0-alpha.7" dependencies: - "@w3ux/utils": "npm:^0.9.0" - framer-motion: "npm:^11.2.10" - checksum: 10c0/ebd40b62fcf985013b594c410fb2fa58c750eb7247811788afac48179508445c3167a23da63aa070fcf312ec0077f15ad67f919526f8aa63d1902a28989de342 + "@polkadot-api/substrate-bindings": "npm:^0.9.3" + "@w3ux/crypto": "npm:1.0.0-beta.0" + blakejs: "npm:^1.2.1" + checksum: 10c0/8c7ffc12deb41d80c5c7bc223e8337e08da5b629edf3b9435f5d54d2e380f73cc71475842a6c13ed727e09a802f6102ce4bfa78ed4148c3a7fb2805fe8a62446 languageName: node linkType: hard @@ -4497,6 +4505,13 @@ __metadata: languageName: node linkType: hard +"blakejs@npm:^1.2.1": + version: 1.2.1 + resolution: "blakejs@npm:1.2.1" + checksum: 10c0/c284557ce55b9c70203f59d381f1b85372ef08ee616a90162174d1291a45d3e5e809fdf9edab6e998740012538515152471dc4f1f9dbfa974ba2b9c1f7b9aad7 + languageName: node + linkType: hard + "bn.js@npm:^4.11.9": version: 4.12.0 resolution: "bn.js@npm:4.12.0" @@ -6272,7 +6287,7 @@ __metadata: languageName: node linkType: hard -"framer-motion@npm:^11.11.1, framer-motion@npm:^11.2.10": +"framer-motion@npm:^11.11.1": version: 11.11.11 resolution: "framer-motion@npm:11.11.11" dependencies: @@ -8576,7 +8591,7 @@ __metadata: "@w3ux/hooks": "npm:1.2.1-beta.0" "@w3ux/react-connect-kit": "npm:^1.8.0" "@w3ux/react-odometer": "npm:^1.1.0" - "@w3ux/react-polkicon": "npm:^1.3.0" + "@w3ux/react-polkicon": "npm:2.0.0-alpha.7" "@w3ux/types": "npm:^0.2.0" "@w3ux/utils": "npm:^1.1.0" "@w3ux/validator-assets": "npm:^0.2.0" From 626ae9bb0a7509cbcaf5425ede986766bf22f3f3 Mon Sep 17 00:00:00 2001 From: Ross Bulat <ross@jkrb.io> Date: Sat, 2 Nov 2024 17:29:00 +0700 Subject: [PATCH 2/4] use `background` prop --- package.json | 2 +- src/canvas/JoinPool/Header.tsx | 2 +- src/canvas/JoinPool/Overview/AddressSection.tsx | 2 +- yarn.lock | 10 +++++----- 4 files changed, 8 insertions(+), 8 deletions(-) diff --git a/package.json b/package.json index a349f15b26..8e1fae9338 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,7 @@ "@w3ux/hooks": "1.2.1-beta.0", "@w3ux/react-connect-kit": "^1.8.0", "@w3ux/react-odometer": "^1.1.0", - "@w3ux/react-polkicon": "2.0.0-alpha.7", + "@w3ux/react-polkicon": "2.0.0-beta.1", "@w3ux/utils": "^1.1.0", "@w3ux/validator-assets": "^0.2.0", "@zondax/ledger-substrate": "^1.0.0", diff --git a/src/canvas/JoinPool/Header.tsx b/src/canvas/JoinPool/Header.tsx index fb47bfb6f5..e46d4d38c9 100644 --- a/src/canvas/JoinPool/Header.tsx +++ b/src/canvas/JoinPool/Header.tsx @@ -67,7 +67,7 @@ export const Header = ({ <span style={{ fontSize: '4rem' }}> <Polkicon address={bondedPool?.addresses.stash || ''} - outerColor="transparent" + background="transparent" /> </span> </div> diff --git a/src/canvas/JoinPool/Overview/AddressSection.tsx b/src/canvas/JoinPool/Overview/AddressSection.tsx index fafa33e40b..d2b63882f8 100644 --- a/src/canvas/JoinPool/Overview/AddressSection.tsx +++ b/src/canvas/JoinPool/Overview/AddressSection.tsx @@ -31,7 +31,7 @@ export const AddressSection = ({ <span> <Polkicon address={address} - outerColor="transparent" + background="transparent" transform="grow-10" /> </span> diff --git a/yarn.lock b/yarn.lock index d94534703e..daf08b5622 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3729,14 +3729,14 @@ __metadata: languageName: node linkType: hard -"@w3ux/react-polkicon@npm:2.0.0-alpha.7": - version: 2.0.0-alpha.7 - resolution: "@w3ux/react-polkicon@npm:2.0.0-alpha.7" +"@w3ux/react-polkicon@npm:2.0.0-beta.1": + version: 2.0.0-beta.1 + resolution: "@w3ux/react-polkicon@npm:2.0.0-beta.1" dependencies: "@polkadot-api/substrate-bindings": "npm:^0.9.3" "@w3ux/crypto": "npm:1.0.0-beta.0" blakejs: "npm:^1.2.1" - checksum: 10c0/8c7ffc12deb41d80c5c7bc223e8337e08da5b629edf3b9435f5d54d2e380f73cc71475842a6c13ed727e09a802f6102ce4bfa78ed4148c3a7fb2805fe8a62446 + checksum: 10c0/da6e194deeb3cbe3270642804c588fd8de37ee4d9c4643adaf28a77b4086eb00792aefdfe4d1b881b0f6c6740d90f9c50b1c81c629cab9787981ce754c782cbd languageName: node linkType: hard @@ -8591,7 +8591,7 @@ __metadata: "@w3ux/hooks": "npm:1.2.1-beta.0" "@w3ux/react-connect-kit": "npm:^1.8.0" "@w3ux/react-odometer": "npm:^1.1.0" - "@w3ux/react-polkicon": "npm:2.0.0-alpha.7" + "@w3ux/react-polkicon": "npm:2.0.0-beta.1" "@w3ux/types": "npm:^0.2.0" "@w3ux/utils": "npm:^1.1.0" "@w3ux/validator-assets": "npm:^0.2.0" From 550c9097d726b4e9f3b9918d2df0311b11f0c102 Mon Sep 17 00:00:00 2001 From: Ross Bulat <ross@jkrb.io> Date: Sat, 2 Nov 2024 19:22:35 +0700 Subject: [PATCH 3/4] bumps --- package.json | 6 +++--- yarn.lock | 51 ++++++++++++++++++++++++++------------------------- 2 files changed, 29 insertions(+), 28 deletions(-) diff --git a/package.json b/package.json index 8e1fae9338..a3b00210c2 100644 --- a/package.json +++ b/package.json @@ -28,11 +28,11 @@ "@polkawatch/ddp-client": "^2.0.20", "@substrate/connect": "^1.1.0", "@w3ux/extension-assets": "^0.4.0", - "@w3ux/factories": "1.0.0-beta.0", - "@w3ux/hooks": "1.2.1-beta.0", + "@w3ux/factories": "^1.0.0", + "@w3ux/hooks": "^1.2.1", "@w3ux/react-connect-kit": "^1.8.0", "@w3ux/react-odometer": "^1.1.0", - "@w3ux/react-polkicon": "2.0.0-beta.1", + "@w3ux/react-polkicon": "^2.0.0", "@w3ux/utils": "^1.1.0", "@w3ux/validator-assets": "^0.2.0", "@zondax/ledger-substrate": "^1.0.0", diff --git a/yarn.lock b/yarn.lock index daf08b5622..4208f18cd0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3664,10 +3664,12 @@ __metadata: languageName: node linkType: hard -"@w3ux/crypto@npm:1.0.0-beta.0": - version: 1.0.0-beta.0 - resolution: "@w3ux/crypto@npm:1.0.0-beta.0" - checksum: 10c0/45d840c523eef7da79a116a439a530bd3cdd5163093a1e486f0265e7b435c327b4472aa74ff89b136cae10ed8a01661cc8e9f0a16ce6bc027a55e4a5b232067a +"@w3ux/crypto@npm:1.0.0": + version: 1.0.0 + resolution: "@w3ux/crypto@npm:1.0.0" + dependencies: + blakejs: "npm:^1.2.1" + checksum: 10c0/c32d5ca52496d06a1e57d7dceb739c00cf099221a90998461827be6f685923a7b848f2c3d6b7c85839dcd307b08593a65b411d9e7b8a7ddf579fb8cadc02a00b languageName: node linkType: hard @@ -3680,30 +3682,30 @@ __metadata: languageName: node linkType: hard -"@w3ux/factories@npm:1.0.0-beta.0": - version: 1.0.0-beta.0 - resolution: "@w3ux/factories@npm:1.0.0-beta.0" +"@w3ux/factories@npm:^1.0.0": + version: 1.0.0 + resolution: "@w3ux/factories@npm:1.0.0" peerDependencies: react: ^18 - checksum: 10c0/1c2a8adb966300fe7e36410e4b91381221a70f2470dfa3c1b5612ddc2e84c4579b6928ac7d4c9cad34291b7d8e1cbc97cbba66ae46fd04627042df50e9646b66 + checksum: 10c0/c1c02d40d60fc242cdec74be93f2d24b04f87ea908ef9a523ea3811bc13199d07941b267424b6316c2a4d2f003ad5a65a8aaf9937fe48a6da1dba2f7c36ef8a5 languageName: node linkType: hard -"@w3ux/hooks@npm:1.2.1-beta.0": - version: 1.2.1-beta.0 - resolution: "@w3ux/hooks@npm:1.2.1-beta.0" +"@w3ux/hooks@npm:^1.1.0": + version: 1.2.0 + resolution: "@w3ux/hooks@npm:1.2.0" peerDependencies: react: ^18 - checksum: 10c0/d9abedf6a2508bb7b321d0b5c69c015481122939cc2bc39e44030f3b8a5f99b7d432e0ce38dc273d4614cceb711882fd60b7823836c099aaa895758dc48c7de7 + checksum: 10c0/bd8163cb95a722864274dee3b81f49b64b7f2432ec8d13cb8b91f5757c56d889b02f105d0e65cbfa146b6f3e8817d6649d5dfcd903d5ba4985bb900d44de9dee languageName: node linkType: hard -"@w3ux/hooks@npm:^1.1.0": - version: 1.2.0 - resolution: "@w3ux/hooks@npm:1.2.0" +"@w3ux/hooks@npm:^1.2.1": + version: 1.2.1 + resolution: "@w3ux/hooks@npm:1.2.1" peerDependencies: react: ^18 - checksum: 10c0/bd8163cb95a722864274dee3b81f49b64b7f2432ec8d13cb8b91f5757c56d889b02f105d0e65cbfa146b6f3e8817d6649d5dfcd903d5ba4985bb900d44de9dee + checksum: 10c0/542eae337e26c2202b53625ee7178bcf8fd748aac5b37c8851ef143251a09e37bf8a95916039661dcf76fe31004d3231c87d2dad6237251dc843351282173d72 languageName: node linkType: hard @@ -3729,14 +3731,13 @@ __metadata: languageName: node linkType: hard -"@w3ux/react-polkicon@npm:2.0.0-beta.1": - version: 2.0.0-beta.1 - resolution: "@w3ux/react-polkicon@npm:2.0.0-beta.1" +"@w3ux/react-polkicon@npm:^2.0.0": + version: 2.0.0 + resolution: "@w3ux/react-polkicon@npm:2.0.0" dependencies: "@polkadot-api/substrate-bindings": "npm:^0.9.3" - "@w3ux/crypto": "npm:1.0.0-beta.0" - blakejs: "npm:^1.2.1" - checksum: 10c0/da6e194deeb3cbe3270642804c588fd8de37ee4d9c4643adaf28a77b4086eb00792aefdfe4d1b881b0f6c6740d90f9c50b1c81c629cab9787981ce754c782cbd + "@w3ux/crypto": "npm:1.0.0" + checksum: 10c0/096ca2dedb680410fb19e4ecaebbbfb4ba7f147ae6c9024525d606a2a3e429f69275f81d6de7566b93a41c13a38d6ae55086af3fd239b09c0cd11d3a714a6530 languageName: node linkType: hard @@ -8587,11 +8588,11 @@ __metadata: "@typescript-eslint/parser": "npm:^7.12.0" "@vitejs/plugin-react-swc": "npm:^3.7.0" "@w3ux/extension-assets": "npm:^0.4.0" - "@w3ux/factories": "npm:1.0.0-beta.0" - "@w3ux/hooks": "npm:1.2.1-beta.0" + "@w3ux/factories": "npm:^1.0.0" + "@w3ux/hooks": "npm:^1.2.1" "@w3ux/react-connect-kit": "npm:^1.8.0" "@w3ux/react-odometer": "npm:^1.1.0" - "@w3ux/react-polkicon": "npm:2.0.0-beta.1" + "@w3ux/react-polkicon": "npm:^2.0.0" "@w3ux/types": "npm:^0.2.0" "@w3ux/utils": "npm:^1.1.0" "@w3ux/validator-assets": "npm:^0.2.0" From 9c2d4c402ef9a83d3bb9766fbca65cee90c8467a Mon Sep 17 00:00:00 2001 From: Ross Bulat <ross@jkrb.io> Date: Sun, 3 Nov 2024 09:23:59 +0700 Subject: [PATCH 4/4] use `fontSize` prop --- package.json | 2 +- src/canvas/JoinPool/Header.tsx | 11 +++---- .../JoinPool/Overview/AddressSection.tsx | 12 +++---- src/library/Account/DefaultAccount.tsx | 4 +-- src/library/Account/PoolAccount.tsx | 4 +-- src/library/Account/Wrapper.ts | 2 +- src/library/ListItem/Labels/Identity.tsx | 4 +-- src/library/ListItem/Labels/PoolIdentity.tsx | 4 +-- src/library/PayeeInput/index.tsx | 4 +-- src/library/Stat/Wrapper.ts | 2 +- src/library/Stat/index.tsx | 9 ++--- src/modals/ChangePoolRoles/RoleChange.tsx | 8 ++--- src/modals/Connect/Proxies.tsx | 4 +-- src/modals/Connect/ReadOnly.tsx | 4 +-- src/modals/ValidatorGeo/index.tsx | 4 +-- src/modals/ValidatorMetrics/index.tsx | 4 +-- yarn.lock | 33 +++++++------------ 17 files changed, 42 insertions(+), 73 deletions(-) diff --git a/package.json b/package.json index a3b00210c2..f37a03279d 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,7 @@ "@w3ux/hooks": "^1.2.1", "@w3ux/react-connect-kit": "^1.8.0", "@w3ux/react-odometer": "^1.1.0", - "@w3ux/react-polkicon": "^2.0.0", + "@w3ux/react-polkicon": "2.0.1-alpha.0", "@w3ux/utils": "^1.1.0", "@w3ux/validator-assets": "^0.2.0", "@zondax/ledger-substrate": "^1.0.0", diff --git a/src/canvas/JoinPool/Header.tsx b/src/canvas/JoinPool/Header.tsx index e46d4d38c9..9c90381f2b 100644 --- a/src/canvas/JoinPool/Header.tsx +++ b/src/canvas/JoinPool/Header.tsx @@ -64,12 +64,11 @@ export const Header = ({ <CanvasTitleWrapper> <div className="inner"> <div> - <span style={{ fontSize: '4rem' }}> - <Polkicon - address={bondedPool?.addresses.stash || ''} - background="transparent" - /> - </span> + <Polkicon + address={bondedPool?.addresses.stash || ''} + background="transparent" + fontSize="4rem" + /> </div> <div> <div className="title"> diff --git a/src/canvas/JoinPool/Overview/AddressSection.tsx b/src/canvas/JoinPool/Overview/AddressSection.tsx index d2b63882f8..6edc1bdfcf 100644 --- a/src/canvas/JoinPool/Overview/AddressSection.tsx +++ b/src/canvas/JoinPool/Overview/AddressSection.tsx @@ -28,13 +28,11 @@ export const AddressSection = ({ </HeadingWrapper> <div> - <span> - <Polkicon - address={address} - background="transparent" - transform="grow-10" - /> - </span> + <Polkicon + address={address} + background="transparent" + transform="grow-10" + /> <h4> {ellipsisFn(address, 6)} <CopyAddress address={address} /> diff --git a/src/library/Account/DefaultAccount.tsx b/src/library/Account/DefaultAccount.tsx index 54dbef52f5..6304f6f35f 100644 --- a/src/library/Account/DefaultAccount.tsx +++ b/src/library/Account/DefaultAccount.tsx @@ -40,9 +40,7 @@ const DefaultAccount = ({ value, label, readOnly }: AccountProps) => { <span className="title unassigned">{t('notStaking')}</span> ) : ( <> - <span className="identicon"> - <Polkicon address={value || ''} transform="grow-3" /> - </span> + <Polkicon address={value || ''} transform="grow-3" /> <span className="title">{text}</span> </> )} diff --git a/src/library/Account/PoolAccount.tsx b/src/library/Account/PoolAccount.tsx index cfd8caac61..18d4eb92c8 100644 --- a/src/library/Account/PoolAccount.tsx +++ b/src/library/Account/PoolAccount.tsx @@ -34,9 +34,7 @@ const PoolAccount = ({ label, pool, syncing }: PoolAccountProps) => { return ( <Wrapper> {label !== undefined && <div className="account-label">{label}</div>} - <span className="identicon"> - <Polkicon address={pool.addresses.stash} transform="grow-3" /> - </span> + <Polkicon address={pool.addresses.stash} transform="grow-3" /> <span className={`title${syncing === true ? ` syncing` : ``}`}> {text} </span> diff --git a/src/library/Account/Wrapper.ts b/src/library/Account/Wrapper.ts index ce06172088..c265455151 100644 --- a/src/library/Account/Wrapper.ts +++ b/src/library/Account/Wrapper.ts @@ -20,7 +20,7 @@ export const Wrapper = styled.div` &:hover { transform: scale(1.025); } - .identicon { + .polkicon { margin: 0.15rem 0.25rem 0 0; } .account-label { diff --git a/src/library/ListItem/Labels/Identity.tsx b/src/library/ListItem/Labels/Identity.tsx index fb88a7642b..b74e2bc6b2 100644 --- a/src/library/ListItem/Labels/Identity.tsx +++ b/src/library/ListItem/Labels/Identity.tsx @@ -31,8 +31,8 @@ export const Identity = ({ address }: IdentityProps) => { animate={{ opacity: 1 }} transition={{ duration: 0.3 }} > - <span style={{ paddingRight: '0.25rem', fontSize: '2rem' }}> - <Polkicon address={address} /> + <span style={{ paddingRight: '0.25rem' }}> + <Polkicon address={address} fontSize="2rem" /> </span> <div className="inner"> {validatorsFetched && display !== null ? ( diff --git a/src/library/ListItem/Labels/PoolIdentity.tsx b/src/library/ListItem/Labels/PoolIdentity.tsx index e8e27b3b21..ea50f39f20 100644 --- a/src/library/ListItem/Labels/PoolIdentity.tsx +++ b/src/library/ListItem/Labels/PoolIdentity.tsx @@ -20,9 +20,7 @@ export const PoolIdentity = ({ return ( <IdentityWrapper className="identity"> - <span style={{ fontSize: '2rem' }}> - <Polkicon address={addresses.stash} /> - </span> + <Polkicon address={addresses.stash} fontSize="2rem" /> <div className="inner"> {!metadataSynced ? ( <h4>{ellipsisFn(addresses.stash)}</h4> diff --git a/src/library/PayeeInput/index.tsx b/src/library/PayeeInput/index.tsx index 49e1803607..b95078b018 100644 --- a/src/library/PayeeInput/index.tsx +++ b/src/library/PayeeInput/index.tsx @@ -104,9 +104,7 @@ export const PayeeInput = ({ {showEmpty ? ( <div className="emptyIcon" /> ) : ( - <span style={{ fontSize: '2.5rem' }}> - <Polkicon address={accountDisplay || ''} /> - </span> + <Polkicon address={accountDisplay || ''} fontSize="2.5rem" /> )} <div className="input" ref={showingRef}> <input diff --git a/src/library/Stat/Wrapper.ts b/src/library/Stat/Wrapper.ts index e4bb964c5a..a745a6af6b 100644 --- a/src/library/Stat/Wrapper.ts +++ b/src/library/Stat/Wrapper.ts @@ -68,7 +68,7 @@ export const Wrapper = styled.div<{ $isAddress?: boolean }>` line-height: 1.4rem; } - .identicon { + .icon { position: absolute; display: flex; left: 0; diff --git a/src/library/Stat/index.tsx b/src/library/Stat/index.tsx index dcc7c5deea..472c95f8eb 100644 --- a/src/library/Stat/index.tsx +++ b/src/library/Stat/index.tsx @@ -113,10 +113,11 @@ export const Stat = ({ </> ) : null} {type === 'address' ? ( - <div className="identicon"> - <span style={{ fontSize: '2.4rem' }}> - <Polkicon address={(stat as StatAddress)?.address || ''} /> - </span> + <div className="icon"> + <Polkicon + address={(stat as StatAddress)?.address || ''} + fontSize="2.4rem" + /> </div> ) : null} {display} diff --git a/src/modals/ChangePoolRoles/RoleChange.tsx b/src/modals/ChangePoolRoles/RoleChange.tsx index fdc45dba8c..e3b1864300 100644 --- a/src/modals/ChangePoolRoles/RoleChange.tsx +++ b/src/modals/ChangePoolRoles/RoleChange.tsx @@ -17,9 +17,7 @@ export const RoleChange = ({ <div className="label">{roleName}</div> <div className="role-change"> <div className="input-wrap selected"> - <span style={{ fontSize: '2rem' }}> - <Polkicon address={oldAddress ?? ''} /> - </span> + <Polkicon address={oldAddress ?? ''} fontSize="2rem" /> <input className="input" disabled @@ -30,9 +28,7 @@ export const RoleChange = ({ <FontAwesomeIcon icon={faAnglesRight} /> </span> <div className="input-wrap selected"> - <span style={{ fontSize: '2rem' }}> - <Polkicon address={newAddress ?? ''} /> - </span> + <Polkicon address={newAddress ?? ''} fontSize="2rem" /> <input className="input" disabled diff --git a/src/modals/Connect/Proxies.tsx b/src/modals/Connect/Proxies.tsx index 9214a29847..0e4d3c715b 100644 --- a/src/modals/Connect/Proxies.tsx +++ b/src/modals/Connect/Proxies.tsx @@ -76,9 +76,7 @@ export const Proxies = ({ setInputOpen, inputOpen }: ListWithInputProps) => { {delegators.map(({ delegator, proxyType }, j) => ( <ManualAccount key={`user_delegate_${i}_delegator_${j}`}> <div> - <span style={{ fontSize: '2.4rem' }}> - <Polkicon address={delegate} /> - </span> + <Polkicon address={delegate} fontSize="2.4rem" /> <div className="text"> <h4 className="title"> <span> diff --git a/src/modals/Connect/ReadOnly.tsx b/src/modals/Connect/ReadOnly.tsx index 6c8a321e39..6c6334fdb6 100644 --- a/src/modals/Connect/ReadOnly.tsx +++ b/src/modals/Connect/ReadOnly.tsx @@ -95,9 +95,7 @@ export const ReadOnly = ({ setInputOpen, inputOpen }: ListWithInputProps) => { {externalAccounts.map((a, i) => ( <ManualAccount key={`user_external_account_${i}`}> <div> - <span style={{ fontSize: '1.9rem' }}> - <Polkicon address={a.address} /> - </span> + <Polkicon address={a.address} fontSize="1.9rem" /> <div className="text"> <h4>{a.address}</h4> </div> diff --git a/src/modals/ValidatorGeo/index.tsx b/src/modals/ValidatorGeo/index.tsx index 40740e15ea..ebfdaa1564 100644 --- a/src/modals/ValidatorGeo/index.tsx +++ b/src/modals/ValidatorGeo/index.tsx @@ -74,9 +74,7 @@ export const ValidatorGeo = () => { <> <Title title={t('validatorDecentralization')} /> <div className="header"> - <span style={{ fontSize: '2.75rem' }}> - <Polkicon address={address} /> - </span> + <Polkicon address={address} fontSize="2.75rem" /> <h2>    {identity === null ? ellipsisFn(address) : identity} diff --git a/src/modals/ValidatorMetrics/index.tsx b/src/modals/ValidatorMetrics/index.tsx index 7db896e15d..1cceab140a 100644 --- a/src/modals/ValidatorMetrics/index.tsx +++ b/src/modals/ValidatorMetrics/index.tsx @@ -98,9 +98,7 @@ export const ValidatorMetrics = () => { <> <Title title={t('validatorMetrics')} /> <div className="header"> - <span style={{ fontSize: '2.75rem' }}> - <Polkicon address={address} /> - </span> + <Polkicon address={address} fontSize="2.75rem" /> <h2>    {identity === null ? ellipsisFn(address) : identity} diff --git a/yarn.lock b/yarn.lock index 4208f18cd0..ef7b1e4cf6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3691,16 +3691,7 @@ __metadata: languageName: node linkType: hard -"@w3ux/hooks@npm:^1.1.0": - version: 1.2.0 - resolution: "@w3ux/hooks@npm:1.2.0" - peerDependencies: - react: ^18 - checksum: 10c0/bd8163cb95a722864274dee3b81f49b64b7f2432ec8d13cb8b91f5757c56d889b02f105d0e65cbfa146b6f3e8817d6649d5dfcd903d5ba4985bb900d44de9dee - languageName: node - linkType: hard - -"@w3ux/hooks@npm:^1.2.1": +"@w3ux/hooks@npm:^1.1.0, @w3ux/hooks@npm:^1.2.1": version: 1.2.1 resolution: "@w3ux/hooks@npm:1.2.1" peerDependencies: @@ -3731,13 +3722,13 @@ __metadata: languageName: node linkType: hard -"@w3ux/react-polkicon@npm:^2.0.0": - version: 2.0.0 - resolution: "@w3ux/react-polkicon@npm:2.0.0" +"@w3ux/react-polkicon@npm:2.0.1-alpha.0": + version: 2.0.1-alpha.0 + resolution: "@w3ux/react-polkicon@npm:2.0.1-alpha.0" dependencies: "@polkadot-api/substrate-bindings": "npm:^0.9.3" "@w3ux/crypto": "npm:1.0.0" - checksum: 10c0/096ca2dedb680410fb19e4ecaebbbfb4ba7f147ae6c9024525d606a2a3e429f69275f81d6de7566b93a41c13a38d6ae55086af3fd239b09c0cd11d3a714a6530 + checksum: 10c0/4390646debb6f4f09717806a10ecb811d48e96c32ac7a958944e321a9c4b3330d538b154e7a23891b4808b764bf8525203c26d7075270a3b280504d14cda555e languageName: node linkType: hard @@ -4683,9 +4674,9 @@ __metadata: linkType: hard "caniuse-lite@npm:^1.0.30001669": - version: 1.0.30001676 - resolution: "caniuse-lite@npm:1.0.30001676" - checksum: 10c0/53d310d76b5282947c99638a65d7534ac28a80aae1920de085a616ec8ad603358fad67cebacfc0452b1efdea12cce24fd37a50a712d074986b4962110e87d82b + version: 1.0.30001677 + resolution: "caniuse-lite@npm:1.0.30001677" + checksum: 10c0/22b4aa738b213b5d0bc820c26ba23fa265ca90a5c59776e1a686b9ab6fff9120d0825fd920c0a601a4b65056ef40d01548405feb95c8dd6083255f50c71a0864 languageName: node linkType: hard @@ -8592,7 +8583,7 @@ __metadata: "@w3ux/hooks": "npm:^1.2.1" "@w3ux/react-connect-kit": "npm:^1.8.0" "@w3ux/react-odometer": "npm:^1.1.0" - "@w3ux/react-polkicon": "npm:^2.0.0" + "@w3ux/react-polkicon": "npm:2.0.1-alpha.0" "@w3ux/types": "npm:^0.2.0" "@w3ux/utils": "npm:^1.1.0" "@w3ux/validator-assets": "npm:^0.2.0" @@ -10656,8 +10647,8 @@ __metadata: linkType: hard "viem@npm:^2.1.1, viem@npm:^2.21.35": - version: 2.21.38 - resolution: "viem@npm:2.21.38" + version: 2.21.39 + resolution: "viem@npm:2.21.39" dependencies: "@adraffy/ens-normalize": "npm:1.11.0" "@noble/curves": "npm:1.6.0" @@ -10673,7 +10664,7 @@ __metadata: peerDependenciesMeta: typescript: optional: true - checksum: 10c0/eca1ba239b20b97f06c77d095b93e72bf11331e80d7720325aff07873c228babed3a06dbd7a66a6052cabb8304e9df025dfde75206e2beb763ca5d9a74d43c6f + checksum: 10c0/b9d2f8eadeccd12da8171a159450ee40b9df1ea5c25a8ec17a3542ab5a133db50dcd38558aeeaec1c53a2b5bbec60c71d2e6440933855c7fd07c22fc32e399ed languageName: node linkType: hard