From c25852f127ba44305d297aff1cfae24d5b63ed57 Mon Sep 17 00:00:00 2001
From: saumeya <saumeyakatyal@gmail.com>
Date: Fri, 28 Oct 2022 14:33:45 +0530
Subject: [PATCH] fix: ui banner covering sidebar

Signed-off-by: saumeya <saumeyakatyal@gmail.com>
---
 ui/src/app/ui-banner/ui-banner.scss | 2 +-
 ui/src/app/ui-banner/ui-banner.tsx  | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/ui/src/app/ui-banner/ui-banner.scss b/ui/src/app/ui-banner/ui-banner.scss
index 5282c904d8ec5..063b6d5b092ff 100644
--- a/ui/src/app/ui-banner/ui-banner.scss
+++ b/ui/src/app/ui-banner/ui-banner.scss
@@ -3,7 +3,7 @@
 .ui-banner {
     background: $argo-color-gray-5;
     position: fixed;
-    width: 100%;
+    width: -webkit-fill-available;
     z-index: 10;
     text-align: center;
     color: $argo-color-teal-8;
diff --git a/ui/src/app/ui-banner/ui-banner.tsx b/ui/src/app/ui-banner/ui-banner.tsx
index efd2fce6ff858..da5a0155e374d 100644
--- a/ui/src/app/ui-banner/ui-banner.tsx
+++ b/ui/src/app/ui-banner/ui-banner.tsx
@@ -43,6 +43,7 @@ export const Banner = (props: React.Props<any>) => {
                 position: string;
             }) => {
                 const heightOfBanner = permanent ? '28px' : '70px';
+                const leftOffset = prefs.hideSidebar ? '60px' : '230px';
                 let show = false;
                 if (!content || content === '' || content === null) {
                     if (prefs.hideBannerContent) {
@@ -68,7 +69,7 @@ export const Banner = (props: React.Props<any>) => {
                 }
                 return (
                     <React.Fragment>
-                        <div className={combinedBannerClassName} style={{visibility: show ? 'visible' : 'hidden', height: heightOfBanner}}>
+                        <div className={combinedBannerClassName} style={{visibility: show ? 'visible' : 'hidden', height: heightOfBanner, left: leftOffset}}>
                             <div className='ui-banner-text' style={{maxHeight: permanent ? '25px' : '50px'}}>
                                 {url !== undefined ? (
                                     <a href={url} target='_blank' rel='noopener noreferrer'>