Merge pull request #668 from NastiaS/minorFixesBranch

adding custom font for some wording in empty state account

src/components/AccountPage/EmptyStateAccount.js

@@ -4,7 +4,7 @@ import React, { PureComponent } from 'react'
 import { i } from 'helpers/staticPath'
 import { connect } from 'react-redux'
 import { compose } from 'redux'
-import { translate } from 'react-i18next'
+import { translate, Trans } from 'react-i18next'
 
 import { openModal } from 'reducers/modals'
 import type { T } from 'types/common'
@@ -13,6 +13,7 @@ import type { Account } from '@ledgerhq/live-common/lib/types'
 import { MODAL_RECEIVE } from 'config/constants'
 
 import Box from 'components/base/Box'
+import Text from 'components/base/Text'
 import Button from 'components/base/Button'
 import { Title, Description } from 'components/DashboardPage/EmptyState'
 import IconReceive from 'icons/Receive'
@@ -30,7 +31,6 @@ type Props = {
 class EmptyStateAccount extends PureComponent<Props, *> {
   render() {
     const { t, account, openModal } = this.props
-
     return (
       <Box mt={7} alignItems="center">
         <img
@@ -41,7 +41,15 @@ class EmptyStateAccount extends PureComponent<Props, *> {
         />
         <Box mt={5} alignItems="center">
           <Title>{t('app:account.emptyState.title')}</Title>
-          <Description>{t('app:account.emptyState.desc')}</Description>
+          <Description>
+            <Trans i18nKey="app:account.emptyState.desc">
+              Make sure the
+              <Text ff="Open Sans|SemiBold" color="dark">
+                {account.currency.name}
+              </Text>
+              app is installed to receive funds.
+            </Trans>
+          </Description>
           <Button mt={3} padded primary onClick={() => openModal(MODAL_RECEIVE, { account })}>
             <Box horizontal flow={1} alignItems="center">
               <IconReceive size={12} />

src/components/DashboardPage/EmptyState.js

@@ -48,13 +48,13 @@ class EmptyState extends PureComponent<Props, *> {
           <Title>{t('app:emptyState.dashboard.title')}</Title>
           <Description>{t('app:emptyState.dashboard.desc')}</Description>
           <Box mt={3} horizontal justifyContent="space-around" style={{ width: 300 }}>
-            <Button padded primary style={{ width: 120 }} onClick={this.handleInstallApp}>
+            <Button padded primary style={{ minWidth: 120 }} onClick={this.handleInstallApp}>
               {t('app:emptyState.dashboard.buttons.installApp')}
             </Button>
             <Button
               padded
               primary
-              style={{ width: 120 }}
+              style={{ minWidth: 120 }}
               onClick={() => openModal(MODAL_ADD_ACCOUNTS)}
             >
               {t('app:emptyState.dashboard.buttons.addAccount')}
@@ -78,6 +78,7 @@ export const Description = styled(Box).attrs({
   color: p => p.theme.colors.graphite,
 })`
   margin: 10px auto 25px;
+  display: block;
 `
 export default compose(
   connect(

static/i18n/en/app.yml

@@ -39,7 +39,7 @@ common:
     lostPassword: I lost my password
   sync:
     syncing: Synchronizing...
-    upToDate: Live
+    upToDate: Up to date
     error: Synchronization error
     refresh: Refresh
     ago: Synced {{time}}
@@ -75,7 +75,7 @@ account:
   lastOperations: Last operations
   emptyState:
     title: No funds yet?
-    desc: Make sure the [cryptocurrency] app is installed to receive funds. # replace [cryptocurrency] and make it bold
+    desc: Make sure the <1><0>{{currency}}</0></1> app is installed to receive funds. # replace [cryptocurrency] and make it bold
     buttons:
       receiveFunds: Receive funds
   settings: