From da8cbe785f5dcc9210f835a3725c77b3a680c4cf Mon Sep 17 00:00:00 2001
From: nimrodkra <nimrod@daily.dev>
Date: Thu, 5 Mar 2026 18:19:39 +0000
Subject: [PATCH] fix(webapp): improve mobile + button positioning with safe
 area support

Use fixed positioning and tailwindcss-safe-area offset for the
FooterPlusButton to keep it visible while scrolling and properly
spaced above the iOS home indicator bar.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 packages/webapp/components/footer/FooterPlusButton.tsx    | 2 +-
 packages/webapp/components/layouts/FooterNavBarLayout.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/webapp/components/footer/FooterPlusButton.tsx b/packages/webapp/components/footer/FooterPlusButton.tsx
index 6eb9d816583..bbc393f15fc 100644
--- a/packages/webapp/components/footer/FooterPlusButton.tsx
+++ b/packages/webapp/components/footer/FooterPlusButton.tsx
@@ -53,7 +53,7 @@ export function FooterPlusButton(): ReactElement {
         {...props}
         icon={<PlusIcon />}
         variant={ButtonVariant.Primary}
-        className="absolute bottom-24 right-4 z-1 ml-auto justify-self-center border border-border-subtlest-tertiary"
+        className="fixed right-4 z-3 border border-border-subtlest-tertiary bottom-safe-offset-16"
       />
       <RootPortal>
         <Drawer
diff --git a/packages/webapp/components/layouts/FooterNavBarLayout.tsx b/packages/webapp/components/layouts/FooterNavBarLayout.tsx
index 57b9c8fceb8..54eed125529 100644
--- a/packages/webapp/components/layouts/FooterNavBarLayout.tsx
+++ b/packages/webapp/components/layouts/FooterNavBarLayout.tsx
@@ -27,7 +27,7 @@ export default function FooterNavBarLayout({
   return (
     <>
       {children}
-      {showNav && <div className={post ? 'h-40' : 'h-16'} />}
+      {showNav && <div className={post ? 'h-40' : 'h-28'} />}
       <FooterWrapper showNav={showNav} post={post} />
     </>
   );