From 78b8a572d8a5a530240cc7e781182bc67f9a4dc4 Mon Sep 17 00:00:00 2001
From: ashinsabu3 <ashin.sabu@harness.io>
Date: Wed, 2 Aug 2023 19:10:42 +0530
Subject: [PATCH 1/3] fix: Fixes health icon positioning #14708

Signed-off-by: ashinsabu3 <ashin.sabu@harness.io>
---
 .../application-status-panel/application-status-panel.tsx       | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ui/src/app/applications/components/application-status-panel/application-status-panel.tsx b/ui/src/app/applications/components/application-status-panel/application-status-panel.tsx
index 480e68622075d..ffd9f6e4ffccc 100644
--- a/ui/src/app/applications/components/application-status-panel/application-status-panel.tsx
+++ b/ui/src/app/applications/components/application-status-panel/application-status-panel.tsx
@@ -72,7 +72,7 @@ export const ApplicationStatusPanel = ({application, showDiff, showOperation, sh
         <div className='application-status-panel row'>
             <div className='application-status-panel__item'>
                 <div style={{marginBottom: '1em'}}>{sectionLabel({title: 'APP HEALTH', helpContent: 'The health status of your app'})}</div>
-                <div className='application-status-panel__item-value'>
+                <div style={{alignItems: 'center'}} className='application-status-panel__item-value'>
                     <HealthStatusIcon state={application.status.health} />
                     &nbsp;
                     {application.status.health.status}

From 8bfc22739726c2685b44f3cea39d356565f81768 Mon Sep 17 00:00:00 2001
From: ashinsabu3 <ashin.sabu@harness.io>
Date: Wed, 2 Aug 2023 20:30:28 +0530
Subject: [PATCH 2/3] fix: Fixes alignment of app health application status
 panel #14708

Signed-off-by: ashinsabu3 <ashin.sabu@harness.io>
---
 .../application-status-panel/application-status-panel.scss    | 2 +-
 .../application-status-panel/application-status-panel.tsx     | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/ui/src/app/applications/components/application-status-panel/application-status-panel.scss b/ui/src/app/applications/components/application-status-panel/application-status-panel.scss
index 688be5aa727ea..52282a202d91a 100644
--- a/ui/src/app/applications/components/application-status-panel/application-status-panel.scss
+++ b/ui/src/app/applications/components/application-status-panel/application-status-panel.scss
@@ -134,7 +134,7 @@
 
     &__item-value {
         display: flex;
-        align-items: flex-end;
+        align-items: center;
         margin-bottom: 0.5em;
         font-weight: 500;
         .fa {
diff --git a/ui/src/app/applications/components/application-status-panel/application-status-panel.tsx b/ui/src/app/applications/components/application-status-panel/application-status-panel.tsx
index ffd9f6e4ffccc..f5d37893dc05c 100644
--- a/ui/src/app/applications/components/application-status-panel/application-status-panel.tsx
+++ b/ui/src/app/applications/components/application-status-panel/application-status-panel.tsx
@@ -71,8 +71,8 @@ export const ApplicationStatusPanel = ({application, showDiff, showOperation, sh
     return (
         <div className='application-status-panel row'>
             <div className='application-status-panel__item'>
-                <div style={{marginBottom: '1em'}}>{sectionLabel({title: 'APP HEALTH', helpContent: 'The health status of your app'})}</div>
-                <div style={{alignItems: 'center'}} className='application-status-panel__item-value'>
+                <div style={{marginBottom: '0.5em'}}>{sectionLabel({title: 'APP HEALTH', helpContent: 'The health status of your app'})}</div>
+                <div className='application-status-panel__item-value'>
                     <HealthStatusIcon state={application.status.health} />
                     &nbsp;
                     {application.status.health.status}

From ca067588ea3be419d369ec3b9991d38e20962954 Mon Sep 17 00:00:00 2001
From: ashinsabu3 <ashin.sabu@harness.io>
Date: Wed, 2 Aug 2023 21:25:36 +0530
Subject: [PATCH 3/3] fix: Added line height to App Status to fix its 
 positioning #14708

Signed-off-by: ashinsabu3 <ashin.sabu@harness.io>
---
 .../application-status-panel/application-status-panel.scss      | 1 +
 .../application-status-panel/application-status-panel.tsx       | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/ui/src/app/applications/components/application-status-panel/application-status-panel.scss b/ui/src/app/applications/components/application-status-panel/application-status-panel.scss
index 52282a202d91a..9898db27d2ba6 100644
--- a/ui/src/app/applications/components/application-status-panel/application-status-panel.scss
+++ b/ui/src/app/applications/components/application-status-panel/application-status-panel.scss
@@ -70,6 +70,7 @@
         }
         display: flex;
         flex-direction: column;
+        justify-content: flex-start;
         flex-shrink: 0;
         flex-grow: 0;
 
diff --git a/ui/src/app/applications/components/application-status-panel/application-status-panel.tsx b/ui/src/app/applications/components/application-status-panel/application-status-panel.tsx
index f5d37893dc05c..c82252144849c 100644
--- a/ui/src/app/applications/components/application-status-panel/application-status-panel.tsx
+++ b/ui/src/app/applications/components/application-status-panel/application-status-panel.tsx
@@ -71,7 +71,7 @@ export const ApplicationStatusPanel = ({application, showDiff, showOperation, sh
     return (
         <div className='application-status-panel row'>
             <div className='application-status-panel__item'>
-                <div style={{marginBottom: '0.5em'}}>{sectionLabel({title: 'APP HEALTH', helpContent: 'The health status of your app'})}</div>
+                <div style={{lineHeight: '19.5px', marginBottom: '0.3em'}}>{sectionLabel({title: 'APP HEALTH', helpContent: 'The health status of your app'})}</div>
                 <div className='application-status-panel__item-value'>
                     <HealthStatusIcon state={application.status.health} />
                     &nbsp;