auction welcome page updated

components/button.component.js

@@ -22,6 +22,7 @@ const styles = StyleSheet.create({
     shadowOpacity: 1,
     shadowRadius: 1,
     elevation: 2,
+    marginVertical: 10
   },
   label: {
     fontFamily: 'Poppins-Black',

components/icon_button.component.js

+import React from 'react';
+import { StyleSheet, TouchableOpacity, Text } from 'react-native';
+import themeColors from '../assets/colors';
+
+export const AppIconButton = (props) => {
+  return(
+    <TouchableOpacity onPress={props.onPress} style={styles.button}>
+      <Text style={styles.label}>{props.label}</Text>
+    </TouchableOpacity>
+  )
+}
+
+const styles = StyleSheet.create({
+  button:{
+    alignItems: "center",
+    padding: 10,
+    fontSize: 16,
+    width: 100,
+    height: 55,
+    backgroundColor: themeColors.PRIMARY_COLOR,
+    borderRadius: 20,
+    shadowColor: 'rgba(0,0,0, .4)',
+    shadowOffset: { height: 2, width: 1 },
+    shadowOpacity: 1,
+    shadowRadius: 1,
+    elevation: 2,
+    marginHorizontal: 5
+  },
+  label: {
+    fontSize: 22,
+    color: themeColors.WHITE
+  }
+});
+

screen/Home.Auction.Screen.js

@@ -6,7 +6,7 @@ import React from 'react';
 import {View, StyleSheet, Image} from 'react-native';
 import { AppButton } from "../components/button.component";
 import { AppTextInput } from '../components/text_input.component';
-import { AppContainer } from '../container/container';
+import { AppIconButton } from '../components/icon_button.component';
 import themeColors from '../assets/colors';
 const  HomeAuctionScreen =  ({navigation}) => {
   return (
@@ -14,7 +14,9 @@ const  HomeAuctionScreen =  ({navigation}) => {
       <View style={styles.header}>
       </View>
       <View style={styles.contentContainer}>
-
+        <AppIconButton label='Buy' onPress = {() => navigation.navigate("SignUp")}/>
+        <AppIconButton label='Sell'/>
+        <AppIconButton label='My Bids'/>
       </View>
     </View>
   );
@@ -34,5 +36,7 @@ const styles = StyleSheet.create({
   },
   contentContainer: {
     flex: 1,
+    flexDirection: 'row',
+    margin: 20
   }
 })
\ No newline at end of file