From d464cde4121861b80c9835f9c357c104ded03b53 Mon Sep 17 00:00:00 2001
From: Samuel Newman <mozzius@protonmail.com>
Date: Mon, 17 Nov 2025 14:59:56 +0200
Subject: [PATCH] add transparency prop to tab bar (#9336)

---
 src/components/Layout/Header/index.tsx       | 5 ++++-
 src/view/com/home/HomeHeader.tsx             | 1 +
 src/view/com/home/HomeHeaderLayoutMobile.tsx | 1 +
 src/view/com/pager/TabBar.tsx                | 4 +++-
 4 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/components/Layout/Header/index.tsx b/src/components/Layout/Header/index.tsx
index 3c895e4d8e..762223fc35 100644
--- a/src/components/Layout/Header/index.tsx
+++ b/src/components/Layout/Header/index.tsx
@@ -163,7 +163,10 @@ export function MenuButton() {
         shape="square"
         onPress={onPress}
         hitSlop={HITSLOP_30}
-        style={[{marginLeft: -BUTTON_VISUAL_ALIGNMENT_OFFSET}]}>
+        style={[
+          {marginLeft: -BUTTON_VISUAL_ALIGNMENT_OFFSET},
+          a.bg_transparent,
+        ]}>
         <ButtonIcon icon={Menu} size="lg" />
       </Button>
     </Slot>
diff --git a/src/view/com/home/HomeHeader.tsx b/src/view/com/home/HomeHeader.tsx
index 4ae3445499..4a2cf881f3 100644
--- a/src/view/com/home/HomeHeader.tsx
+++ b/src/view/com/home/HomeHeader.tsx
@@ -61,6 +61,7 @@ export function HomeHeader(
         items={items}
         dragProgress={props.dragProgress}
         dragState={props.dragState}
+        transparent
       />
     </HomeHeaderLayout>
   )
diff --git a/src/view/com/home/HomeHeaderLayoutMobile.tsx b/src/view/com/home/HomeHeaderLayoutMobile.tsx
index a0d7b3e785..ef1e938379 100644
--- a/src/view/com/home/HomeHeaderLayoutMobile.tsx
+++ b/src/view/com/home/HomeHeaderLayoutMobile.tsx
@@ -77,6 +77,7 @@ export function HomeHeaderLayoutMobile({
               style={[
                 a.justify_center,
                 {marginRight: -Layout.BUTTON_VISUAL_ALIGNMENT_OFFSET},
+                a.bg_transparent,
               ]}>
               <ButtonIcon icon={FeedsIcon} size="lg" />
             </Link>
diff --git a/src/view/com/pager/TabBar.tsx b/src/view/com/pager/TabBar.tsx
index 70358fd102..c07f44ac8b 100644
--- a/src/view/com/pager/TabBar.tsx
+++ b/src/view/com/pager/TabBar.tsx
@@ -30,6 +30,7 @@ export interface TabBarProps {
   onPressSelected?: (index: number) => void
   dragProgress: SharedValue<number>
   dragState: SharedValue<'idle' | 'dragging' | 'settling'>
+  transparent?: boolean
 }
 
 const ITEM_PADDING = 10
@@ -46,6 +47,7 @@ export function TabBar({
   onPressSelected,
   dragProgress,
   dragState,
+  transparent,
 }: TabBarProps) {
   const t = useTheme()
   const scrollElRef = useAnimatedRef<ScrollView>()
@@ -313,7 +315,7 @@ export function TabBar({
   return (
     <View
       testID={testID}
-      style={[t.atoms.bg, a.flex_row]}
+      style={[!transparent && t.atoms.bg, a.flex_row]}
       accessibilityRole="tablist">
       <BlockDrawerGesture>
         <ScrollView