fix layout

4 files changed, 11 insertions, 3 deletions

diff --git a/src/components/search/SearchCategories.tsx b/src/components/search/SearchCategories.tsx
index 3096b343..2883a541 100644
--- a/src/components/search/SearchCategories.tsx
+++ b/src/components/search/SearchCategories.tsx
@@ -25,6 +25,7 @@ const SearchCategories: React.FC = () => {
       {buttons &&
         buttons.map((searchCategory) => (
           <LinearGradient
+            key={searchCategory.id}
             colors={[TAGG_PURPLE, TAGG_LIGHT_BLUE_2]}
             start={{x: 0.0, y: 1.0}}
             end={{x: 1.0, y: 1.0}}
diff --git a/src/components/search/SearchResultList.tsx b/src/components/search/SearchResultList.tsx
index a3d9c8c5..14d5de6d 100644
--- a/src/components/search/SearchResultList.tsx
+++ b/src/components/search/SearchResultList.tsx
@@ -71,6 +71,7 @@ const SearchResultList: React.FC<SearchResultsProps> = ({
 const styles = StyleSheet.create({
   container: {
     marginTop: SCREEN_HEIGHT * 0.02,
+    height: SCREEN_HEIGHT,
   },
   sectionHeaderStyle: {
     width: '100%',
@@ -78,7 +79,9 @@ const styles = StyleSheet.create({
     marginBottom: normalize(24),
     backgroundColor: '#C4C4C4',
   },
-  keyboardOpen: {marginBottom: SCREEN_HEIGHT * 0.3},
+  keyboardOpen: {
+    marginBottom: SCREEN_HEIGHT * 0.35,
+  },
   noResultsTextContainer: {
     justifyContent: 'center',
     flexDirection: 'row',
diff --git a/src/components/search/SearchResultsBackground.tsx b/src/components/search/SearchResultsBackground.tsx
index c5fcc6fb..f6f40f52 100644
--- a/src/components/search/SearchResultsBackground.tsx
+++ b/src/components/search/SearchResultsBackground.tsx
@@ -41,7 +41,7 @@ const styles = StyleSheet.create({
     paddingBottom: SCREEN_HEIGHT / 15,
   },
   results: {
-    marginTop: StatusBarHeight + 110,
+    marginTop: StatusBarHeight,
   },
 });
 export default SearchResultsBackground;
diff --git a/src/screens/search/SearchScreen.tsx b/src/screens/search/SearchScreen.tsx
index 3b73229f..223fc2b2 100644
--- a/src/screens/search/SearchScreen.tsx
+++ b/src/screens/search/SearchScreen.tsx
@@ -175,8 +175,12 @@ const SearchScreen: React.FC = () => {
 };
 
 const styles = StyleSheet.create({
-  mainContainer: {backgroundColor: '#fff', height: SCREEN_HEIGHT},
+  mainContainer: {
+    backgroundColor: '#fff',
+    height: SCREEN_HEIGHT,
+  },
   contentContainer: {
+    height: SCREEN_HEIGHT * 0.9,
     paddingTop: '2%',
     paddingBottom: SCREEN_HEIGHT / 3,
     paddingHorizontal: '3%',