arno/trezor-wallet
1
0
Fork 0
mirror of https://github.com/trezor/trezor-wallet synced 2025-01-11 16:41:06 +00:00
Code Issues Releases Wiki Activity

Import images properly

Browse Source
This commit is contained in:
Vladimir Volek 2018-09-26 12:17:03 +02:00
parent ac765c3966
commit c0eb30f83c
1 changed files with 7 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/views/Landing/components/BrowserNotSupported/index.js
View File

@ -1,10 +1,13 @@
import React from 'react'; import React from 'react';
import styled, { css } from 'styled-components'; import styled from 'styled-components';
import Link from 'components/Link'; import Link from 'components/Link';
import Button from 'components/Button'; import Button from 'components/Button';
import P from 'components/Paragraph'; import P from 'components/Paragraph';
import { H2 } from 'components/Heading'; import { H2 } from 'components/Heading';
import ChromeImage from 'images/browser-chrome.png';
import FirefoxImage from 'images/browser-firefox.png';
const Wrapper = styled.div``; const Wrapper = styled.div``;
const ChooseBrowserWrapper = styled.div` const ChooseBrowserWrapper = styled.div`
@ -12,16 +15,10 @@ const ChooseBrowserWrapper = styled.div`
justify-content: space-between; justify-content: space-between;
`; `;
const BrowserLogo = styled.div` const BrowserLogo = styled.img`
margin-bottom: 10px; margin-bottom: 10px;
width: 43px; width: 43px;
height: 43px; height: 43px;
${props => props.isChrome && css`
background-image: url('../images/browser-chrome.png');
`}
${props => props.isFirefox && css`
background-image: url('../images/browser-firefox.png');
`}
`; `;
const Browser = styled.div` const Browser = styled.div`
@ -37,7 +34,7 @@ const BrowserNotSupported = () => (
<P>Please choose one of the supported browsers</P> <P>Please choose one of the supported browsers</P>
<ChooseBrowserWrapper> <ChooseBrowserWrapper>
<Browser> <Browser>
<BrowserLogo isChrome /> <BrowserLogo src={ChromeImage} />
<P isSmaller>Google Chrome</P> <P isSmaller>Google Chrome</P>
<Link <Link
href="https://www.google.com/chrome/" href="https://www.google.com/chrome/"
@ -48,7 +45,7 @@ const BrowserNotSupported = () => (
</Link> </Link>
</Browser> </Browser>
<Browser> <Browser>
<BrowserLogo isFirefox /> <BrowserLogo src={FirefoxImage} />
<P isSmaller>Mozzila Firefox</P> <P isSmaller>Mozzila Firefox</P>
<Link <Link
href="https://www.mozilla.org/en-US/firefox/new/" href="https://www.mozilla.org/en-US/firefox/new/"