From 51b3959a6fb25093a21601c69fd8cdae408e62e8 Mon Sep 17 00:00:00 2001
From: Matias Benary <matiasbenary@gmail.com>
Date: Tue, 26 Nov 2024 22:32:44 -0300
Subject: [PATCH] fix(navbar): correct navigation bar issue on mobile

---
 src/pages/index.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index bc2d5c77f..130143424 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -38,7 +38,7 @@ const StyledCard = ({ href, title, description }: { href: string; title: string;
   );
 };
 
-const NewsletterBanner = styled.div<{ isSidebarExpanded: boolean }>`
+const NewsletterBanner = styled.div<{ isSidebarExpanded: boolean,deviceType:string }>`
   background-color: #0072ce;
   color: white;
   padding: 8px;
@@ -46,7 +46,7 @@ const NewsletterBanner = styled.div<{ isSidebarExpanded: boolean }>`
   font-size: 14px;
   position: absolute;
   top: 0;
-  left: ${(p) => (p.isSidebarExpanded ? 'var(--sidebar-width-expanded)' : 'var(--sidebar-width-collapsed)')};
+  left: ${(p) => p.deviceType === 'mobile' ? 0:(p.isSidebarExpanded ? 'var(--sidebar-width-expanded)' : 'var(--sidebar-width-collapsed)')};
   transition: all var(--sidebar-expand-transition-speed);
   right: 0;
 
@@ -117,7 +117,7 @@ const HomePage: NextPageWithLayout = () => {
   return (
     <Section grow="available">
       {visible && (
-        <NewsletterBanner isSidebarExpanded={isSidebarExpanded}>
+        <NewsletterBanner isSidebarExpanded={isSidebarExpanded} deviceType={deviceType}>
           Stay updated!{' '}
           <a
             href="https://bit.ly/devhubnews"