lukechilds
/
ledger-live-desktop
mirror of https://github.com/lukechilds/ledger-live-desktop.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

pixel fixes wip onboarding

master
Anastasia Poupeney 7 years ago
parent
e9f2e574d8
commit
0a869d2525
15 changed files with 107 additions and 100 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      electron-builder.yml
  2. 22
      src/components/Onboarding/OnboardingFooter.js
  3. 4
      src/components/Onboarding/helperComponents.js
  4. 4
      src/components/Onboarding/steps/GenuineCheck.js
  5. 36
      src/components/Onboarding/steps/Init.js
  6. 33
      src/components/Onboarding/steps/SelectDevice.js
  7. 6
      src/components/Onboarding/steps/SelectPIN/SelectPINnano.js
  8. 4
      src/components/Onboarding/steps/SelectPIN/index.js
  9. 9
      src/components/Onboarding/steps/WriteSeed/WriteSeedNano.js
  10. 4
      src/components/Onboarding/steps/WriteSeed/index.js
  11. 16
      src/icons/illustrations/LedgerBlue.js
  12. 44
      src/icons/illustrations/LedgerNanoSelectPIN.js
  13. 17
      src/icons/illustrations/WriteSeed.js
  14. 4
      src/reducers/onboarding.js
  15. 2
      static/i18n/en/onboarding.yml

2
electron-builder.yml
View File

@ -1,5 +1,7 @@
appId: com.ledger.live
npmRebuild: false
protocols:
name: Ledger Live
schemes:

22
src/components/Onboarding/OnboardingFooter.js
View File

@ -13,7 +13,7 @@ const Wrapper = styled(Box).attrs({
px: 5,
py: 3,
})`
border-top: 2px solid ${p => p.theme.colors.lightGrey};
border-top: 1px solid ${p => p.theme.colors.lightFog};
border-bottom-left-radius: ${radii[1]}px;
border-bottom-right-radius: ${radii[1]}px;
`
@ -22,15 +22,31 @@ type Props = {
t: T,
nextStep: () => void,
prevStep: () => void,
jumpStep?: string => void,
jumpTo?: string,
isContinueDisabled?: boolean,
}
const OnboardingFooter = ({ t, nextStep, prevStep, isContinueDisabled, ...props }: Props) => (
const OnboardingFooter = ({
t,
nextStep,
prevStep,
isContinueDisabled,
jumpStep,
jumpTo,
...props
}: Props) => (
<Wrapper {...props}>
<Button padded outline onClick={() => prevStep()}>
{t('common:back')}
</Button>
<Button padded disabled={isContinueDisabled} primary onClick={() => nextStep()} ml="auto">
<Button
padded
disabled={isContinueDisabled}
primary
onClick={() => (jumpTo && jumpStep ? jumpStep(jumpTo) : nextStep())}
ml="auto"
>
{t('common:continue')}
</Button>
</Wrapper>

4
src/components/Onboarding/helperComponents.js
View File

@ -64,7 +64,7 @@ export const OptionRowDesc = styled(Box).attrs({
textAlign: 'left',
color: 'smoke',
grow: true,
pl: 3,
pl: 2,
})``
export const IconOptionRow = styled(Box).attrs({
@ -92,7 +92,7 @@ const DisclaimerBoxContainer = styled(Box).attrs({
borderRadius: '4px',
bg: '#f9f9f980',
})`
min-width: 680px;
min-width: 620px;
border: 1px dashed ${p => p.theme.colors.fog};
`
const DisclaimerBoxIconContainer = styled(Box).attrs({

4
src/components/Onboarding/steps/GenuineCheck.js
View File

@ -295,8 +295,8 @@ const CardWrapper = styled(Card).attrs({
flow: 2,
justify: 'space-between',
})`
height: 97px;
width: 620px;
width: 550px;
height: 70px;
border: ${p => `1px ${p.isDisabled ? 'dashed' : 'solid'} ${p.theme.colors.fog}`};
pointer-events: ${p => (p.isDisabled ? 'none' : 'auto')};
background-color: ${p => (p.isDisabled ? p.theme.colors.lightGrey : p.theme.colors.white)};

36
src/components/Onboarding/steps/Init.js
View File

@ -27,7 +27,7 @@ class Init extends PureComponent<StepProps, *> {
const optionCards = [
{
key: 'newDevice',
icon: <IconPlus size={16} />,
icon: <IconPlus size={20} />,
title: t('onboarding:init.newDevice.title'),
onClick: () => {
nextStep()
@ -36,7 +36,7 @@ class Init extends PureComponent<StepProps, *> {
},
{
key: 'restoreDevice',
icon: <IconRecover size={16} />,
icon: <IconRecover size={20} />,
title: t('onboarding:init.restoreDevice.title'),
onClick: () => {
nextStep()
@ -45,7 +45,7 @@ class Init extends PureComponent<StepProps, *> {
},
{
key: 'initializedDevice',
icon: <IconCheck size={16} />,
icon: <IconCheck size={20} />,
title: t('onboarding:init.initializedDevice.title'),
onClick: () => {
nextStep()
@ -54,7 +54,7 @@ class Init extends PureComponent<StepProps, *> {
},
{
key: 'noDevice',
icon: <IconExternalLink size={16} />,
icon: <IconExternalLink size={20} />,
title: t('onboarding:init.noDevice.title'),
onClick: () => {
shell.openExternal('https://www.ledger.fr/')
@ -64,15 +64,15 @@ class Init extends PureComponent<StepProps, *> {
]
return (
<Box sticky alignItems="center" justifyContent="center">
<Box align="center">
<Box sticky pt={130}>
<Box align="center" justifyContent="center">
<Box color="wallet">
<IconUser size={36} />
</Box>
<Box p={4}>
<Box m={5} style={{ maxWidth: 480 }}>
<Title>{t('onboarding:init.title')}</Title>
</Box>
<Box mt={5} flow={5}>
<Box pt={4} flow={4}>
{optionCards.map(card => <OptionFlowCard key={card.key} card={card} />)}
</Box>
</Box>
@ -102,21 +102,25 @@ export function OptionFlowCard({ card }: { card: CardType }) {
<Box justify="center" grow>
<CardTitle>{title}</CardTitle>
</Box>
<Box justify="center" mx={4} my={3}>
<IconChevronRight style={{ color: colors.grey }} size={22} />
<Box justify="center" mx={1} my={4}>
<IconChevronRight style={{ color: colors.grey }} size={16} />
</Box>
</InitCardContainer>
)
}
const InitCardContainer = styled(Card).attrs({
const InitCardContainer = styled(Box).attrs({
p: 3,
horizontal: true,
borderRadius: '4px',
})`
border: 1px solid ${p => p.theme.colors.fog};
width: 550px;
width: 530px;
height: 70px;
&:hover {
cursor: pointer;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05);
}
`
export const CardTitle = styled(Box).attrs({
@ -126,12 +130,8 @@ export const CardTitle = styled(Box).attrs({
})``
const InitIconContainer = styled(Box).attrs({
mx: 4,
my: 3,
ml: 3,
mr: 4,
})`
width: 40px;
height: 40px;
border-radius: 50%;
background: rgba(100, 144, 241, 0.1);
text-align: -webkit-center;
`

33
src/components/Onboarding/steps/SelectDevice.js
View File

@ -7,6 +7,7 @@ import { rgba } from 'styles/helpers'
import { isLedgerNano } from 'reducers/onboarding'
import OnboardingFooter from '../OnboardingFooter'
import Box from 'components/base/Box'
import IconCheckCirle from 'icons/Check'
import IconLedgerNano from 'icons/illustrations/LedgerNano'
@ -20,18 +21,17 @@ const mapDispatchToProps = { isLedgerNano }
class SelectDevice extends PureComponent<StepProps, {}> {
handleIsLedgerNano = (isLedgerNano: boolean) => {
this.props.isLedgerNano(isLedgerNano)
this.props.onboarding.flowType === 'initializedDevice'
? this.props.jumpStep('genuineCheck')
: this.props.nextStep()
}
render() {
const { t, onboarding } = this.props
const { t, onboarding, nextStep, prevStep, jumpStep } = this.props
console.log('wewee: ', onboarding.isLedgerNano)
return (
<Box sticky pt={200}>
<Box grow alignItems="center">
<Title>{t('onboarding:selectDevice.title')}</Title>
<Box mt={7}>
<Box sticky>
<Box grow alignItems="center" justifyContent="center">
<Box m={5}>
<Title>{t('onboarding:selectDevice.title')}</Title>
</Box>
<Box pt={4}>
<Inner>
<DeviceContainer
isActive={onboarding.isLedgerNano}
@ -44,10 +44,10 @@ class SelectDevice extends PureComponent<StepProps, {}> {
<BlockTitle>{t('onboarding:selectDevice.ledgerNanoCard.title')}</BlockTitle>
</DeviceContainer>
<DeviceContainer
isActive={!onboarding.isLedgerNano}
isActive={!onboarding.isLedgerNano && onboarding.isLedgerNano !== null}
onClick={() => this.handleIsLedgerNano(false)}
>
{!onboarding.isLedgerNano && <DeviceSelected />}
{!onboarding.isLedgerNano && onboarding.isLedgerNano !== null && <DeviceSelected />}
<DeviceIcon>
<IconLedgerBlue />
</DeviceIcon>
@ -56,6 +56,16 @@ class SelectDevice extends PureComponent<StepProps, {}> {
</Inner>
</Box>
</Box>
<OnboardingFooter
horizontal
flow={2}
t={t}
nextStep={nextStep}
prevStep={prevStep}
jumpStep={jumpStep}
isContinueDisabled={onboarding.isLedgerNano === null}
jumpTo={onboarding.flowType === 'initializedDevice' ? 'genuineCheck' : undefined}
/>
</Box>
)
}
@ -70,6 +80,7 @@ const DeviceContainer = styled(Box).attrs({
alignItems: 'center',
justifyContent: 'center',
relative: true,
borderRadius: '4px',
})`
width: 218px;
height: 204px;

6
src/components/Onboarding/steps/SelectPIN/SelectPINnano.js
View File

@ -63,10 +63,8 @@ class SelectPINnano extends PureComponent<Props, *> {
return (
<Box align="center" mt={3}>
<Inner style={{ width: 700 }}>
<Box style={{ width: 260, justifyContent: 'center', alignItems: 'center' }} mt={5}>
<IconLedgerNanoSelectPIN />
</Box>
<Box shrink grow flow={4}>
<IconLedgerNanoSelectPIN />
<Box shrink grow flow={4} style={{ marginLeft: 40 }}>
{stepsLedgerNano.map(step => <OptionRow key={step.key} step={step} />)}
</Box>
</Inner>

4
src/components/Onboarding/steps/SelectPIN/index.js
View File

@ -15,8 +15,8 @@ export default (props: StepProps) => {
const { nextStep, prevStep, t, onboarding } = props
return (
<Box sticky pt={170}>
<Box grow alignItems="center">
<Box sticky pt={50}>
<Box grow alignItems="center" justifyContent="center">
<Title>{t('onboarding:selectPIN.title')}</Title>
<Box align="center" mt={7}>
{onboarding.isLedgerNano ? <SelectPINnano /> : <SelectPINblue />}

9
src/components/Onboarding/steps/WriteSeed/WriteSeedNano.js
View File

@ -72,12 +72,13 @@ class WriteSeedNano extends PureComponent<Props, *> {
<Title>{t('onboarding:writeSeed.nano.title')}</Title>
<Description>{t('onboarding:writeSeed.nano.desc')}</Description>
</Box>
<Box align="center">
<Inner style={{ width: 760 }}>
<Box style={{ width: 260, justifyContent: 'center', alignItems: 'center' }}>
<Box align="center" mt={3}>
<Inner style={{ width: 700 }}>
<Box style={{ width: 300 }} justifyContent="center" alignItems="center">
<IconWriteSeed />
</Box>
<Box shrink flow={2} m={0}>
<Box shrink grow flow={4}>
{steps.map(step => <OptionRow key={step.key} step={step} />)}
</Box>
</Inner>

4
src/components/Onboarding/steps/WriteSeed/index.js
View File

@ -16,8 +16,8 @@ export default (props: StepProps) => {
const { nextStep, prevStep, t, onboarding } = props
return (
<Box sticky pt={170}>
<Box grow alignItems="center">
<Box sticky pt={50}>
<Box grow alignItems="center" justifyContent="center">
{onboarding.flowType === 'restoreDevice' ? (
<WriteSeedRestore />
) : onboarding.isLedgerNano ? (

16
src/icons/illustrations/LedgerBlue.js
View File

@ -3,12 +3,12 @@
import React from 'react'
export default () => (
<svg width="41" height="56">
<svg width="52" height="72">
<g fill="none" fillRule="evenodd">
<rect width="1.608" height="4.8" x="39.392" y="7.2" fill="#1D2028" rx=".804" />
<rect width="2.039" height="6.171" x="49.961" y="9.257" fill="#1D2028" rx="1.02" />
<rect
width="38.696"
height="54.5"
width="49.48"
height="70.5"
x=".75"
y=".75"
fill="#6490F1"
@ -18,10 +18,10 @@ export default () => (
rx="3.2"
/>
<rect
width="26.833"
height="41.1"
x="6.678"
y="7.85"
width="34.167"
height="52.986"
x="8.403"
y="10.021"
fill="#FFF"
stroke="#6490F1"
strokeWidth=".5"

44
src/icons/illustrations/LedgerNanoSelectPIN.js
View File

@ -1,40 +1,33 @@
// @flow
import React from 'react'
export default () => (
<svg width="260" height="129">
<defs>
<linearGradient id="a" x1="50%" x2="50%" y1="100%" y2="0%">
<stop offset="1.367%" stopColor="#FFF" />
<stop offset="100%" stopColor="#1D2027" />
<linearGradient id="a" x1="50%" x2="50%" y1="0%" y2="100%">
<stop offset="0%" />
<stop offset="100%" stopColor="#FFF" />
</linearGradient>
<path
id="b"
d="M91 0h33.711a4 4 0 0 1 4 4v108.144c0 11.519-9.337 20.856-20.855 20.856C96.337 133 87 123.663 87 112.144V4a4 4 0 0 1 4-4z"
d="M91 0h34a4 4 0 0 1 4 4v108.144c0 11.519-9.337 20.856-20.856 20.856h-.288C96.337 133 87 123.663 87 112.144V4a4 4 0 0 1 4-4z"
/>
</defs>
<g fill="none" fillRule="evenodd">
<path
stroke="#1D2027"
strokeWidth="2"
d="M126.962 31.06a1 1 0 0 1-1 1H99.737a5 5 0 0 1-5-5v-8.485a5 5 0 0 1 5-5h26.225a1 1 0 0 1 1 1V31.06zm-32.608-5.208h-10.93v-6.435h10.93v6.435z"
d="M127.856 31.44a1 1 0 0 1-1 1H100.63a5 5 0 0 1-5-5v-8.486a5 5 0 0 1 5-5h26.225a1 1 0 0 1 1 1v16.485z"
/>
<path stroke="#142533" strokeWidth="2" d="M95.247 26.231H84.318v-6.435h10.93v6.435z" />
<path
stroke="#1D2027"
d="M127.53 28.836V16.58h11.076a1.5 1.5 0 0 1 1.5 1.5v9.256a1.5 1.5 0 0 1-1.5 1.5H127.53z"
/>
<path
d="M138.202 19.495h-6.794m6.794 6.208h-6.794"
stroke="#1D2027"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="2"
d="M127.923 28.726V17.471l6.977.083a1 1 0 0 1 .988 1v9.266a1 1 0 0 1-1.012.988l-6.953-.083z"
/>
<path
stroke="url(#a)"
strokeWidth="2.772"
d="M8.222 59.31h.23l-.23-.23v-1.155l-.578.577-.578-.577v1.155l-.23.23h.23v79.88h-.23l.23.23v1.156l.578-.578.578.578v-1.156l.23-.23h-.23V59.31zm5.657 0h.23l-.23-.23v-1.155l-.578.577-.578-.577v1.155l-.23.23h.23v79.88h-.23l.23.23v1.156l.578-.578.578.578v-1.156l.23-.23h-.23V59.31z"
transform="matrix(0 -1 -1 0 140.606 33.06)"
fill="url(#a)"
d="M6.836 53.925h1.616v82.65H6.836v-82.65zm5.657 0h1.616v82.65h-1.616v-82.65z"
transform="matrix(0 -1 -1 0 137.5 33.44)"
/>
<g transform="rotate(-90 128.59 1.975)">
<rect width="4.492" height="17.12" x="125.336" y="15.505" fill="#142533" rx="2" />
@ -46,21 +39,12 @@ export default () => (
stroke="#142533"
strokeLinejoin="square"
strokeWidth="2"
d="M91 1a3 3 0 0 0-3 3v108.144C88 123.11 96.89 132 107.856 132c10.966 0 19.855-8.89 19.855-19.856V4a3 3 0 0 0-3-3H91z"
/>
<rect
width="20.176"
height="61.019"
x="97.5"
y="21.5"
fill="#FFF"
stroke="#6490F1"
rx="1.6"
d="M91 1a3 3 0 0 0-3 3v108.144C88 123.11 96.89 132 107.856 132h.288C119.11 132 128 123.11 128 112.144V4a3 3 0 0 0-3-3H91z"
/>
<rect width="21" height="62" x="97.5" y="21.5" fill="#FFF" stroke="#6490F1" rx="1.6" />
<path
fill="#6490F1"
fillRule="nonzero"
d="M103.735 40.983v21.563c0 .397.225.719.502.719h6.526c.277 0 .502-.322.502-.719V40.983c0-.396-.225-.718-.502-.718h-6.526c-.277 0-.502.322-.502.718zm3.976 16.332c.04 0 .073.032.073.072v.73c0 .03.018.057.046.069a.08.08 0 0 0 .082-.016l.517-.515a.073.073 0 0 1 .105 0l.299.295a.077.077 0 0 1 0 .105l-.517.515a.075.075 0 0 0 .052.127h.73c.042 0 .076.034.076.075v.418a.075.075 0 0 1-.075.075h-.73a.075.075 0 1 0-.053.127l.517.515a.077.077 0 0 1 0 .105l-.299.295a.073.073 0 0 1-.105 0l-.517-.515a.076.076 0 0 0-.128.053v.727a.072.072 0 0 1-.073.075h-.422a.073.073 0 0 1-.073-.075v-.727a.076.076 0 0 0-.128-.052l-.517.514a.073.073 0 0 1-.105 0l-.299-.292a.077.077 0 0 1 0-.105l.517-.515a.075.075 0 0 0-.052-.128h-.73a.075.075 0 0 1-.076-.075v-.427c0-.042.034-.075.075-.075h.73c.03 0 .058-.019.07-.047a.075.075 0 0 0-.017-.08l-.517-.516a.077.077 0 0 1 0-.105l.299-.295a.073.073 0 0 1 .105 0l.517.515a.076.076 0 0 0 .128-.052v-.73c0-.04.033-.073.073-.073l.422.008zm0-4.718c.04.002.073.035.073.075v.728c0 .03.018.057.046.068.028.011.06.005.082-.016l.517-.515a.078.078 0 0 1 .105 0l.299.298a.077.077 0 0 1 0 .105l-.517.515a.075.075 0 0 0 .052.127h.73c.041 0 .075.032.076.073v.42a.075.075 0 0 1-.075.072h-.73a.075.075 0 1 0-.053.127l.517.516a.077.077 0 0 1 0 .105l-.299.297a.078.078 0 0 1-.105 0l-.517-.515a.076.076 0 0 0-.128.053v.727c0 .04-.033.074-.073.075h-.422a.075.075 0 0 1-.073-.075v-.727a.076.076 0 0 0-.128-.052l-.517.514a.078.078 0 0 1-.105 0l-.299-.297a.077.077 0 0 1 0-.105l.517-.515a.075.075 0 0 0-.052-.128h-.73a.075.075 0 0 1-.076-.072v-.42a.075.075 0 0 1 .075-.073h.73c.03 0 .058-.018.07-.046a.075.075 0 0 0-.017-.081l-.517-.515a.077.077 0 0 1 0-.105l.299-.298a.078.078 0 0 1 .105 0l.517.515a.076.076 0 0 0 .128-.052v-.728c0-.04.033-.073.073-.075h.422zm0-4.715a.073.073 0 0 1 .073.075v.728c0 .03.018.057.046.068.028.011.06.005.082-.016l.517-.515a.073.073 0 0 1 .105 0l.299.293a.077.077 0 0 1 0 .105l-.517.515a.075.075 0 0 0 .052.127h.73c.042 0 .076.034.076.075v.428a.075.075 0 0 1-.075.075h-.73a.075.075 0 1 0-.053.127l.517.515a.077.077 0 0 1 0 .105l-.299.295a.073.073 0 0 1-.105 0l-.517-.515a.076.076 0 0 0-.128.053v.722c0 .04-.033.073-.073.073h-.422a.073.073 0 0 1-.073-.073v-.73a.076.076 0 0 0-.128-.052l-.517.515a.073.073 0 0 1-.105 0l-.299-.295a.077.077 0 0 1 0-.105l.517-.515a.075.075 0 0 0-.052-.128h-.73a.075.075 0 0 1-.076-.075v-.417c0-.042.034-.075.075-.075h.73c.03 0 .058-.019.07-.047a.075.075 0 0 0-.017-.08l-.517-.516a.077.077 0 0 1 0-.105l.299-.295a.073.073 0 0 1 .105 0l.517.515a.076.076 0 0 0 .128-.052v-.728a.072.072 0 0 1 .073-.075h.422zm0-5a.073.073 0 0 1 .073.075v.728c0 .03.018.057.046.068.028.011.06.005.082-.016l.517-.515a.073.073 0 0 1 .105 0l.299.293a.077.077 0 0 1 0 .105l-.517.515a.075.075 0 0 0 .052.127h.73c.042 0 .076.034.076.075v.428a.075.075 0 0 1-.075.075h-.73a.075.075 0 1 0-.053.127l.517.515a.077.077 0 0 1 0 .105l-.299.295a.073.073 0 0 1-.105 0l-.517-.515a.076.076 0 0 0-.128.053v.722c0 .04-.033.073-.073.073h-.422a.073.073 0 0 1-.073-.073v-.73a.076.076 0 0 0-.128-.052l-.517.515a.073.073 0 0 1-.105 0l-.299-.295a.077.077 0 0 1 0-.105l.517-.515a.075.075 0 0 0-.052-.128h-.73a.075.075 0 0 1-.076-.075v-.417c0-.042.034-.075.075-.075h.73c.03 0 .058-.019.07-.047a.075.075 0 0 0-.017-.08l-.517-.516a.077.077 0 0 1 0-.105l.299-.295a.073.073 0 0 1 .105 0l.517.515a.076.076 0 0 0 .128-.052v-.728a.072.072 0 0 1 .073-.075h.422z"
d="M105.5 35h5a.5.5 0 0 1 .5.5v34a.5.5 0 0 1-.5.5h-5a.5.5 0 0 1-.5-.5v-34a.5.5 0 0 1 .5-.5zm1.238 3.042l.774.512v.013l-.774.505.341.466.722-.577h.013l.243.899.551-.177-.328-.88.932.053v-.597l-.932.046.328-.873-.551-.17-.243.892h-.013l-.722-.584-.34.472zm0 3.908l.774.512v.013l-.774.505.341.466.722-.578h.013l.243.9.551-.178-.328-.88.932.053v-.597l-.932.046.328-.872-.551-.17-.243.891h-.013l-.722-.584-.34.473zm0 3.907l.774.512v.013l-.774.505.341.466.722-.577h.013l.243.899.551-.178-.328-.879.932.053v-.597l-.932.046.328-.873-.551-.17-.243.892h-.013l-.722-.584-.34.472zm0 3.908l.774.511v.014l-.774.505.341.466.722-.578h.013l.243.899.551-.177-.328-.88.932.053v-.597l-.932.046.328-.872-.551-.171-.243.892h-.013l-.722-.584-.34.473zm0 3.907l.774.512v.013l-.774.505.341.466.722-.577h.013l.243.898.551-.177-.328-.879.932.053v-.597l-.932.046.328-.873-.551-.17-.243.892h-.013l-.722-.584-.34.472zm0 3.908l.774.511v.013l-.774.506.341.465.722-.577h.013l.243.899.551-.177-.328-.88.932.053v-.597l-.932.046.328-.873-.551-.17-.243.892h-.013l-.722-.584-.34.473zm0 3.907l.774.512v.013l-.774.505.341.466.722-.578h.013l.243.9.551-.178-.328-.879.932.052v-.597l-.932.046.328-.872-.551-.17-.243.891h-.013l-.722-.583-.34.472zm0 3.907l.774.512v.013l-.774.505.341.466.722-.577h.013l.243.899.551-.177-.328-.88.932.053v-.597l-.932.046.328-.873-.551-.17-.243.892h-.013l-.722-.584-.34.472z"
/>
<path
fill="#FFF"

17
src/icons/illustrations/WriteSeed.js
View File

@ -3,18 +3,18 @@
import React from 'react'
export default () => (
<svg width="145" height="126">
<svg width="145" height="109">
<g fill="none" fillRule="evenodd" transform="translate(-1)">
<path
fill="#6490F1"
fillOpacity=".1"
stroke="#142533"
strokeWidth="1.8"
d="M29.105 103.014l19.87-84.34L4.123 34.999a2.7 2.7 0 0 0-1.573 3.566l26.556 64.449zm89.265 1.336L97.73 33.29l44.752 16.288a2.7 2.7 0 0 1 1.49 3.748L118.37 104.35z"
d="M29.105 104.014l19.87-84.34L4.123 35.999a2.7 2.7 0 0 0-1.573 3.566l26.556 64.449zm89.265 1.336L97.73 34.29l44.752 16.288a2.7 2.7 0 0 1 1.49 3.748L118.37 105.35z"
/>
<rect
width="88.2"
height="106.2"
height="107.2"
x="29.9"
y=".9"
fill="#FFF"
@ -22,9 +22,10 @@ export default () => (
strokeWidth="1.8"
rx="3.6"
/>
<rect width="50" height="4" x="49" y="14" fill="#6490F1" rx="2" />
<path
fill="#6490F1"
d="M82.969 92.378h23.22a1.81 1.81 0 0 1 0 3.622H82.97a1.81 1.81 0 0 1 0-3.622zm-41.158 0h23.22a1.81 1.81 0 0 1 0 3.622h-23.22a1.81 1.81 0 1 1 0-3.622zm41.158-12.675h23.22a1.81 1.81 0 0 1 0 3.621H82.97a1.81 1.81 0 0 1 0-3.621zm-41.158 0h23.22a1.81 1.81 0 0 1 0 3.621h-23.22a1.81 1.81 0 1 1 0-3.621zm41.158-12.676h23.22a1.81 1.81 0 0 1 0 3.622H82.97a1.81 1.81 0 0 1 0-3.622zm-41.158 0h23.22a1.81 1.81 0 0 1 0 3.622h-23.22a1.81 1.81 0 1 1 0-3.622zm41.158-12.676h23.22a1.81 1.81 0 0 1 0 3.622H82.97a1.81 1.81 0 0 1 0-3.622zm-41.158 0h23.22a1.81 1.81 0 0 1 0 3.622h-23.22a1.81 1.81 0 1 1 0-3.622zm41.158-12.675h23.22a1.81 1.81 0 0 1 0 3.621H82.97a1.81 1.81 0 0 1 0-3.621zm-41.158 0h23.22a1.81 1.81 0 0 1 0 3.621h-23.22a1.81 1.81 0 1 1 0-3.621zM82.969 29h23.22a1.81 1.81 0 0 1 0 3.622H82.97a1.81 1.81 0 0 1 0-3.622zM41.81 29h23.22a1.81 1.81 0 0 1 0 3.622H41.81a1.81 1.81 0 1 1 0-3.622z"
d="M83.18 91.378h24.01a1.81 1.81 0 0 1 0 3.622H83.18a1.81 1.81 0 1 1 0-3.622zm-42.37 0h24.01a1.81 1.81 0 1 1 0 3.622H40.81a1.81 1.81 0 1 1 0-3.622zm42.37-12.675h24.01a1.81 1.81 0 0 1 0 3.621H83.18a1.81 1.81 0 1 1 0-3.621zm-42.37 0h24.01a1.81 1.81 0 1 1 0 3.621H40.81a1.81 1.81 0 1 1 0-3.621zm42.37-12.676h24.01a1.81 1.81 0 0 1 0 3.622H83.18a1.81 1.81 0 1 1 0-3.622zm-42.37 0h24.01a1.81 1.81 0 1 1 0 3.622H40.81a1.81 1.81 0 1 1 0-3.622zm42.37-12.676h24.01a1.81 1.81 0 0 1 0 3.622H83.18a1.81 1.81 0 1 1 0-3.622zm-42.37 0h24.01a1.81 1.81 0 1 1 0 3.622H40.81a1.81 1.81 0 1 1 0-3.622zm42.37-12.675h24.01a1.81 1.81 0 0 1 0 3.621H83.18a1.81 1.81 0 1 1 0-3.621zm-42.37 0h24.01a1.81 1.81 0 1 1 0 3.621H40.81a1.81 1.81 0 1 1 0-3.621zM83.18 28h24.01a1.81 1.81 0 0 1 0 3.622H83.18a1.81 1.81 0 1 1 0-3.622zm-42.37 0h24.01a1.81 1.81 0 1 1 0 3.622H40.81a1.81 1.81 0 1 1 0-3.622z"
opacity=".5"
/>
<path
@ -32,14 +33,8 @@ export default () => (
fillRule="nonzero"
stroke="#6490F1"
strokeWidth="2"
d="M85.623 57.047a17.987 17.987 0 0 1 6.194 13.596c0 9.92-8.032 17.99-17.909 17.99-9.876 0-17.908-8.07-17.908-17.99a17.986 17.986 0 0 1 6.194-13.596v-3.281C62.194 47.278 67.447 42 73.908 42c6.462 0 11.715 5.278 11.715 11.766v3.28zM73.809 74.193zm.003-.018v4.55a.1.1 0 0 0 .096.102.1.1 0 0 0 .097-.102v-4.55a3.149 3.149 0 0 1-.006-.054l-.088-.899.885-.179a4.505 4.505 0 0 0 3.596-4.42c0-2.493-2.008-4.51-4.484-4.51-2.475 0-4.483 2.018-4.483 4.51a4.505 4.505 0 0 0 3.596 4.42l.885.18-.088.898a3.149 3.149 0 0 1-.006.054zm.196.018a.1.1 0 0 0 0 .004v-.004zm0 .004v-.002zm-7.62-19.876a17.719 17.719 0 0 1 7.52-1.668c2.633 0 5.186.577 7.521 1.668v-.555c0-4.17-3.375-7.562-7.52-7.562-4.146 0-7.521 3.392-7.521 7.562v.555z"
d="M85.623 56.047a17.987 17.987 0 0 1 6.194 13.596c0 9.92-8.032 17.99-17.909 17.99-9.876 0-17.908-8.07-17.908-17.99a17.986 17.986 0 0 1 6.194-13.596v-3.281C62.194 46.278 67.447 41 73.908 41c6.462 0 11.715 5.278 11.715 11.766v3.28zM73.809 73.193zm.003-.018v4.55a.1.1 0 0 0 .096.102.1.1 0 0 0 .097-.102v-4.55a3.149 3.149 0 0 1-.006-.054l-.088-.899.885-.179a4.505 4.505 0 0 0 3.596-4.42c0-2.493-2.008-4.51-4.484-4.51-2.475 0-4.483 2.018-4.483 4.51a4.505 4.505 0 0 0 3.596 4.42l.885.18-.088.898a3.149 3.149 0 0 1-.006.054zm.196.018a.1.1 0 0 0 0 .004v-.004zm0 .004v-.002zm-7.62-19.876a17.719 17.719 0 0 1 7.52-1.668c2.633 0 5.186.577 7.521 1.668v-.555c0-4.17-3.375-7.562-7.52-7.562-4.146 0-7.521 3.392-7.521 7.562v.555z"
/>
{/* <text fill="#142533" fontFamily="MuseoSans-700, Museo Sans" fontSize="5" fontWeight="500">
<tspan x="41" y="17">
RECOVERY PHRASE
</tspan>
</text> */}
<ellipse cx="75" cy="122.5" fill="#EEE" rx="48" ry="3.5" />
</g>
</svg>
)

4
src/reducers/onboarding.js
View File

@ -23,7 +23,7 @@ export type OnboardingState = {
isGenuineFail: boolean,
isDeviceGenuine: boolean,
},
isLedgerNano: boolean,
isLedgerNano: boolean | null,
flowType: string,
}
@ -36,7 +36,7 @@ const state: OnboardingState = {
isGenuineFail: false,
isDeviceGenuine: false,
},
isLedgerNano: true,
isLedgerNano: null,
flowType: '',
steps: [
{

2
static/i18n/en/onboarding.yml
View File

@ -12,7 +12,7 @@ init:
title: I have already initialized my device
desc: Please replace it with the final wording once it’s done.
noDevice:
title: Do not have a Ledger device yet? Buy one
title: Do not have a Ledger device yet?
desc: Please replace it with the final wording once it’s done.
selectDevice:
title: To get started, select your device

Write Preview
Loading…
Cancel
Save