[APP-674] Fix search results tab bar (#822)

* fix search results tab bar

* Fix spacing on web

---------

Co-authored-by: Paul Frazee <pfrazee@gmail.com>

1 files changed, 25 insertions, 4 deletions

diff --git a/src/view/com/search/SearchResults.tsx b/src/view/com/search/SearchResults.tsx
index ca6a0dba2..74d6e2ef0 100644
--- a/src/view/com/search/SearchResults.tsx
+++ b/src/view/com/search/SearchResults.tsx
@@ -14,6 +14,7 @@ import {
 import {Text} from 'view/com/util/text/Text'
 import {usePalette} from 'lib/hooks/usePalette'
 import {s} from 'lib/styles'
+import {isDesktopWeb} from 'platform/detection'
 
 const SECTIONS = ['Posts', 'Users']
 
@@ -24,7 +25,12 @@ export const SearchResults = observer(({model}: {model: SearchUIModel}) => {
     (props: RenderTabBarFnProps) => {
       return (
         <CenteredView style={[pal.border, styles.tabBar]}>
-          <TabBar {...props} items={SECTIONS} />
+          <TabBar
+            items={SECTIONS}
+            {...props}
+            key={SECTIONS.join()}
+            indicatorColor={pal.colors.link}
+          />
         </CenteredView>
       )
     },
@@ -33,8 +39,12 @@ export const SearchResults = observer(({model}: {model: SearchUIModel}) => {
 
   return (
     <Pager renderTabBar={renderTabBar} tabBarPosition="top" initialPage={0}>
-      <PostResults key="0" model={model} />
-      <Profiles key="1" model={model} />
+      <View style={[styles.results]}>
+        <PostResults key="0" model={model} />
+      </View>
+      <View style={[styles.results]}>
+        <Profiles key="1" model={model} />
+      </View>
     </Pager>
   )
 })
@@ -60,7 +70,7 @@ const PostResults = observer(({model}: {model: SearchUIModel}) => {
   }
 
   return (
-    <ScrollView style={pal.view}>
+    <ScrollView style={[pal.view]}>
       {model.posts.map(post => (
         <Post
           key={post.resolvedUri}
@@ -111,9 +121,20 @@ const Profiles = observer(({model}: {model: SearchUIModel}) => {
 const styles = StyleSheet.create({
   tabBar: {
     borderBottomWidth: 1,
+    position: 'absolute',
+    zIndex: 1,
+    left: 0,
+    right: 0,
+    top: 0,
+    flexDirection: 'column',
+    alignItems: 'center',
+    backgroundColor: 'white',
   },
   empty: {
     paddingHorizontal: 14,
     paddingVertical: 16,
   },
+  results: {
+    paddingTop: isDesktopWeb ? 50 : 42,
+  },
 })