oceanprotocol/market
1
0
Fork 0
mirror of https://github.com/oceanprotocol/market.git synced 2024-12-02 05:57:29 +01:00
Code Releases Activity

connectkit theming

Browse Source
This commit is contained in:
Matthias Kretschmann 2023-02-09 09:18:34 +00:00
parent 6c84a19570
commit 2a4c69b0e8
Signed by: m
GPG Key ID: 606EEEF3C479A91F
2 changed files with 19 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/@utils/wallet.ts
View File

@ -1,7 +1,7 @@
import { LoggerInstance } from '@oceanprotocol/lib'
import { createClient, erc20ABI } from 'wagmi'
import { mainnet, polygon, bsc, goerli, polygonMumbai } from 'wagmi/chains'
import { ethers } from 'ethers'
import { ethers, Contract } from 'ethers'
import { formatEther } from 'ethers/lib/utils'
import { getDefaultClient } from 'connectkit'
@ -14,6 +14,20 @@ export const wagmiClient = createClient(
})
)
// ConnectKit CSS overrides
// https://docs.family.co/connectkit/theming#theme-variables
export const connectKitTheme = {
'--ck-font-family': 'var(--font-family-base)',
'--ck-border-radius': 'var(--border-radius)',
'--ck-overlay-background': 'var(--background-body-transparent)',
'--ck-body-background': 'var(--background-body)',
'--ck-body-color': 'var(--font-color-text)',
'--ck-primary-button-border-radius': 'var(--border-radius)',
'--ck-primary-button-color': 'var(--font-color-heading)',
'--ck-primary-button-background': 'var(--background-content)',
'--ck-secondary-button-border-radius': 'var(--border-radius)'
}
export function accountTruncate(account: string): string {
if (!account || account === '') return
const middle = account.substring(6, 38)
@ -63,10 +77,10 @@ export async function getTokenBalance(
tokenAddress: string,
web3Provider: ethers.providers.Provider
): Promise<string> {
if (!web3Provider) return
if (!web3Provider || !accountId || !tokenAddress) return
try {
const token = new ethers.Contract(tokenAddress, erc20ABI, web3Provider)
const token = new Contract(tokenAddress, erc20ABI, web3Provider)
const balance = await token.balanceOf(accountId)
const adjustedDecimalsBalance = `${balance}${'0'.repeat(18 - decimals)}`
return formatEther(adjustedDecimalsBalance)

11
src/pages/_app.tsx
View File

@ -12,7 +12,7 @@ import Decimal from 'decimal.js'
import MarketMetadataProvider from '@context/MarketMetadata'
import { WagmiConfig } from 'wagmi'
import { ConnectKitProvider } from 'connectkit'
import { wagmiClient } from '@utils/wallet'
import { connectKitTheme, wagmiClient } from '@utils/wallet'
import Web3LegacyProvider from '@context/Web3Legacy'
function MyApp({ Component, pageProps }: AppProps): ReactElement {
@ -23,14 +23,7 @@ function MyApp({ Component, pageProps }: AppProps): ReactElement {
<WagmiConfig client={wagmiClient}>
<ConnectKitProvider
options={{ initialChainId: 0 }}
customTheme={{
'--ck-font-family': 'var(--font-family-base)',
'--ck-border-radius': 'var(--border-radius)',
'--ck-primary-button-border-radius': 'var(--border-radius)',
'--ck-primary-button-color': 'var(--text-color)',
'--ck-primary-button-background': 'var(--brand-grey-dimmed)',
'--ck-secondary-button-border-radius': 'var(--border-radius)'
}}
customTheme={connectKitTheme}
>
<Web3LegacyProvider>
<MarketMetadataProvider>