Put footer in the same panel with content to match UX design

Signed-off-by: Heng Qian <[email protected]>
qianheng-aws · Aug 30, 2024 · 662923b · 662923b
1 parent 21e2278
commit 662923b
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 12 deletions.
diff --git a/public/components/incontext_insight/generate_popover_body.tsx b/public/components/incontext_insight/generate_popover_body.tsx
@@ -141,18 +141,13 @@ export const GeneratePopoverBody: React.FC<{
     const content = showInsight && insightAvailable ? insight : summary;
     return content ? (
       <>
-        <EuiPanel
-          className="incontextInsightGeneratePopoverContent"
-          paddingSize="s"
-          hasBorder
-          hasShadow={false}
-          color="subdued"
-        >
-          <EuiText size="s">
+        <EuiPanel paddingSize="s" hasBorder hasShadow={false} color="subdued">
+          <EuiText className="incontextInsightGeneratePopoverContent" size="s">
             <EuiMarkdownFormat>{content}</EuiMarkdownFormat>
           </EuiText>
+          <EuiSpacer size={'xs'} />
+          {renderInnerFooter()}
         </EuiPanel>
-        <EuiSpacer size={'xs'} />
       </>
     ) : (
       <EuiLoadingContent aria-label="loading_content" />
@@ -232,7 +227,6 @@ export const GeneratePopoverBody: React.FC<{
     <>
       {renderInnerTitle()}
       {renderContent()}
-      {renderInnerFooter()}
     </>
   );
 };
diff --git a/public/components/incontext_insight/index.scss b/public/components/incontext_insight/index.scss
@@ -165,8 +165,7 @@
 
 .incontextInsightGeneratePopoverFooter{
   padding-block: 0 !important;
-  margin-top: 0 !important;
-  margin-bottom: 0 !important;
+  margin: 0 !important;
   border: none;
 }