Merge branch 'develop' into new_UI&bug_fixed

BitPortal · Dec 17, 2018 · 9109950 · 9109950
2 parents bf6d852 + ac32ae4
commit 9109950
Show file tree

Hide file tree

Showing 21 changed files with 203 additions and 130 deletions.
diff --git a/mobile/index.js b/mobile/index.js
@@ -106,7 +106,7 @@ export const currentComponentID = () => visibleComponentID
 Linking.addEventListener('url', event => handleOpenURL(event, currentComponentID()))
 
 Navigation.events().registerComponentDidAppearListener(({ componentId, componentName }) => {
-  console.log('componentdidAppearr', componentId, componentName)
+  // console.log('componentdidAppearr', componentId, componentName)
   visibleComponentID = componentId
   currentComponentID()
 })

diff --git a/shared/components/AccordionPanel/styles.ts b/shared/components/AccordionPanel/styles.ts
@@ -11,7 +11,7 @@ const styles = StyleSheet.create({
   container: {
     width: SCREEN_WIDTH,
     height: SCREEN_HEIGHT,
-    backgroundColor: Colors.mainThemeColor
+    backgroundColor: Colors.minorThemeColor
   },
   scrollContainer: {
     width: SCREEN_WIDTH,

diff --git a/shared/components/Form/SearchWebsiteForm/index.native.jsx b/shared/components/Form/SearchWebsiteForm/index.native.jsx
@@ -1,38 +1,43 @@
 import React, { Component } from 'react'
+import { View } from 'react-native'
 import { connect } from 'react-redux'
 import { Field, reduxForm } from 'redux-form/immutable'
 import { SearchContainer, SearchField } from 'components/Form'
+import { LinkingRightButton, WebViewLeftButton } from 'components/NavigationBar'
 import Colors from 'resources/colors'
 import { SCREEN_WIDTH } from 'utils/dimens'
+import Ionicons from 'react-native-vector-icons/Ionicons'
+
 // import Ionicons from 'react-native-vector-icons/Ionicons'
 // import messages from './messages'
 
 @reduxForm({
   form: 'searchWebsiteForm'
 })
-
-@connect(
-  state => ({
-    locale: state.intl.get('locale')
-  })
-)
-
+@connect(state => ({
+  locale: state.intl.get('locale')
+}))
 export default class SearchWebsiteForm extends Component {
   render() {
     const { onSubmitEditing } = this.props
 
     return (
-      <SearchContainer style={{ width: SCREEN_WIDTH - 100 }}>
-        <Field
-          name="searchTerm"
-          component={SearchField}
-          placeholder="Search or enter website url"
-          placeholderTextColor={Colors.textColor_181_181_181}
-          numberOfLines={1}
-          returnKeyType="go"
-          onSubmitEditing={onSubmitEditing}
-        />
-      </SearchContainer>
+      <View style={{ justifyContent: 'flex-start', width: SCREEN_WIDTH }}>
+        <SearchContainer style={{ width: SCREEN_WIDTH - 150, justifyContent: 'flex-start' }}>
+          <Field
+            name="searchTerm"
+            component={SearchField}
+            placeholder="Search or enter website url"
+            placeholderTextColor={Colors.textColor_181_181_181}
+            numberOfLines={1}
+            returnKeyType="go"
+            onSubmitEditing={onSubmitEditing}
+          />
+        </SearchContainer>
+        <View style={{ position: 'absolute', top: 0, right: 100 }}>
+          <LinkingRightButton iconName="ios-more" onPress={this.props.showBrowserMenu} />
+        </View>
+      </View>
     )
   }
 }
diff --git a/shared/components/Form/TransferAssetsForm/index.native.jsx b/shared/components/Form/TransferAssetsForm/index.native.jsx
@@ -194,6 +194,7 @@ export default class TransferAssetsForm extends Component {
       transfer,
       locale,
       accountName,
+      toAccount,
       amount,
       memo
     } = this.props
@@ -213,7 +214,7 @@ export default class TransferAssetsForm extends Component {
             name="toAccount"
             component={TextField}
             rightContent={<ContactIcon onPress={this.getContactInfo} />}
-            props={{ value: accountName }}
+            props={{ value: toAccount }}
           />
           <Field
             label={messages[locale].send_label_amount}

diff --git a/shared/components/Form/styles.ts b/shared/components/Form/styles.ts
@@ -48,7 +48,7 @@ export default EStyleSheet.create({
   },
   searchFieldInput: {
     minHeight: FontScale(24),
-    paddingVertical: 10,
+    paddingVertical: Platform.OS === 'ios' ? 10 : 0,
     backgroundColor: 'black',
     borderRadius: 3,
     flexDirection: 'row',

diff --git a/shared/screens/Assets/AssetChart/RecordItem/index.jsx b/shared/screens/Assets/AssetChart/RecordItem/index.jsx
@@ -4,16 +4,24 @@ import BPImage from 'components/BPNativeComponents/BPImage'
 import Colors from 'resources/colors'
 import Images from 'resources/images'
 import { FormattedNumber, FormattedRelative } from 'react-intl'
-import { FontScale, SCREEN_WIDTH } from 'utils/dimens'
+import { FontScale, SCREEN_WIDTH, FLOATING_CARD_WIDTH, FLOATING_CARD_BORDER_RADIUS } from 'utils/dimens'
 import LinearGradientContainer from 'components/LinearGradientContainer'
 
 const styles = StyleSheet.create({
   container: {
     width: SCREEN_WIDTH,
     height: 70,
-    backgroundColor: Colors.bgColor_30_31_37,
-    borderBottomColor: Colors.mainThemeColor,
-    borderBottomWidth: StyleSheet.hairlineWidth
+    backgroundColor: Colors.mainThemeColor,
+    borderBottomColor: Colors.minorThemeColor,
+    borderBottomWidth: StyleSheet.hairlineWidth,
+    alignItems: 'center'
+  },
+  recordContainer: {
+    backgroundColor: Colors.minorThemeColor,
+    width: FLOATING_CARD_WIDTH,
+    paddingTop: 10,
+    paddingBottom: 10,
+    borderRadius: FLOATING_CARD_BORDER_RADIUS
   },
   between: {
     alignItems: 'center',
@@ -75,7 +83,7 @@ export default ({ item, onPress, eosAccountName }) => {
       underlayColor={Colors.hoverColor}
       onPress={() => onPress(item)}
     >
-      <View style={[styles.container, styles.between, { paddingHorizontal: 20 }]}>
+      <View style={[styles.recordContainer, styles.between, { paddingHorizontal: 20 }]}>
         <View style={{ alignItems: 'center', flexDirection: 'row' }}>
           <GradientIcon isReceiver={isReceiver} />
           <View style={{ marginLeft: 10 }}>

diff --git a/shared/screens/Assets/AssetChart/index.jsx b/shared/screens/Assets/AssetChart/index.jsx
@@ -145,11 +145,11 @@ export default class AssetChart extends Component {
 
     if (loaded && hasMore) {
       return (
-        <ActivityIndicator style={{ marginVertical: 10 }} size="small" color="white" />
+        <ActivityIndicator style={{ marginVertical: 5 }} size="small" color="white" />
       )
     } else if (loaded) {
       return (
-        <Text style={{ marginVertical: 10, alignSelf: 'center', color: 'white' }}>
+        <Text style={{ marginVertical: 5, alignSelf: 'center', color: 'white' }}>
           {messages[locale].transaction_list_text_no_data}
         </Text>
       )

diff --git a/shared/screens/Assets/AssetChart/styles.js b/shared/screens/Assets/AssetChart/styles.js
@@ -1,12 +1,13 @@
 import { StyleSheet } from 'react-native'
 import Colors from 'resources/colors'
-import { FontScale, SCREEN_WIDTH, SCREEN_HEIGHT, NAV_BAR_HEIGHT, ifIphoneX, TAB_BAR_HEIGHT } from 'utils/dimens'
+import { FontScale, SCREEN_WIDTH, SCREEN_HEIGHT, NAV_BAR_HEIGHT, ifIphoneX, TAB_BAR_HEIGHT, FLOATING_CARD_WIDTH, FLOATING_CARD_BORDER_RADIUS } from 'utils/dimens'
 
 const styles = StyleSheet.create({
   container: {
     width: SCREEN_WIDTH,
     height: SCREEN_HEIGHT,
-    backgroundColor: Colors.mainThemeColor
+    backgroundColor: Colors.mainThemeColor,
+    alignItems: 'center',
   },
   between: {
     alignItems: 'center',

diff --git a/shared/screens/Assets/AssetSearch/index.jsx b/shared/screens/Assets/AssetSearch/index.jsx
@@ -83,8 +83,7 @@ export default class AssetsSearch extends Component {
     const current_supply = item.get('current_supply')
     const max_supply = item.get('max_supply')
     const icon_url = item.get('icon_url')
-    const rank_url = item.get('rank_url')
-    this.props.actions.toggleEOSAsset({ contract, symbol, current_supply, max_supply, icon_url, rank_url })
+    this.props.actions.toggleEOSAsset({ contract, symbol, current_supply, max_supply, icon_url})
   }
 
   renderItem = (type, item) => (

diff --git a/shared/screens/Assets/AssetsTransfer/styles.js b/shared/screens/Assets/AssetsTransfer/styles.js
@@ -1,6 +1,6 @@
 import { StyleSheet } from 'react-native'
 import Colors from 'resources/colors'
-import { SCREEN_WIDTH, SCREEN_HEIGHT, NAV_BAR_HEIGHT, KEYBOARD_HEIGHT } from 'utils/dimens'
+import { SCREEN_WIDTH, SCREEN_HEIGHT, NAV_BAR_HEIGHT, KEYBOARD_HEIGHT, TAB_BAR_HEIGHT } from 'utils/dimens'
 
 const styles = StyleSheet.create({
   container: {
@@ -10,7 +10,8 @@ const styles = StyleSheet.create({
   },
   scrollContainer: {
     width: SCREEN_WIDTH,
-    height: SCREEN_HEIGHT - NAV_BAR_HEIGHT
+    height: SCREEN_HEIGHT - NAV_BAR_HEIGHT - TAB_BAR_HEIGHT,
+    backgroundColor: Colors.mainThemeColor
   },
   keyboard: {
     width: SCREEN_WIDTH,

diff --git a/shared/screens/Assets/AvailableAssets/index.jsx b/shared/screens/Assets/AvailableAssets/index.jsx
@@ -102,8 +102,7 @@ export default class AvailableAssets extends Component {
     const current_supply = item.get('current_supply')
     const max_supply = item.get('max_supply')
     const icon_url = item.get('icon_url')
-    const rank_url = item.get('rank_url')
-    this.props.actions.toggleEOSAsset({ contract, symbol, current_supply, max_supply, icon_url, rank_url })
+    this.props.actions.toggleEOSAsset({ contract, symbol, current_supply, max_supply, icon_url})
   }
 
   renderItem = (type, item) => (

diff --git a/shared/screens/Assets/BalanceList/index.jsx b/shared/screens/Assets/BalanceList/index.jsx
@@ -50,7 +50,7 @@ export default class BalanceList extends Component {
     const { data, onPress, eosPrice, isAssetHidden, eosCoreLiquidBalance } = this.props
 
     return (
-      <View>
+      <View style={styles.balanceListContainer}>
         <ListItem
           item={eosCoreLiquidBalance}
           isAssetHidden={isAssetHidden}

diff --git a/shared/screens/Assets/BalanceList/styles.js b/shared/screens/Assets/BalanceList/styles.js
@@ -1,17 +1,17 @@
 import { StyleSheet, Platform } from 'react-native'
-import { FontScale, SCREEN_WIDTH, SCREEN_HEIGHT, NAV_BAR_HEIGHT, TAB_BAR_HEIGHT } from 'utils/dimens'
+import { FontScale, SCREEN_WIDTH, SCREEN_HEIGHT, NAV_BAR_HEIGHT, TAB_BAR_HEIGHT, FLOATING_CARD_WIDTH, FLOATING_CARD_BORDER_RADIUS } from 'utils/dimens'
 import Colors from 'resources/colors'
 
 const styles = StyleSheet.create({
   container: {
     width: SCREEN_WIDTH,
     height: SCREEN_HEIGHT,
-    backgroundColor: Colors.minorThemeColor
+    backgroundColor: Colors.mainThemeColor
   },
   headerContainer: {
     width: SCREEN_WIDTH,
     height: NAV_BAR_HEIGHT,
-    backgroundColor: Colors.minorThemeColor,
+    backgroundColor: Colors.mainThemeColor,
     paddingTop: Platform.OS === 'ios' ? 20 : 0
   },
   navButton: {
@@ -45,27 +45,31 @@ const styles = StyleSheet.create({
     fontWeight: 'bold',
     color: Colors.textColor_255_255_238
   },
-  addAssetsContainer: {
-    width: SCREEN_WIDTH,
-    height: 50
-  },
   scrollContainer: {
     width: SCREEN_WIDTH,
     height: SCREEN_HEIGHT - NAV_BAR_HEIGHT - TAB_BAR_HEIGHT,
     backgroundColor: Colors.mainThemeColor
   },
-  listContainer: {
-    width: SCREEN_WIDTH,
-    height: 70,
-    marginTop: 1
+  balanceListContainer: {
+    width: FLOATING_CARD_WIDTH,
+    backgroundColor: Colors.minorThemeColor,
+    alignItems: 'center',
+    paddingBottom: 20,
+    borderBottomLeftRadius: FLOATING_CARD_BORDER_RADIUS,
+    borderBottomRightRadius: FLOATING_CARD_BORDER_RADIUS
   },
-  createAccountContainer: {
-    width: SCREEN_WIDTH - 64,
-    height: (SCREEN_WIDTH / 2) - 32,
-    borderRadius: 12,
-    marginHorizontal: 32,
-    marginVertical: 20,
-    backgroundColor: Colors.mainThemeColor
+  listContainer: {
+    width: FLOATING_CARD_WIDTH,
+    height: 60,
+    marginTop: 1,
+    // borderBottomWidth: 1,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-around',
+    borderTopWidth: 1,
+    borderTopColor: Colors.mainThemeColor
+    // borderRadius: FLOATING_CARD_BORDER_RADIUS,
+    // marginVertical: 5,
   },
   image: {
     width: 36,

diff --git a/shared/screens/Assets/EnableAssets/index.jsx b/shared/screens/Assets/EnableAssets/index.jsx
@@ -16,8 +16,7 @@ export default class EnableAssets extends Component {
       <View
         style={[
           styles.addAssetsContainer,
-          styles.between,
-          { paddingHorizontal: 20, backgroundColor: Colors.minorThemeColor }
+          styles.between
         ]}
       >
         <View
@@ -26,7 +25,7 @@ export default class EnableAssets extends Component {
             alignItems: 'center'
           }}
         >
-          <Text style={styles.text14}> {Title} </Text>
+          <Text style={styles.text20}> {Title} </Text>
         </View>
         <TouchableOpacity onPress={onPress}>
           <Ionicons

diff --git a/shared/screens/Assets/EnableAssets/styles.js b/shared/screens/Assets/EnableAssets/styles.js
@@ -1,19 +1,8 @@
 import { StyleSheet, Platform } from 'react-native'
-import { FontScale, SCREEN_WIDTH, SCREEN_HEIGHT, NAV_BAR_HEIGHT, TAB_BAR_HEIGHT } from 'utils/dimens'
+import { FontScale, SCREEN_WIDTH, SCREEN_HEIGHT, NAV_BAR_HEIGHT, TAB_BAR_HEIGHT, FLOATING_CARD_WIDTH, FLOATING_CARD_BORDER_RADIUS } from 'utils/dimens'
 import Colors from 'resources/colors'
 
 const styles = StyleSheet.create({
-  container: {
-    width: SCREEN_WIDTH,
-    height: SCREEN_HEIGHT,
-    backgroundColor: Colors.minorThemeColor
-  },
-  headerContainer: {
-    width: SCREEN_WIDTH,
-    height: NAV_BAR_HEIGHT,
-    backgroundColor: Colors.minorThemeColor,
-    paddingTop: Platform.OS === 'ios' ? 20 : 0
-  },
   navButton: {
     minWidth: 100,
     height: 40,
@@ -33,7 +22,7 @@ const styles = StyleSheet.create({
   },
   text14: {
     fontSize: FontScale(14),
-    color: Colors.textColor_89_185_226
+    color: Colors.white
   },
   text20: {
     fontSize: FontScale(20),
@@ -46,18 +35,30 @@ const styles = StyleSheet.create({
     color: Colors.textColor_255_255_238
   },
   addAssetsContainer: {
-    width: SCREEN_WIDTH,
-    height: 50
+    width: FLOATING_CARD_WIDTH,
+    height: 50,
+    paddingHorizontal: 20,
+    backgroundColor: Colors.minorThemeColor,
+    borderTopLeftRadius: FLOATING_CARD_BORDER_RADIUS,
+    borderTopRightRadius: FLOATING_CARD_BORDER_RADIUS,
   },
   scrollContainer: {
     width: SCREEN_WIDTH,
     height: SCREEN_HEIGHT - NAV_BAR_HEIGHT - TAB_BAR_HEIGHT,
     backgroundColor: Colors.mainThemeColor
   },
   listContainer: {
-    width: SCREEN_WIDTH,
-    height: 70,
-    marginTop: 1
+    width: FLOATING_CARD_WIDTH,
+    height: 60,
+    marginTop: 1,
+    borderBottomColor: Colors.minorThemeColor,
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-around',
+    backgroundColor: Colors.bgColor_30_31_37,
+    borderRadius: FLOATING_CARD_BORDER_RADIUS,
+    marginVertical: 5,
+    marginLeft: 10
   },
   createAccountContainer: {
     width: SCREEN_WIDTH - 64,