auction list page layout completed

components/add_bid_button.component.js

@@ -7,8 +7,8 @@ export const AppAddBid = (props) => {
     <View style={styles.bidContainer}>
       <TextInput style={styles.input} keyboardType='number-pad' placeholder='Enter bid'/>
       <TouchableOpacity onPress={props.onPress} style={styles.bid}>
-      <MaterialIcons name="add" size={16} color={themeColors.WHITE} />
-    </TouchableOpacity>
+        <MaterialIcons name="add" size={16} color={themeColors.WHITE} />
+      </TouchableOpacity>
     </View>
   )
 }

screen/User.Auctions.Screen.js

@@ -3,17 +3,22 @@
 
 // Import React and Component
 import React from 'react';
-import {View, StyleSheet, Text, ScrollView} from 'react-native';
+import {View, StyleSheet, Text, ScrollView, TouchableOpacity} from 'react-native';
 import { AppAuctionItem } from '../components/auction_item.component';
 import { AppContainer } from '../container/container';
 import themeColors from '../assets/colors';
 import { AuctionBottomTab } from '../Navigations/AuctionBottomTab';
-
-const  UserAuctionListScreen =  ({navigation}) => {
+import { MaterialIcons } from '@expo/vector-icons';
+const  UserAuctionListScreen =  (props, {navigation}) => {
   return (
     <View style={styles.container}>
       <AppContainer>
-        <Text style={styles.auctionHeading}>Auctions List</Text>
+        <View style={styles.header}>
+          <Text style={styles.auctionHeading}>Auctions List</Text>
+          <TouchableOpacity onPress={props.onPress} style={styles.addBtn}>
+            <MaterialIcons name="add" size={16} color={themeColors.WHITE} />
+          </TouchableOpacity>
+        </View>
         <ScrollView>
           <View>
             <AppAuctionItem label='Auction Item 1' delete onPress = {() => navigation.navigate("SignUp")}/>
@@ -36,21 +41,25 @@ const styles = StyleSheet.create({
     backgroundColor: '#ffffff'
   },
   header: {
-    height: '35%',
-    marginBottom: 25,
-    backgroundColor : themeColors.PRIMARY_COLOR
-  },
-  btnRowContainer: {
-    maxHeight: 100
-  },
-  contentContainer: {
-    flex: 1,
     flexDirection: 'row',
-    margin: 20
+    justifyContent: 'space-between',
+    height: 50
   },
   auctionHeading: {
     fontSize: 24,
     fontWeight: 'bold',
-    color: themeColors.SECONDARY_COLOR
-  }
+    color: themeColors.BLACK,
+  },
+  addBtn:{
+    alignItems: "center",
+    padding: 8,
+    backgroundColor: themeColors.BLACK,
+    borderRadius: 20,
+    shadowColor: 'rgba(0,0,0, .4)',
+    shadowOffset: { height: 2, width: 1 },
+    shadowOpacity: 1,
+    shadowRadius: 1,
+    elevation: 2,
+    height: 33
+  },
 })
\ No newline at end of file