diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts index 4063b0ea..9a350fdd 100644 --- a/cypress/support/commands.ts +++ b/cypress/support/commands.ts @@ -96,44 +96,29 @@ Cypress.Commands.add('changeNetwork', (network: string = 'Kopernikus') => { }) }) Cypress.Commands.add('accessWallet', (type, keyName, networkName: string = 'kopernikus') => { - //cy.get('header > .MuiToolbar-root > .MuiBox-root:nth-child(2)').as('elPreferenceMenu') - // cy.get('@elPreferenceMenu').find('> .MuiBox-root').as('btnWallet') - // cy.get('@btnWallet').click() - cy.selectWalletApp() cy.wait(5000) - cy.get('h6 + .MuiGrid-container').as('elWalletOptions') - cy.get('@elWalletOptions') - .find('> .MuiGrid-container:nth-child(1) > :nth-child(1)') - .as('elPrivateKeyOption') - cy.get('@elWalletOptions') - .find('> .MuiGrid-container:nth-child(1) > :nth-child(2)') - .as('elMnemonicOption') - switch (type) { - case 'privateKey': - { - cy.get('@elPrivateKeyOption').click() - cy.fixture(`${networkName}/private_key_wallet`).then(privateKeys => { - cy.get('[data-cy="field-private-key"]').type( - privateKeys[keyName || 'privateKey'], - ) - }) - cy.get('button[type="button"]').contains('Access Wallet').click() - } - break - case 'mnemonic': - { - cy.get('@elMnemonicOption').find('> .MuiButtonBase-root').click() - console.log(networkName) - cy.fixture(`${networkName}/mnemonic_wallet`).then(phraseArr => { - const mnemonicStr = phraseArr.join(' ') - cy.get('input.phrase_word').first()?.type(mnemonicStr) - cy.get('button[type="button"]').contains('Access Wallet').click() - }) + cy.get('[data-cy="app-selector-menu"]').click() + cy.get('[data-cy="app-selector-Wallet"]').click() + + if (type === 'mnemonic') { + cy.get('[data-cy="btn-wallet-access-mnemonic"]').click() + cy.readFile(`cypress/temp/wallets/mnemonic_wallet.json`).then(data => { + let phraseArr = data + for (let i = 0; i < phraseArr.length; i++) { + let indexInput = i + 1 + cy.get(`[data-cy="mnemonic-field-${indexInput}"]`).type(phraseArr[i]) } - break - default: - break + cy.get('[data-cy="btn-submit-mnemonic-phrase"]').click({ force: true }) + }) + } + if (type === 'privateKey') { + cy.get('[data-cy="btn-wallet-access-private-key"]', { timeout: 10000 }).click() + cy.readFile('cypress/temp/wallets/private_key_wallet.json').then(privateKey => { + const privateKeyCChain = privateKey.privateKey + cy.get('[data-cy="field-private-key"]', { timeout: 10000 }).type(privateKeyCChain) + }) + cy.get('[data-cy="btn-submit-private-key"]').click() } cy.get('[data-cy="btn-show-breakdown"]', { timeout: 20000 }).should('be.visible') // cy.intercept('GET', '**/api/v1/verified/*').as('apiVerifiedAddress') @@ -217,17 +202,11 @@ Cypress.Commands.add( cy.changeNetwork(network) cy.wait(5000) - cy.get('h6 + .MuiGrid-container').as('elWalletOptions') - cy.get('@elWalletOptions') - .find('> .MuiGrid-container:nth-child(1) > :nth-child(1)') - .as('elPrivateKeyOption') - cy.get('@elWalletOptions') - .find('> .MuiGrid-container:nth-child(1) > :nth-child(2)') - .as('elMnemonicOption') + switch (walletAccessType) { case 'privateKey': { - cy.get('@elPrivateKeyOption').click() + cy.get('[data-cy="btn-wallet-access-private-key"]').click() cy.fixture(`${network.toLowerCase()}/private_key_wallet`).then(privateKeys => { cy.get('[data-cy="field-private-key"]').type( privateKeys[keyName || 'privateKey'], @@ -238,7 +217,7 @@ Cypress.Commands.add( break case 'mnemonic': { - cy.get('@elMnemonicOption').find('> .MuiButtonBase-root').click() + cy.get('[data-cy="btn-wallet-access-mnemonic"]').click() console.log(network) cy.fixture(`${network.toLowerCase()}/mnemonic_wallet`).then(phraseArr => { const mnemonicStr = phraseArr.join(' ') diff --git a/public/fonts/ClashDisplay-200.woff b/public/fonts/ClashDisplay-200.woff deleted file mode 100644 index 50c2b101..00000000 Binary files a/public/fonts/ClashDisplay-200.woff and /dev/null differ diff --git a/public/fonts/ClashDisplay-200.woff2 b/public/fonts/ClashDisplay-200.woff2 deleted file mode 100644 index d4580eb9..00000000 Binary files a/public/fonts/ClashDisplay-200.woff2 and /dev/null differ diff --git a/public/fonts/ClashDisplay-300.woff b/public/fonts/ClashDisplay-300.woff deleted file mode 100644 index 18b89f5d..00000000 Binary files a/public/fonts/ClashDisplay-300.woff and /dev/null differ diff --git a/public/fonts/ClashDisplay-300.woff2 b/public/fonts/ClashDisplay-300.woff2 deleted file mode 100644 index 9e42e53c..00000000 Binary files a/public/fonts/ClashDisplay-300.woff2 and /dev/null differ diff --git a/public/fonts/ClashDisplay-400.woff b/public/fonts/ClashDisplay-400.woff deleted file mode 100644 index fb84ab87..00000000 Binary files a/public/fonts/ClashDisplay-400.woff and /dev/null differ diff --git a/public/fonts/ClashDisplay-400.woff2 b/public/fonts/ClashDisplay-400.woff2 deleted file mode 100644 index 496b0898..00000000 Binary files a/public/fonts/ClashDisplay-400.woff2 and /dev/null differ diff --git a/public/fonts/ClashDisplay-500.woff b/public/fonts/ClashDisplay-500.woff deleted file mode 100644 index a60d904b..00000000 Binary files a/public/fonts/ClashDisplay-500.woff and /dev/null differ diff --git a/public/fonts/ClashDisplay-500.woff2 b/public/fonts/ClashDisplay-500.woff2 deleted file mode 100644 index 2e975d3b..00000000 Binary files a/public/fonts/ClashDisplay-500.woff2 and /dev/null differ diff --git a/public/fonts/ClashDisplay-600.woff b/public/fonts/ClashDisplay-600.woff deleted file mode 100644 index 3b2f19ff..00000000 Binary files a/public/fonts/ClashDisplay-600.woff and /dev/null differ diff --git a/public/fonts/ClashDisplay-600.woff2 b/public/fonts/ClashDisplay-600.woff2 deleted file mode 100644 index 217e88ec..00000000 Binary files a/public/fonts/ClashDisplay-600.woff2 and /dev/null differ diff --git a/public/fonts/ClashDisplay-700.woff b/public/fonts/ClashDisplay-700.woff deleted file mode 100644 index 0bfbe7c1..00000000 Binary files a/public/fonts/ClashDisplay-700.woff and /dev/null differ diff --git a/public/fonts/ClashDisplay-700.woff2 b/public/fonts/ClashDisplay-700.woff2 deleted file mode 100644 index 87f15ca5..00000000 Binary files a/public/fonts/ClashDisplay-700.woff2 and /dev/null differ diff --git a/public/fonts/index.css b/public/fonts/index.css index 32088808..707360a5 100644 --- a/public/fonts/index.css +++ b/public/fonts/index.css @@ -38,53 +38,4 @@ font-style: normal; font-weight: 700; src: url('Inter-700.woff2') format('woff2'), url('Inter-700.woff') format('woff'); -} - -@font-face { - font-family: 'ClashDisplay'; - font-weight: 200; - font-display: swap; - font-style: normal; - src: url('ClashDisplay-200.woff2') format('woff2'), url('ClashDisplay-200.woff') format('woff'); -} - -@font-face { - font-family: 'ClashDisplay'; - font-weight: 300; - font-display: swap; - font-style: normal; - src: url('ClashDisplay-300.woff2') format('woff2'), url('ClashDisplay-300.woff') format('woff'); -} - -@font-face { - font-family: 'ClashDisplay'; - font-weight: 400; - font-display: swap; - font-style: normal; - src: url('ClashDisplay-400.woff2') format('woff2'), url('ClashDisplay-400.woff') format('woff'); -} - -@font-face { - font-family: 'ClashDisplay'; - font-weight: 500; - font-display: swap; - font-style: normal; - src: url('ClashDisplay-500.woff2') format('woff2'), url('ClashDisplay-500.woff') format('woff'); -} - -@font-face { - font-family: 'ClashDisplay'; - font-weight: 600; - font-display: swap; - font-style: normal; - src: url('ClashDisplay-600.woff2') format('woff2'), url('ClashDisplay-600.woff') format('woff'); -} - -@font-face { - font-family: 'ClashDisplay'; - font-weight: 700; - font-display: swap; - font-style: normal; - src: url('ClashDisplay-700.woff2') format('woff2'), url('ClashDisplay-700.woff') format('woff'); -} - +} \ No newline at end of file diff --git a/src/components/Footer/index.tsx b/src/components/Footer/index.tsx index abe2b126..81bf9003 100644 --- a/src/components/Footer/index.tsx +++ b/src/components/Footer/index.tsx @@ -74,7 +74,7 @@ export default function Footer() { diff --git a/src/components/Navbar/LoginButton.tsx b/src/components/Navbar/LoginButton.tsx index 17f6b027..45c3bfd1 100644 --- a/src/components/Navbar/LoginButton.tsx +++ b/src/components/Navbar/LoginButton.tsx @@ -1,16 +1,16 @@ +import { mdiCogOutline, mdiLogout } from '@mdi/js' +import Icon from '@mdi/react' +import { Chip, IconButton, MenuItem, MenuList, Select, Typography, useTheme } from '@mui/material' import React from 'react' -import { useAppDispatch, useAppSelector } from '../../hooks/reduxHooks' -import { MenuItem, MenuList, Select, IconButton, useTheme, Typography, Chip } from '@mui/material' -import store from 'wallet/store' import { useNavigate } from 'react-router-dom' +import store from 'wallet/store' +import { useAppDispatch, useAppSelector } from '../../hooks/reduxHooks' import { + changeActiveApp, getAccount, - updateAuthStatus, updateAccount, - changeActiveApp, + updateAuthStatus, } from '../../redux/slices/app-config' -import { mdiLogout, mdiCogOutline } from '@mdi/js' -import Icon from '@mdi/react' import MHidden from '../@material-extend/MHidden' import { LoadAccountMenu } from '../LoadAccountMenu' import AliasPicker from './AliasPicker' @@ -108,10 +108,9 @@ export default function LoginButton({ handleCloseSidebar }: LoginIconProps) { handleKeyDown(e) }} sx={{ - typography: 'body1', + typography: 'body2', width: '100%', maxWidth: '326px', - display: 'flex', justifyContent: { xs: 'flex-end', sm: 'center' }, }} > @@ -124,7 +123,7 @@ export default function LoginButton({ handleCloseSidebar }: LoginIconProps) { onKeyDown={e => { handleKeyDown(e) }} - sx={{ typography: 'body1', width: '100%', maxWidth: '326px' }} + sx={{ typography: 'body2', width: '100%', maxWidth: '326px' }} > @@ -157,7 +156,7 @@ export default function LoginButton({ handleCloseSidebar }: LoginIconProps) { onKeyDown={e => handleKeyDown(e)} onClick={logout} sx={{ - typography: 'body1', + typography: 'body2', width: '100%', maxWidth: '326px', display: 'flex', diff --git a/src/components/Navbar/NetworkSwitcher.tsx b/src/components/Navbar/NetworkSwitcher.tsx index 9b5d25ba..88cbba07 100644 --- a/src/components/Navbar/NetworkSwitcher.tsx +++ b/src/components/Navbar/NetworkSwitcher.tsx @@ -74,7 +74,7 @@ export default function NetworkSwitcher({ handleCloseSidebar }: NetworkSwitcherP } sx={{ + typography: 'body2', maxWidth: '13rem', '.MuiOutlinedInput-notchedOutline': { border: 'none' }, '.MuiSvgIcon-root': { color: theme.palette.text.primary }, @@ -199,7 +200,7 @@ export default function NetworkSwitcher({ handleCloseSidebar }: NetworkSwitcherP sx={{ gap: '.6rem', justifyContent: 'space-between' }} data-cy={`network-name-${network.name}`} > - + {network.name} {!network.readonly && network.url !== activeNetwork.url && ( @@ -248,7 +249,7 @@ export default function NetworkSwitcher({ handleCloseSidebar }: NetworkSwitcherP ))} Add Custom Network diff --git a/src/components/Navbar/SelectNetwork.tsx b/src/components/Navbar/SelectNetwork.tsx index 2c34a052..3a1daa13 100644 --- a/src/components/Navbar/SelectNetwork.tsx +++ b/src/components/Navbar/SelectNetwork.tsx @@ -41,7 +41,7 @@ export default function SelectedNetwork() { }} /> diff --git a/src/components/Navbar/ThemeSwitcher.tsx b/src/components/Navbar/ThemeSwitcher.tsx index a310d04e..a35929ec 100644 --- a/src/components/Navbar/ThemeSwitcher.tsx +++ b/src/components/Navbar/ThemeSwitcher.tsx @@ -34,7 +34,7 @@ export default function ThemeSwitcher() { '.MuiButton-startIcon': { mr: isDesktop ? '0.5rem' : '0rem' }, }} > - {isDesktop && {theme.palette.mode}} + {isDesktop && {theme.palette.mode}} ) } diff --git a/src/components/Navbar/index.tsx b/src/components/Navbar/index.tsx index b2779189..e7f1ebf5 100644 --- a/src/components/Navbar/index.tsx +++ b/src/components/Navbar/index.tsx @@ -160,7 +160,7 @@ export default function Navbar() { }} > - + Login diff --git a/src/components/PlatformSwitcher.tsx b/src/components/PlatformSwitcher.tsx index f256ffa0..5b7d2f1b 100644 --- a/src/components/PlatformSwitcher.tsx +++ b/src/components/PlatformSwitcher.tsx @@ -1,17 +1,17 @@ -import React from 'react' -import { Box, MenuItem, Select, useTheme, Typography } from '@mui/material' import { mdiChevronRight } from '@mdi/js' -import useWidth from '../hooks/useWidth' import Icon from '@mdi/react' +import { Box, MenuItem, Select, Typography, useTheme } from '@mui/material' +import React from 'react' import { useDispatch } from 'react-redux' +import { useNavigate } from 'react-router-dom' +import { useAppSelector } from '../hooks/reduxHooks' +import useWidth from '../hooks/useWidth' import { changeActiveApp, getActiveApp, getAllApps, getAuthStatus, } from '../redux/slices/app-config' -import { useNavigate } from 'react-router-dom' -import { useAppSelector } from '../hooks/reduxHooks' export default function PlatformSwitcher() { const theme = useTheme() @@ -70,9 +70,9 @@ export default function PlatformSwitcher() { } /> {allApps[activeApp].name} @@ -100,7 +100,7 @@ export default function PlatformSwitcher() { }} > - + {app.subText} diff --git a/src/theme/typography.ts b/src/theme/typography.ts index d4539656..bae12b91 100644 --- a/src/theme/typography.ts +++ b/src/theme/typography.ts @@ -16,98 +16,114 @@ function responsiveFontSizes({ sm, md, lg }: { sm: number; md: number; lg: numbe } } -const FONT_PRIMARY = 'Inter' -const FONT_SECONDARY = 'Inter' +const FONT = 'Inter' const typography = { - fontFamily: FONT_PRIMARY, + fontFamily: FONT, fontWeightLight: 300, fontWeightRegular: 400, fontWeightMedium: 500, fontWeightSemiBold: 600, fontWeightBold: 700, h1: { - fontFamily: FONT_PRIMARY, - fontWeight: 700, - lineHeight: 80 / 64, - fontSize: pxToRem(40), + fontFamily: FONT, + fontStyle: 'normal', + fontSize: pxToRem(64), + lineHeight: '83px', + letterSpacing: '-2.2%', + fontWeight: '700', ...responsiveFontSizes({ sm: 52, md: 58, lg: 64 }), }, h2: { - fontFamily: FONT_PRIMARY, - fontWeight: 700, - lineHeight: 64 / 48, - fontSize: pxToRem(32), + fontFamily: FONT, + fontStyle: 'normal', + fontSize: pxToRem(48), + lineHeight: '62px', + letterSpacing: '-2.2%', + fontWeight: '700', ...responsiveFontSizes({ sm: 40, md: 44, lg: 48 }), }, h3: { - fontFamily: FONT_PRIMARY, - fontWeight: 700, - lineHeight: 1.5, - fontSize: pxToRem(24), + fontFamily: FONT, + fontStyle: 'normal', + fontSize: pxToRem(40), + lineHeight: '52px', + letterSpacing: '-1.1%', + fontWeight: '700', ...responsiveFontSizes({ sm: 26, md: 30, lg: 32 }), }, h4: { - fontFamily: FONT_PRIMARY, - fontWeight: 700, - lineHeight: 1.5, - fontSize: pxToRem(20), + fontFamily: FONT, + fontStyle: 'normal', + fontSize: pxToRem(32), + lineHeight: '42px', + letterSpacing: '-1.1%', + fontWeight: '700', ...responsiveFontSizes({ sm: 20, md: 24, lg: 24 }), }, h5: { - fontFamily: FONT_PRIMARY, - fontWeight: 700, - lineHeight: 1.5, - fontSize: pxToRem(18), + fontFamily: FONT, + fontStyle: 'normal', + fontSize: pxToRem(24), + lineHeight: '36px', + letterSpacing: '-1.1%', + fontWeight: '700', ...responsiveFontSizes({ sm: 19, md: 20, lg: 20 }), }, h6: { - fontFamily: FONT_PRIMARY, - fontWeight: 700, - lineHeight: 28 / 18, - fontSize: pxToRem(17), + fontFamily: FONT, + fontStyle: 'normal', + fontSize: pxToRem(20), + lineHeight: '26px', + letterSpacing: '-1.1%', + fontWeight: '700', ...responsiveFontSizes({ sm: 18, md: 18, lg: 18 }), }, subtitle1: { - fontFamily: FONT_PRIMARY, + fontFamily: FONT, fontWeight: 500, - lineHeight: 1.5, - fontSize: pxToRem(16), + lineHeight: '36px', + letterSpacing: '-2.2%', + fontSize: pxToRem(24), }, subtitle2: { - fontFamily: FONT_PRIMARY, + fontFamily: FONT, fontWeight: 500, - lineHeight: 22 / 14, - fontSize: pxToRem(14), + lineHeight: '30px', + letterSpacing: '-1.1%', + fontSize: pxToRem(20), }, body1: { - fontFamily: FONT_SECONDARY, - lineHeight: 1.5, + fontFamily: FONT, + lineHeight: '28px', + letterSpacing: '-1.1%', fontWeight: 500, - fontSize: pxToRem(16), + fontSize: pxToRem(18), }, body2: { - fontFamily: FONT_SECONDARY, - lineHeight: 22 / 14, + fontFamily: FONT, + lineHeight: '24px', fontWeight: 500, - fontSize: pxToRem(14), + fontSize: pxToRem(16), + letterSpacing: '-1.1%', }, caption: { - fontFamily: FONT_SECONDARY, - lineHeight: 1.5, + fontFamily: FONT, + lineHeight: '20px', fontWeight: 500, - fontSize: pxToRem(12), + fontSize: pxToRem(14), + letterSpacing: '-1.1%', }, overline: { - fontFamily: FONT_SECONDARY, + fontFamily: FONT, fontWeight: 700, - lineHeight: 1.5, + lineHeight: '18px', fontSize: pxToRem(12), - letterSpacing: 1.1, + letterSpacing: '-1.1%', textTransform: 'uppercase', }, button: { - fontFamily: FONT_SECONDARY, + fontFamily: FONT, fontWeight: 700, lineHeight: 24 / 14, fontSize: pxToRem(14), diff --git a/src/views/login/LoginPage.tsx b/src/views/login/LoginPage.tsx index bedaf714..8e8df000 100644 --- a/src/views/login/LoginPage.tsx +++ b/src/views/login/LoginPage.tsx @@ -91,7 +91,7 @@ export default function LoginPage() { {/* Access wallet section */} - Access your Camino Wallets + Access your Camino Wallets @@ -99,7 +99,7 @@ export default function LoginPage() { data-cy="btn-wallet-access-private-key" to="/access/privateKey" > - Private Key + Private Key @@ -108,7 +108,7 @@ export default function LoginPage() { data-cy="btn-wallet-access-mnemonic" to="/access/mnemonic" > - Mnemonic Key Phrase + Mnemonic Key Phrase @@ -116,13 +116,13 @@ export default function LoginPage() { - Keystore File + Keystore File - Ledger + Ledger @@ -131,19 +131,19 @@ export default function LoginPage() { {/* Actions section */} - Don't have a wallet yet ? + Don't have a wallet yet ? - + By using this application, you agree to the