[APM] Errors: Fix panels styles (#102734) (#102748)

Co-authored-by: Casper Hübertz <casper@elastic.co>
elastic · Jun 21, 2021 · 04ae473 · 04ae473
1 parent b702a61
commit 04ae473
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 4 deletions.
diff --git a/x-pack/plugins/apm/public/components/app/ErrorGroupDetails/DetailView/index.tsx b/x-pack/plugins/apm/public/components/app/ErrorGroupDetails/DetailView/index.tsx
@@ -85,7 +85,7 @@ export function DetailView({ errorGroup, urlParams }: Props) {
   const status = error.http?.response?.status_code;
 
   return (
-    <EuiPanel>
+    <EuiPanel hasBorder={true}>
       <HeaderContainer>
         <EuiTitle size="s">
           <h3>

diff --git a/x-pack/plugins/apm/public/components/app/ErrorGroupDetails/index.tsx b/x-pack/plugins/apm/public/components/app/ErrorGroupDetails/index.tsx
@@ -146,9 +146,13 @@ export function ErrorGroupDetails({
 
   return (
     <>
+      <EuiSpacer size={'s'} />
+
       <ErrorGroupHeader groupId={groupId} isUnhandled={isUnhandled} />
 
-      <EuiPanel>
+      <EuiSpacer size={'m'} />
+
+      <EuiPanel hasBorder={true}>
         {showDetails && (
           <Titles>
             <EuiText>

diff --git a/x-pack/plugins/apm/public/components/app/error_group_overview/index.tsx b/x-pack/plugins/apm/public/components/app/error_group_overview/index.tsx
@@ -73,7 +73,7 @@ export function ErrorGroupOverview({ serviceName }: ErrorGroupOverviewProps) {
   return (
     <EuiFlexGroup direction="column" gutterSize="s">
       <EuiFlexItem>
-        <EuiPanel>
+        <EuiPanel hasBorder={true}>
           <ErrorDistribution
             distribution={errorDistributionData}
             title={i18n.translate(
@@ -85,7 +85,7 @@ export function ErrorGroupOverview({ serviceName }: ErrorGroupOverviewProps) {
       </EuiFlexItem>
 
       <EuiFlexItem>
-        <EuiPanel>
+        <EuiPanel hasBorder={true}>
           <EuiTitle size="xs">
             <h3>
               {i18n.translate(