update bottomTab size, update home screen style

AppNavigation.js

@@ -188,7 +188,7 @@ const BottomNavigationTabs = props => {
 				elevation: 10,
 				elevation: 10,
 			}}
 			}}
 		>
 		>
-			<View style={{ paddingHorizontal: 25 }}>
+			<View style={{ paddingHorizontal: 25, height: 95 }}>
 				<BottomNavigation
 				<BottomNavigation
 					{...props}
 					{...props}
 					style={{ marginTop: 1 }}
 					style={{ marginTop: 1 }}
@@ -213,9 +213,11 @@ const BottomNavigationTabs = props => {
 								return (
 								return (
 									<Icon
 									<Icon
 										style={{
 										style={{
-											marginTop: 5,
+											marginTop: 10,
 											textAlign: 'center',
 											textAlign: 'center',
-											fontSize: 20,
+											fontSize: 25,
+											width: 30,
+											height: 30,
 											color,
 											color,
 										}}
 										}}
 										type={tab.icon.type || 'Ionicons'}
 										type={tab.icon.type || 'Ionicons'}

screens/Private/SmartMeterScreen/SmartMeterScreen.js

@@ -85,25 +85,6 @@ class SmartMeterScreen extends PureComponent {
 
 
 		return !error ? (
 		return !error ? (
 			<>
 			<>
-				<View
-					style={{
-						padding: 15,
-						flexDirection: 'row',
-						alignItems: 'center',
-						backgroundColor: color.defaultBg,
-					}}
-				>
-					<SearchBar
-						containerStyle={styles.searchBarContainer}
-						inputContainerStyle={styles.searchBarInputContainer}
-						inputStyle={styles.searchBarInput}
-						round
-						lightTheme
-						placeholder="Search..."
-						onChangeText={text => this.updateSearch(text)}
-						value={this.state.search}
-					/>
-				</View>
 				<FlatList
 				<FlatList
 					refreshControl={
 					refreshControl={
 						<RefreshControl
 						<RefreshControl
@@ -129,7 +110,19 @@ class SmartMeterScreen extends PureComponent {
 						</View>
 						</View>
 					)}
 					)}
 					ListHeaderComponent={() => (
 					ListHeaderComponent={() => (
-						<Text style={[theme.smallTitle, theme.textDark, { marginBottom: 10 }]}>Smart Device</Text>
+						<>
+							<Text style={[theme.smallTitle, theme.textDark, { marginBottom: 10 }]}>Smart Device</Text>
+
+							<SearchBar
+								containerStyle={styles.searchBarContainer}
+								inputContainerStyle={styles.searchBarInputContainer}
+								inputStyle={theme.normalText}
+								lightTheme
+								placeholder="Search..."
+								onChangeText={text => this.updateSearch(text)}
+								value={this.state.search}
+							/>
+						</>
 					)}
 					)}
 					renderItem={(item, index) => this.renderItem(item)}
 					renderItem={(item, index) => this.renderItem(item)}
 				/>
 				/>
@@ -147,24 +140,23 @@ const styles = StyleSheet.create({
 		flex: 1,
 		flex: 1,
 		display: 'flex',
 		display: 'flex',
 		backgroundColor: 'transparent',
 		backgroundColor: 'transparent',
-		height: 30,
-		paddingVertical: 0,
+		height: 40,
+		padding: 0,
 		borderTopWidth: 0,
 		borderTopWidth: 0,
 		borderBottomWidth: 0,
 		borderBottomWidth: 0,
+		marginTop: 10,
+		marginBottom: 15,
+		marginHorizontal: 0,
 	},
 	},
 	searchBarInputContainer: {
 	searchBarInputContainer: {
+		borderRadius: 100,
 		borderWidth: 1,
 		borderWidth: 1,
 		borderBottomWidth: 1,
 		borderBottomWidth: 1,
 		backgroundColor: 'transparent',
 		backgroundColor: 'transparent',
 		minHeight: 10,
 		minHeight: 10,
-		height: 30,
+		height: 40,
 		borderColor: '#c7cad1',
 		borderColor: '#c7cad1',
 	},
 	},
-	searchBarInput: {
-		fontFamily: 'Avenir-Roman',
-		fontSize: 12,
-		color: color.grey,
-	},
 });
 });
 
 
 const mapStateToProps = state => ({
 const mapStateToProps = state => ({