styling groceries a little better

src/pages/HomePage.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { View } from 'react-native'
+import { ScrollView, View } from 'react-native'
 import HeaderPadding from '../components/Header'
 
 //components
@@ -13,7 +13,7 @@ import { Wrapper, WrapperBoard, WrapperRight, WrapperLeft } from './styles/HomeP
 
 const HomePage = () => {
     return (
-        <View style={{flex: 1}}>
+        <ScrollView>
             <HeaderPadding/>
             <Wrapper>
                 <WrapperBoard>
@@ -25,7 +25,7 @@ const HomePage = () => {
                     </WrapperRight>
                 </WrapperBoard>
             </Wrapper>
-        </View>
+        </ScrollView>
     )
 }
 

src/pages/groceryList/GroceryListPage.js

@@ -13,7 +13,7 @@ const GroceryListPage = () => {
             {
                 currentTab === "Groceries" ? <Groceries /> : <Products />
             }
-            <TabMenu currentTab={currentTab} setCurrentTab={setCurrentTab} />
+            {/* <TabMenu currentTab={currentTab} setCurrentTab={setCurrentTab} /> */}
         </WrapperGroceryPage>
     )
 }

src/pages/recipes/AddRecipe.js

@@ -70,7 +70,7 @@ const AddRecipe = () => {
                 {image && <StyledImage src={image} alt="Recipe" />}
                 <WrapperRecipe>
                     <View id="row">
-                        <IconRecipe />
+                        {/* <IconRecipe /> */}
                         <Input
                             type="text"
                             value={name}
@@ -78,13 +78,13 @@ const AddRecipe = () => {
                             placeholder="Recipe name" />
                     </View>
                     <View id="row">
-                        <IconPot />
+                        {/* <IconPot /> */}
                         <Input
                             type="number"
                             value={prepTime}
                             onChange={(text) => setPrepTime(text.target.value)}
                             placeholder="Prep time (min)" />
-                        <IconMeal />
+                        {/* <IconMeal /> */}
                         <Input
                             type="number"
                             value={servings}
@@ -92,7 +92,7 @@ const AddRecipe = () => {
                             placeholder="Servings" />
                     </View>
                     <View id="row">
-                        <IconImage />
+                        {/* <IconImage /> */}
                         <Input
                             style={{ borderBottom: 'none' }}
                             type="file" accept="image/*"

src/pages/recipes/Recipe.js

@@ -37,7 +37,7 @@ const Recipe = () => {
                     <Hr />
                     {recipe.prepTime !== 0 && recipe.prepTime && <>
                         <View id="row" style={{ position: 'relative', marginTop: 0 }} >
-                            <IconPotLarge />
+                            {/* <IconPotLarge /> */}
                             <TextPrep>READY IN:</TextPrep>
                             <View id="column" >
                                 <TextTime>{recipe.prepTime}</TextTime>
@@ -45,7 +45,7 @@ const Recipe = () => {
                             </View>
                             {recipe.servings !== 0 && recipe.servings && <>
                                 <WrapperServings>
-                                    <IconMeal />
+                                    {/* <IconMeal /> */}
                                     <View>
                                         <TextTime>{recipe.servings}</TextTime>
                                         <TextServings>servings</TextServings>