Translations with update script

.gitignore

@@ -78,3 +78,6 @@ coverage
 
 # CocoaPods
 /ios/Pods/
+
+# Language files to add
+/locales/languagesToUpdate/*.json

app/components/UI/ApproveTransactionReview/index.js

@@ -38,6 +38,7 @@ import { WALLET_CONNECT_ORIGIN } from '../../../util/walletconnect';
 import { withNavigation } from 'react-navigation';
 import { getNetworkName, isMainNet } from '../../../util/networks';
 import { capitalize } from '../../../util/format';
+import scaling from '../../../util/scaling';
 
 const { hexToBN } = util;
 const styles = StyleSheet.create({
@@ -60,7 +61,7 @@ const styles = StyleSheet.create({
 	},
 	title: {
 		...fontStyles.bold,
-		fontSize: 24,
+		fontSize: scaling.scale(24),
 		textAlign: 'center',
 		color: colors.black,
 		lineHeight: 34,

app/components/UI/BackupAlert/index.js

@@ -41,6 +41,8 @@ const styles = StyleSheet.create({
 		fontSize: 12,
 		color: colors.blue,
 		marginLeft: 14,
+		flex: 1,
+		textAlign: 'right',
 		...fontStyles.normal
 	},
 	touchableView: {
@@ -52,7 +54,14 @@ const styles = StyleSheet.create({
 	modalViewNotInBrowserView: {
 		bottom: Device.isIphoneX() ? 20 : 10
 	},
-	buttonsWrapper: { flexDirection: 'row-reverse', alignContent: 'flex-end' }
+	buttonsWrapper: {
+		flexDirection: 'row-reverse',
+		alignContent: 'flex-end',
+		flex: 1
+	},
+	dismissButton: {
+		flex: 1
+	}
 });
 
 const BLOCKED_LIST = [
@@ -166,7 +175,7 @@ class BackupAlert extends PureComponent {
 									{strings('backup_alert.right_button')}
 								</Text>
 							</TouchableOpacity>
-							<TouchableOpacity onPress={this.onDismiss}>
+							<TouchableOpacity onPress={this.onDismiss} style={styles.dismissButton}>
 								<Text style={styles.backupAlertMessage} testID={'notification-remind-later-button'}>
 									{strings('backup_alert.left_button')}
 								</Text>

app/components/UI/ProtectYourWalletModal/index.js

@@ -5,24 +5,30 @@ import ActionModal from '../ActionModal';
 import { fontStyles, colors } from '../../../styles/common';
 import { connect } from 'react-redux';
 import { protectWalletModalNotVisible } from '../../../actions/user';
-import Ionicons from 'react-native-vector-icons/Ionicons';
+import Icon from 'react-native-vector-icons/FontAwesome';
 import { strings } from '../../../../locales/i18n';
+import scaling from '../../../util/scaling';
 
 const protectWalletImage = require('../../../images/protect-wallet.jpg'); // eslint-disable-line
 
 const styles = StyleSheet.create({
 	wrapper: {
 		marginTop: 24,
-		marginHorizontal: 24
+		marginHorizontal: 24,
+		flex: 1
 	},
 	title: {
 		...fontStyles.bold,
 		color: colors.black,
 		textAlign: 'center',
-		fontSize: 20
+		fontSize: 20,
+		flex: 1
 	},
 	imageWrapper: { flexDirection: 'column', alignItems: 'center', marginBottom: 12, marginTop: 30 },
-	image: { width: 135, height: 160 },
+	image: {
+		width: scaling.scale(135, { baseModel: 1 }),
+		height: scaling.scale(160, { baseModel: 1 })
+	},
 	text: {
 		...fontStyles.normal,
 		color: colors.black,
@@ -31,16 +37,25 @@ const styles = StyleSheet.create({
 		marginBottom: 24
 	},
 	closeIcon: {
-		position: 'absolute',
-		right: 0,
-		top: -2
+		padding: 5
 	},
 	learnMoreText: {
 		textAlign: 'center',
 		...fontStyles.normal,
 		color: colors.blue,
 		marginBottom: 14,
 		fontSize: 14
+	},
+	modalXIcon: {
+		fontSize: 16
+	},
+	titleWrapper: {
+		flexDirection: 'row',
+		justifyContent: 'center',
+		alignItems: 'center'
+	},
+	auxCenter: {
+		width: 26
 	}
 });
 
@@ -92,14 +107,15 @@ class ProtectYourWalletModal extends PureComponent {
 			>
 				<View style={styles.wrapper} testID={'protect-wallet-modal'}>
 					<View style={styles.titleWrapper}>
+						<View style={styles.auxCenter} />
 						<Text style={styles.title}>{strings('protect_wallet_modal.title')}</Text>
-
-						<Ionicons
+						<TouchableOpacity
 							onPress={this.props.protectWalletModalNotVisible}
-							name={'ios-close'}
-							size={32}
 							style={styles.closeIcon}
-						/>
+							hitSlop={{ top: 10, left: 10, bottom: 10, right: 10 }}
+						>
+							<Icon name="times" style={styles.modalXIcon} />
+						</TouchableOpacity>
 					</View>
 					<View style={styles.imageWrapper}>
 						<Image source={protectWalletImage} style={styles.image} />

app/components/UI/SeedphraseModal/index.js

@@ -8,6 +8,7 @@ import ActionModal from '../../UI/ActionModal';
 
 const styles = {
 	whatIsSeedphraseTitle: {
+		flex: 1,
 		fontSize: 18,
 		color: colors.fontPrimary,
 		textAlign: 'center',
@@ -22,7 +23,7 @@ const styles = {
 		flexDirection: 'column'
 	},
 	modalXButton: {
-		flex: 1,
+		padding: 5,
 		alignItems: 'flex-end'
 	},
 	titleContainer: {
@@ -32,7 +33,7 @@ const styles = {
 		marginBottom: 16
 	},
 	auxCenterView: {
-		flex: 1
+		width: 26
 	},
 	explanationText: {
 		fontSize: 14,

app/components/UI/SignatureRequest/index.js

@@ -19,16 +19,16 @@ const styles = StyleSheet.create({
 	root: {
 		backgroundColor: colors.white,
 		paddingTop: 24,
-		minHeight: Device.isIos() ? '72%' : '80%',
+		minHeight: '90%',
 		borderTopLeftRadius: 20,
 		borderTopRightRadius: 20,
 		paddingBottom: Device.isIphoneX() ? 20 : 0
 	},
 	expandedHeight2: {
-		minHeight: '80%'
+		minHeight: '90%'
 	},
 	expandedHeight1: {
-		minHeight: '75%'
+		minHeight: '90%'
 	},
 	signingInformation: {
 		alignItems: 'center',
@@ -237,15 +237,6 @@ class SignatureRequest extends PureComponent {
 		}
 		return (
 			<View style={[styles.root, expandedHeight]}>
-				<TransactionHeader currentPageInformation={currentPageInformation} type={type} />
-				<View style={styles.signingInformation}>
-					<Text style={styles.signText}>{strings('signature_request.signing')}</Text>
-					{showWarning ? (
-						<TouchableOpacity style={styles.warningWrapper} onPress={this.goToWarning}>
-							<WarningMessage warningMessage={this.renderWarning()} />
-						</TouchableOpacity>
-					) : null}
-				</View>
 				<ActionView
 					cancelTestID={'request-signature-cancel-button'}
 					confirmTestID={'request-signature-confirm-button'}
@@ -255,7 +246,18 @@ class SignatureRequest extends PureComponent {
 					onConfirmPress={this.onConfirm}
 					confirmButtonMode="sign"
 				>
-					{this.renderActionViewChildren()}
+					<View>
+						<TransactionHeader currentPageInformation={currentPageInformation} type={type} />
+						<View style={styles.signingInformation}>
+							<Text style={styles.signText}>{strings('signature_request.signing')}</Text>
+							{showWarning ? (
+								<TouchableOpacity style={styles.warningWrapper} onPress={this.goToWarning}>
+									<WarningMessage warningMessage={this.renderWarning()} />
+								</TouchableOpacity>
+							) : null}
+						</View>
+						{this.renderActionViewChildren()}
+					</View>
 				</ActionView>
 			</View>
 		);

app/components/Views/AccountBackupStep1B/index.js

@@ -90,10 +90,11 @@ const styles = StyleSheet.create({
 	},
 	secureModalContainer: { flex: 1, padding: 27, flexDirection: 'column' },
 	secureModalXButton: {
-		flex: 1,
+		padding: 5,
 		alignItems: 'flex-end'
 	},
 	whySecureTitle: {
+		flex: 1,
 		fontSize: 18,
 		color: colors.fontPrimary,
 		textAlign: 'center',
@@ -166,7 +167,7 @@ const styles = StyleSheet.create({
 		fontSize: 16
 	},
 	auxCenterView: {
-		flex: 1
+		width: 26
 	},
 	secureModalTitleContainer: {
 		flexDirection: 'row',

app/components/Views/BrowserTab/index.js

@@ -126,7 +126,8 @@ const styles = StyleSheet.create({
 	},
 	option: {
 		paddingVertical: 10,
-		height: 44,
+		height: 'auto',
+		minHeight: 44,
 		paddingHorizontal: 15,
 		backgroundColor: colors.white,
 		flexDirection: 'row',
@@ -141,6 +142,7 @@ const styles = StyleSheet.create({
 		justifyContent: 'center',
 		marginTop: 3,
 		color: colors.blue,
+		flex: 1,
 		...fontStyles.fontPrimary
 	},
 	optionIconWrapper: {
@@ -1483,7 +1485,7 @@ export const BrowserTab = props => {
 					<View style={styles.optionIconWrapper}>
 						<Icon name="refresh" size={15} style={styles.optionIcon} />
 					</View>
-					<Text style={styles.optionText} numberOfLines={1}>
+					<Text style={styles.optionText} numberOfLines={2}>
 						{strings('browser.reload')}
 					</Text>
 				</Button>
@@ -1492,7 +1494,7 @@ export const BrowserTab = props => {
 						<View style={styles.optionIconWrapper}>
 							<Icon name="star" size={16} style={styles.optionIcon} />
 						</View>
-						<Text style={styles.optionText} numberOfLines={1}>
+						<Text style={styles.optionText} numberOfLines={2}>
 							{strings('browser.add_to_favorites')}
 						</Text>
 					</Button>
@@ -1501,15 +1503,15 @@ export const BrowserTab = props => {
 					<View style={styles.optionIconWrapper}>
 						<Icon name="share" size={15} style={styles.optionIcon} />
 					</View>
-					<Text style={styles.optionText} numberOfLines={1}>
+					<Text style={styles.optionText} numberOfLines={2}>
 						{strings('browser.share')}
 					</Text>
 				</Button>
 				<Button onPress={openInBrowser} style={styles.option}>
 					<View style={styles.optionIconWrapper}>
 						<Icon name="expand" size={16} style={styles.optionIcon} />
 					</View>
-					<Text style={styles.optionText} numberOfLines={1}>
+					<Text style={styles.optionText} numberOfLines={2}>
 						{strings('browser.open_in_browser')}
 					</Text>
 				</Button>
@@ -1559,7 +1561,7 @@ export const BrowserTab = props => {
 								<View style={styles.optionIconWrapper}>
 									<MaterialCommunityIcon name="earth" size={18} style={styles.optionIcon} />
 								</View>
-								<Text style={styles.optionText} numberOfLines={1}>
+								<Text style={styles.optionText} numberOfLines={2}>
 									{strings('browser.switch_network')}
 								</Text>
 							</Button>

app/components/Views/SendFlow/SendTo/index.js

@@ -3,7 +3,16 @@ import { colors, fontStyles, baseStyles } from '../../../../styles/common';
 import { getSendFlowTitle } from '../../../UI/Navbar';
 import AddressList from './../AddressList';
 import PropTypes from 'prop-types';
-import { StyleSheet, View, TouchableOpacity, Text, TextInput, SafeAreaView, InteractionManager } from 'react-native';
+import {
+	StyleSheet,
+	View,
+	TouchableOpacity,
+	Text,
+	TextInput,
+	SafeAreaView,
+	InteractionManager,
+	ScrollView
+} from 'react-native';
 import { AddressFrom, AddressTo } from './../AddressInputs';
 import Modal from 'react-native-modal';
 import AccountList from '../../../UI/AccountList';
@@ -111,6 +120,7 @@ const styles = StyleSheet.create({
 		justifyContent: 'flex-end'
 	},
 	warningContainer: {
+		marginTop: 20,
 		marginHorizontal: 24,
 		marginBottom: 32
 	},
@@ -567,18 +577,17 @@ class SendFlow extends PureComponent {
 						inputWidth={inputWidth}
 					/>
 				</View>
-				{addressError && (
-					<View style={styles.addressErrorWrapper} testID={'address-error'}>
-						<ErrorMessage
-							errorMessage={addressError}
-							errorContinue={!!errorContinue}
-							onContinue={this.onTransactionDirectionSet}
-							isOnlyWarning={!!isOnlyWarning}
-						/>
-					</View>
-				)}
-
-				<View style={baseStyles.flexGrow}>
+				<ScrollView>
+					{addressError && (
+						<View style={styles.addressErrorWrapper} testID={'address-error'}>
+							<ErrorMessage
+								errorMessage={addressError}
+								errorContinue={!!errorContinue}
+								onContinue={this.onTransactionDirectionSet}
+								isOnlyWarning={!!isOnlyWarning}
+							/>
+						</View>
+					)}
 					{!toSelectedAddressReady ? (
 						<AddressList
 							inputSearch={toSelectedAddress}
@@ -627,7 +636,7 @@ class SendFlow extends PureComponent {
 							</View>
 						</View>
 					)}
-				</View>
+				</ScrollView>
 
 				{this.renderFromAccountModal()}
 				{this.renderAddToAddressBookModal()}

app/components/Views/Settings/SecuritySettings/index.js

@@ -125,6 +125,7 @@ const styles = StyleSheet.create({
 	warningText: {
 		color: colors.black,
 		fontSize: 12,
+		flex: 1,
 		...fontStyles.normal
 	},
 	warningTextRed: {
@@ -138,7 +139,7 @@ const styles = StyleSheet.create({
 		color: colors.blue
 	},
 	viewHint: {
-		marginLeft: 'auto'
+		padding: 5
 	}
 });