From 674153c7258da7454dde649c920b29937c8e0ba8 Mon Sep 17 00:00:00 2001
From: Samuel Newman <mozzius@protonmail.com>
Date: Wed, 18 Dec 2024 20:15:05 +0000
Subject: [PATCH] move header inside sticky area (#7163)

---
 src/screens/Hashtag.tsx | 48 ++++++++++++++++++++---------------------
 src/screens/Topic.tsx   | 38 ++++++++++++++++----------------
 2 files changed, 43 insertions(+), 43 deletions(-)

diff --git a/src/screens/Hashtag.tsx b/src/screens/Hashtag.tsx
index 83eb5b80da..fd1bdffa73 100644
--- a/src/screens/Hashtag.tsx
+++ b/src/screens/Hashtag.tsx
@@ -107,34 +107,34 @@ export default function HashtagScreen({
 
   return (
     <Layout.Screen>
-      <Layout.Header.Outer noBottomBorder>
-        <Layout.Header.BackButton />
-        <Layout.Header.Content>
-          <Layout.Header.TitleText>{headerTitle}</Layout.Header.TitleText>
-          {author && (
-            <Layout.Header.SubtitleText>
-              {_(msg`From @${sanitizedAuthor}`)}
-            </Layout.Header.SubtitleText>
-          )}
-        </Layout.Header.Content>
-        <Layout.Header.Slot>
-          <Button
-            label={_(msg`Share`)}
-            size="small"
-            variant="ghost"
-            color="primary"
-            shape="round"
-            onPress={onShare}
-            hitSlop={HITSLOP_10}
-            style={[{right: -3}]}>
-            <ButtonIcon icon={Share} size="md" />
-          </Button>
-        </Layout.Header.Slot>
-      </Layout.Header.Outer>
       <Pager
         onPageSelected={onPageSelected}
         renderTabBar={props => (
           <Layout.Center style={[a.z_10, web([a.sticky, {top: 0}])]}>
+            <Layout.Header.Outer noBottomBorder>
+              <Layout.Header.BackButton />
+              <Layout.Header.Content>
+                <Layout.Header.TitleText>{headerTitle}</Layout.Header.TitleText>
+                {author && (
+                  <Layout.Header.SubtitleText>
+                    {_(msg`From @${sanitizedAuthor}`)}
+                  </Layout.Header.SubtitleText>
+                )}
+              </Layout.Header.Content>
+              <Layout.Header.Slot>
+                <Button
+                  label={_(msg`Share`)}
+                  size="small"
+                  variant="ghost"
+                  color="primary"
+                  shape="round"
+                  onPress={onShare}
+                  hitSlop={HITSLOP_10}
+                  style={[{right: -3}]}>
+                  <ButtonIcon icon={Share} size="md" />
+                </Button>
+              </Layout.Header.Slot>
+            </Layout.Header.Outer>
             <TabBar items={sections.map(section => section.title)} {...props} />
           </Layout.Center>
         )}
diff --git a/src/screens/Topic.tsx b/src/screens/Topic.tsx
index 6cd69f05f2..62726bcc6f 100644
--- a/src/screens/Topic.tsx
+++ b/src/screens/Topic.tsx
@@ -88,29 +88,29 @@ export default function TopicScreen({
 
   return (
     <Layout.Screen>
-      <Layout.Header.Outer noBottomBorder>
-        <Layout.Header.BackButton />
-        <Layout.Header.Content>
-          <Layout.Header.TitleText>{headerTitle}</Layout.Header.TitleText>
-        </Layout.Header.Content>
-        <Layout.Header.Slot>
-          <Button
-            label={_(msg`Share`)}
-            size="small"
-            variant="ghost"
-            color="primary"
-            shape="round"
-            onPress={onShare}
-            hitSlop={HITSLOP_10}
-            style={[{right: -3}]}>
-            <ButtonIcon icon={Share} size="md" />
-          </Button>
-        </Layout.Header.Slot>
-      </Layout.Header.Outer>
       <Pager
         onPageSelected={onPageSelected}
         renderTabBar={props => (
           <Layout.Center style={[a.z_10, web([a.sticky, {top: 0}])]}>
+            <Layout.Header.Outer noBottomBorder>
+              <Layout.Header.BackButton />
+              <Layout.Header.Content>
+                <Layout.Header.TitleText>{headerTitle}</Layout.Header.TitleText>
+              </Layout.Header.Content>
+              <Layout.Header.Slot>
+                <Button
+                  label={_(msg`Share`)}
+                  size="small"
+                  variant="ghost"
+                  color="primary"
+                  shape="round"
+                  onPress={onShare}
+                  hitSlop={HITSLOP_10}
+                  style={[{right: -3}]}>
+                  <ButtonIcon icon={Share} size="md" />
+                </Button>
+              </Layout.Header.Slot>
+            </Layout.Header.Outer>
             <TabBar items={sections.map(section => section.title)} {...props} />
           </Layout.Center>
         )}