use eui variable for size calc

elastic · Nov 14, 2024 · 9ffc9a0 · 9ffc9a0
1 parent b985829
commit 9ffc9a0
Showing 1 changed file with 6 additions and 2 deletions.
diff --git a/...e_analytics/pages/analytics_creation/components/view_results_panel/view_results_panel.tsx b/...e_analytics/pages/analytics_creation/components/view_results_panel/view_results_panel.tsx
@@ -7,7 +7,7 @@
 
 import type { FC } from 'react';
 import React, { Fragment } from 'react';
-import { EuiCard, EuiIcon } from '@elastic/eui';
+import { EuiCard, EuiIcon, useEuiTheme } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import type { DataFrameAnalysisConfigType } from '@kbn/ml-data-frame-analytics-utils';
 import { useMlLink } from '../../../../../contexts/kibana';
@@ -26,10 +26,14 @@ export const ViewResultsPanel: FC<Props> = ({ jobId, analysisType }) => {
     },
   });
 
+  const {
+    euiTheme: { size },
+  } = useEuiTheme();
+
   return (
     <Fragment>
       <EuiCard
-        css={{ width: '300px' }}
+        css={{ width: `calc(${size.xxl} * 7.5)` }}
         icon={<EuiIcon size="xxl" type="visTable" />}
         title={i18n.translate('xpack.ml.dataframe.analytics.create.viewResultsCardTitle', {
           defaultMessage: 'View Results',