diff --git a/packages/frontend/src/components/common/Footer.js b/packages/frontend/src/components/common/Footer.js index 39243c776d..05c50de8be 100644 --- a/packages/frontend/src/components/common/Footer.js +++ b/packages/frontend/src/components/common/Footer.js @@ -93,6 +93,14 @@ const InnerContainer = styled.div` margin: 0 auto; justify-content: space-between; align-items: center; + + @media(max-width: 1352px) { + padding: 0 64px; + } + + @media(max-width: 991px) { + padding: 0 24px; + } `; const Footer = () => { diff --git a/packages/frontend/src/components/landing/GuestLanding.js b/packages/frontend/src/components/landing/GuestLanding.js index 20cef340aa..7f647ee50d 100644 --- a/packages/frontend/src/components/landing/GuestLanding.js +++ b/packages/frontend/src/components/landing/GuestLanding.js @@ -1,6 +1,5 @@ import React, { useEffect, useState } from 'react'; import { Translate } from 'react-localize-redux'; -import {useSelector} from 'react-redux'; import HereWalletIcon from '../../images/wallet-icons/here-wallet-icon.png'; import MeteorWalletIcon from '../../images/wallet-icons/meteor-wallet-icon.png'; @@ -8,7 +7,6 @@ import NearWalletIcon from '../../images/wallet-icons/near-wallet-icon.png'; import NightlyWalletIcon from '../../images/wallet-icons/nightly-wallet-icon.png'; import SenderWalletIcon from '../../images/wallet-icons/sender-wallet-icon.png'; import WellDoneWalletIcon from '../../images/wallet-icons/welldone-wallet-icon.png'; -import {selectAvailableAccounts} from '../../redux/slices/availableAccounts'; import FormButton from '../common/FormButton'; import { WalletSelectorGetAWallet } from '../common/wallet_selector/WalletSelectorGetAWallet'; import NavigationWrapperV2 from '../navigation/NavigationWrapperV2'; @@ -25,7 +23,6 @@ import { } from './GuestLanding.styles'; export function GuestLanding({ history, accountFound, onTransfer }) { - const availableAccounts = useSelector(selectAvailableAccounts); const [walletSelectorModal, setWalletSelectorModal] = useState(); const [showModal, setShowModal] = useState(); @@ -158,7 +155,7 @@ export function GuestLanding({ history, accountFound, onTransfer }) { - { + { recordWalletMigrationEvent('click', { element: { type: 'link', description: 'MyNearWallet Wallet' }}); }}> near-wallet-icon @@ -193,7 +190,9 @@ export function GuestLanding({ history, accountFound, onTransfer }) {

Nightly Wallet

- + { + recordWalletMigrationEvent('click', { element: { type: 'link', description: 'WELLDONE Wallet' }}); + }}> wellDone-wallet-icon

WELLDONE Wallet

@@ -208,16 +207,7 @@ export function GuestLanding({ history, accountFound, onTransfer }) {

- {availableAccounts.length === 1 ? ( - - ) : ( - - )} +

diff --git a/packages/frontend/src/components/landing/GuestLanding.styles.js b/packages/frontend/src/components/landing/GuestLanding.styles.js index ac6fd70222..036b4dbeda 100644 --- a/packages/frontend/src/components/landing/GuestLanding.styles.js +++ b/packages/frontend/src/components/landing/GuestLanding.styles.js @@ -9,6 +9,14 @@ export const StyledContainer = styled.div` max-width: 1224px; position: relative; + @media (max-width: 1352px) { + padding: 0 64px; + } + + @media (max-width: 991px) { + padding: 0 24px; + } + @media (max-width: 767px) { margin: 0; overflow: hidden; @@ -229,6 +237,13 @@ export const DefaultContainer = styled.div` max-width: 1224px; margin: 0 auto; position: relative; + @media (max-width: 1352px) { + padding: 0 64px; + } + + @media (max-width: 991px) { + padding: 0 24px; + } `; export const FlexBox = styled.div` @@ -300,8 +315,13 @@ export const SecondaryText = styled.p` `; export const FormButtonContainer = styled.div` - min-width: 500px; text-align: right; + min-width: 500px; + + @media(max-width: 1352px) { + min-width: 300px; + } + @media(max-width: 768px) { min-width: 100%; } diff --git a/packages/frontend/src/components/navigation/DesktopContainer.js b/packages/frontend/src/components/navigation/DesktopContainer.js index 841b45ac25..319dc1382f 100644 --- a/packages/frontend/src/components/navigation/DesktopContainer.js +++ b/packages/frontend/src/components/navigation/DesktopContainer.js @@ -12,7 +12,6 @@ const Container = styled.div` color: white; position: relative; font-size: 14px; - padding: 0 15px; @media (min-width: 992px) { display: flex; diff --git a/packages/frontend/src/components/navigation/NavigationV2.js b/packages/frontend/src/components/navigation/NavigationV2.js index b04d15b766..08ee694c31 100644 --- a/packages/frontend/src/components/navigation/NavigationV2.js +++ b/packages/frontend/src/components/navigation/NavigationV2.js @@ -15,9 +15,10 @@ const Container = styled.div` border-bottom: 1px solid #F0F0F1; background-color: #FFFFFF; margin: auto; + padding: 0 64px; + @media (max-width: 991px) { - bottom: ${(props) => props.open ? '0' : 'unset'}; - border: none; + padding: 0 24px; } h6 { diff --git a/packages/frontend/src/translations/en.global.json b/packages/frontend/src/translations/en.global.json index 80df6a7265..fc617716bf 100644 --- a/packages/frontend/src/translations/en.global.json +++ b/packages/frontend/src/translations/en.global.json @@ -673,20 +673,20 @@ }, "landing": { "banner": "NEAR Wallet is in Private Beta", - "desc": "The NEAR wallet has been discontinued. Explore a range of user-friendly wallets designed to meet your needs.", + "desc": "wallet.near.org has been discontinued. Explore a range of user-friendly wallets designed to meet your needs.", "or": "or", "title": "A new era for NEAR wallets", "decentralize": "Decentralization means strength in numbers.", "decentralizeSubtitle": "Signifying the substantial growth of the ecosystem, NEAR now supports a diverse list of high-quality wallets.", - "landingSectionTitle": "What happened to NEAR Wallet?", + "landingSectionTitle": "What happened to wallet.near.org?", "landingSectionSubTitle": "Transfer your accounts with ease.", "landingSectionSubDescription": "To make the transition easier, you can securely migrate your accounts to a new wallet using the Transfer Wizard. Review the transfer-compatible wallet options below or move your accounts manually with your recovery phrase.", - "landingSectionDescription": "As we embrace a more decentralized future, the NEAR Wallet will be discontinued. This change invites you to discover a variety of new and secure wallet options within our ecosystem. Don’t worry, no changes will be made to your account or assets.", + "landingSectionDescription": "As we embrace a more decentralized future, wallet.near.org will be discontinued. This change invites you to discover a variety of new and secure wallet options within our ecosystem. Don’t worry, no changes will be made to your account or assets.", "wallet": { "title": "Find the right wallet for you.", "secondaryDescription": "Check out our diverse list of community-built wallet options.", "description": "You can transfer your accounts to any of the wallets below or manually import them to the wallet of your choice using your recovery phrase.", - "near": "A browser based wallet that offers the same UI and features of the Near wallet.", + "near": "A browser based wallet that offers the same UI and features of wallet.near.org", "meteor": "Both a browser and extension wallet, with advanced NFT features.", "sender": "Security-audited mobile & extension wallet with 1M+ users, supporting NEAR & Aurora.", "here": "Non-custodial mobile wallet with a friendly user interface and advanced features.", @@ -694,8 +694,7 @@ "wellDone": "A multi-chain extension wallet that gives you control over all your assets from a single platform." }, "transfer": { - "titleSingular": "You have ${accountCount} account ready to transfer.", - "titlePlural": "You have ${accountCount} accounts ready to transfer.", + "title": "You have accounts that need to be transferred", "description": "To continue using NEAR apps and managing your assets you need to migrate your accounts to a different wallet." }