Hotfix mobile web styling issues (#1039)

* remove hardcoded height for bottom bar

* prevent overflow of tab bar on mobile web

3 files changed, 3 insertions, 4 deletions

diff --git a/src/view/com/pager/TabBar.tsx b/src/view/com/pager/TabBar.tsx
index 9ca02a7fa..d454e89f1 100644
--- a/src/view/com/pager/TabBar.tsx
+++ b/src/view/com/pager/TabBar.tsx
@@ -117,6 +117,7 @@ const styles = isDesktopWeb
         flex: 1,
         flexDirection: 'row',
         backgroundColor: 'transparent',
+        maxWidth: '100%',
       },
       contentContainer: {
         columnGap: isMobileWeb ? 0 : 20,
diff --git a/src/view/shell/Composer.web.tsx b/src/view/shell/Composer.web.tsx
index 7eb16290a..cf850aa4f 100644
--- a/src/view/shell/Composer.web.tsx
+++ b/src/view/shell/Composer.web.tsx
@@ -5,7 +5,8 @@ import {ComposePost} from '../com/composer/Composer'
 import {ComposerOpts} from 'state/models/ui/shell'
 import {usePalette} from 'lib/hooks/usePalette'
 import {isMobileWeb} from 'platform/detection'
-import {BOTTOM_BAR_HEIGHT} from 'view/shell/bottom-bar/BottomBarStyles'
+
+const BOTTOM_BAR_HEIGHT = 61
 
 export const Composer = observer(
   ({
diff --git a/src/view/shell/bottom-bar/BottomBarStyles.tsx b/src/view/shell/bottom-bar/BottomBarStyles.tsx
index 91d285e47..f31ab44cf 100644
--- a/src/view/shell/bottom-bar/BottomBarStyles.tsx
+++ b/src/view/shell/bottom-bar/BottomBarStyles.tsx
@@ -1,11 +1,8 @@
 import {StyleSheet} from 'react-native'
 import {colors} from 'lib/styles'
 
-export const BOTTOM_BAR_HEIGHT = 61
-
 export const styles = StyleSheet.create({
   bottomBar: {
-    height: BOTTOM_BAR_HEIGHT,
     position: 'absolute',
     bottom: 0,
     left: 0,