From 973c8a03681724f2e303fcd021301764bfc4717c Mon Sep 17 00:00:00 2001
From: Leon Jiang <35908040+leonyjiang@users.noreply.github.com>
Date: Mon, 8 Mar 2021 06:40:16 -0500
Subject: Fix minor styling issues

---
 src/components/search/RecentSearches.tsx          | 24 +++++++++++------------
 src/components/search/SearchResultCell.tsx        |  2 +-
 src/components/search/SearchResultList.tsx        |  1 -
 src/components/search/SearchResultsBackground.tsx | 14 ++++---------
 4 files changed, 17 insertions(+), 24 deletions(-)

(limited to 'src/components')

diff --git a/src/components/search/RecentSearches.tsx b/src/components/search/RecentSearches.tsx
index 89379596..b4cc5483 100644
--- a/src/components/search/RecentSearches.tsx
+++ b/src/components/search/RecentSearches.tsx
@@ -19,7 +19,6 @@ import {SCREEN_HEIGHT} from '../../utils';
 
 interface RecentSearchesProps extends TouchableOpacityProps {
   sectionTitle: PreviewType;
-  sectionButtonTitle: string;
   recents: Array<ProfilePreviewType>;
   recentCategories: CategoryPreviewType[];
   screenType: ScreenType;
@@ -28,7 +27,6 @@ interface RecentSearchesProps extends TouchableOpacityProps {
 const RecentSearches: React.FC<RecentSearchesProps> = (props) => {
   const {
     sectionTitle,
-    sectionButtonTitle,
     recents,
     recentCategories,
     screenType,
@@ -36,14 +34,12 @@ const RecentSearches: React.FC<RecentSearchesProps> = (props) => {
   return (
     <ScrollView
       style={styles.mainContainer}
-      contentContainerStyle={{paddingBottom: SCREEN_HEIGHT * 0.1}}>
-      <View style={styles.container}>
+      contentContainerStyle={styles.contentContainer}>
+      <View style={styles.header}>
         <Text style={styles.title}>{sectionTitle}</Text>
-        {sectionButtonTitle && (
-          <TouchableOpacity {...props}>
-            <Text style={styles.clear}>Clear all</Text>
-          </TouchableOpacity>
-        )}
+        <TouchableOpacity {...props}>
+          <Text style={styles.clear}>Clear all</Text>
+        </TouchableOpacity>
       </View>
       <SearchResults
         results={recents}
@@ -57,16 +53,20 @@ const RecentSearches: React.FC<RecentSearchesProps> = (props) => {
 
 const styles = StyleSheet.create({
   mainContainer: {
-    marginLeft: '3%',
+    flexGrow: 1,
+  },
+  contentContainer: {
+    paddingBottom: SCREEN_HEIGHT * 0.1,
   },
-  container: {
+  header: {
+    paddingHorizontal: 25,
+    paddingVertical: 5,
     flexDirection: 'row',
   },
   title: {
     fontSize: 18,
     fontWeight: '600',
     flexGrow: 1,
-    marginBottom: '5%',
   },
   clear: {
     fontSize: 18,
diff --git a/src/components/search/SearchResultCell.tsx b/src/components/search/SearchResultCell.tsx
index 30675a74..e0351d96 100644
--- a/src/components/search/SearchResultCell.tsx
+++ b/src/components/search/SearchResultCell.tsx
@@ -167,7 +167,7 @@ const SearchResultsCell: React.FC<SearchResults> = ({
 const styles = StyleSheet.create({
   cellContainer: {
     flexDirection: 'row',
-    paddingHorizontal: 0,
+    paddingHorizontal: 25,
     paddingVertical: 15,
   },
   imageContainer: {
diff --git a/src/components/search/SearchResultList.tsx b/src/components/search/SearchResultList.tsx
index 14d5de6d..41c8c8b2 100644
--- a/src/components/search/SearchResultList.tsx
+++ b/src/components/search/SearchResultList.tsx
@@ -70,7 +70,6 @@ const SearchResultList: React.FC<SearchResultsProps> = ({
 
 const styles = StyleSheet.create({
   container: {
-    marginTop: SCREEN_HEIGHT * 0.02,
     height: SCREEN_HEIGHT,
   },
   sectionHeaderStyle: {
diff --git a/src/components/search/SearchResultsBackground.tsx b/src/components/search/SearchResultsBackground.tsx
index 94f5d59f..25dcf781 100644
--- a/src/components/search/SearchResultsBackground.tsx
+++ b/src/components/search/SearchResultsBackground.tsx
@@ -21,7 +21,7 @@ const SearchResultsBackground: React.FC<SearchResultsBackgroundProps> = ({
   return (
     <Animated.View
       style={[styles.container, {opacity: opacityBackground, top}]}>
-      <Animated.View style={[styles.results, {opacity: opacityContent}]}>
+      <Animated.View style={{opacity: opacityContent}}>
         {children}
       </Animated.View>
     </Animated.View>
@@ -33,16 +33,10 @@ const styles = StyleSheet.create({
     height: SCREEN_HEIGHT,
     width: SCREEN_WIDTH,
     position: 'absolute',
-    backgroundColor: '#fff',
-    paddingHorizontal: 25,
+    backgroundColor: 'white',
+    paddingTop: 60,
+    paddingBottom: 10,
     zIndex: 0,
   },
-  contentContainer: {
-    flexGrow: 1,
-    paddingBottom: SCREEN_HEIGHT / 15,
-  },
-  results: {
-    marginTop: StatusBarHeight,
-  },
 });
 export default SearchResultsBackground;
-- 
cgit v1.2.3-70-g09d2