diff --git a/src/assets/icons/appstore-dark.svg b/src/assets/icons/appstore-dark.svg new file mode 100644 index 0000000000..072b425a1a --- /dev/null +++ b/src/assets/icons/appstore-dark.svg @@ -0,0 +1,46 @@ + + Download_on_the_App_Store_Badge_US-UK_RGB_blk_4SVG_092917 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/icons/appstore-light.png b/src/assets/icons/appstore-light.png new file mode 100644 index 0000000000..70f336b2fd Binary files /dev/null and b/src/assets/icons/appstore-light.png differ diff --git a/src/components/AppLayout/Footer/index.tsx b/src/components/AppLayout/Footer/index.tsx index 3375ee5f04..c22861a3d2 100644 --- a/src/components/AppLayout/Footer/index.tsx +++ b/src/components/AppLayout/Footer/index.tsx @@ -2,6 +2,7 @@ import { makeStyles } from '@material-ui/core/styles' import cn from 'classnames' import * as React from 'react' import { useDispatch } from 'react-redux' +import AppstoreButton from 'src/components/AppstoreButton' import GnoButtonLink from 'src/components/layout/ButtonLink' import Link from 'src/components/layout/Link' @@ -16,6 +17,7 @@ const useStyles = makeStyles({ flexShrink: '1', flexWrap: 'wrap', justifyContent: 'center', + alignItems: 'center', margin: '0 auto', maxWidth: '100%', padding: `20px ${sm} 20px`, @@ -87,6 +89,8 @@ const Footer = (): React.ReactElement => { > {appVersion} + | + ) } diff --git a/src/components/AppLayout/Header/components/ProviderDetails/ConnectDetails.tsx b/src/components/AppLayout/Header/components/ProviderDetails/ConnectDetails.tsx index 719b19a066..ca13b4db15 100644 --- a/src/components/AppLayout/Header/components/ProviderDetails/ConnectDetails.tsx +++ b/src/components/AppLayout/Header/components/ProviderDetails/ConnectDetails.tsx @@ -26,9 +26,6 @@ const styles = () => ({ justifyCenter: { justifyContent: 'center', }, - appStore: { - height: '35px', - }, }) const StyledCard = styled(Card)` diff --git a/src/components/AppLayout/Header/components/ProviderDetails/PairingDetails.tsx b/src/components/AppLayout/Header/components/ProviderDetails/PairingDetails.tsx index e6021dfbf9..696edfe0a4 100644 --- a/src/components/AppLayout/Header/components/ProviderDetails/PairingDetails.tsx +++ b/src/components/AppLayout/Header/components/ProviderDetails/PairingDetails.tsx @@ -11,6 +11,7 @@ import Row from 'src/components/layout/Row' import usePairing from 'src/logic/wallets/pairing/hooks/usePairing' import { initPairing, isPairingModule } from 'src/logic/wallets/pairing/utils' import { useGetPairingUri } from 'src/logic/wallets/pairing/hooks/useGetPairingUri' +import AppstoreButton from 'src/components/AppstoreButton' const StyledDivider = styled(Divider)` width: calc(100% + 40px); @@ -63,13 +64,7 @@ const PairingDetails = ({ classes }: { classes: Record }): React - - Download on the App Store - + ) diff --git a/src/components/AppLayout/index.tsx b/src/components/AppLayout/index.tsx index ca0f719680..71d37d0557 100644 --- a/src/components/AppLayout/index.tsx +++ b/src/components/AppLayout/index.tsx @@ -1,6 +1,5 @@ import { useState } from 'react' import styled from 'styled-components' -import { useLocation, matchPath } from 'react-router-dom' import { ListItemType } from 'src/components/List' @@ -8,7 +7,6 @@ import Header from './Header' import Footer from './Footer' import Sidebar from './Sidebar' import { MobileNotSupported } from './MobileNotSupported' -import { SAFE_ROUTES, WELCOME_ROUTE } from 'src/routes/routes' import useDarkMode from 'src/logic/hooks/useDarkMode' const Container = styled.div` @@ -93,15 +91,10 @@ const Layout: React.FC = ({ sidebarItems, }): React.ReactElement => { const [mobileNotSupportedClosed, setMobileNotSupportedClosed] = useState(false) - const { pathname } = useLocation() useDarkMode() const closeMobileNotSupported = () => setMobileNotSupportedClosed(true) - const hasFooter = !!matchPath(pathname, { - path: [SAFE_ROUTES.SETTINGS, WELCOME_ROUTE], - }) - return ( @@ -122,7 +115,7 @@ const Layout: React.FC = ({
{children}
- {hasFooter &&